@tsparticles/updater-gradient 3.0.0-alpha.0

package/tsparticles.updater.gradient.js

@@ -0,0 +1,486 @@
+/*!
+ * Author : Matteo Bruni
+ * MIT license: https://opensource.org/licenses/MIT
+ * Demo / Generator : https://particles.js.org/
+ * GitHub : https://www.github.com/matteobruni/tsparticles
+ * How to use? : Check the GitHub README
+ * v3.0.0-alpha.0
+ */
+(function webpackUniversalModuleDefinition(root, factory) {
+	if(typeof exports === 'object' && typeof module === 'object')
+		module.exports = factory(require("@tsparticles/engine"));
+	else if(typeof define === 'function' && define.amd)
+		define(["@tsparticles/engine"], factory);
+	else {
+		var a = typeof exports === 'object' ? factory(require("@tsparticles/engine")) : factory(root["window"]);
+		for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
+	}
+})(this, (__WEBPACK_EXTERNAL_MODULE__533__) => {
+return /******/ (() => { // webpackBootstrap
+/******/ 	"use strict";
+/******/ 	var __webpack_modules__ = ({
+
+/***/ 533:
+/***/ ((module) => {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE__533__;
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 		if (cachedModule !== undefined) {
+/******/ 			return cachedModule.exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/define property getters */
+/******/ 	(() => {
+/******/ 		// define getter functions for harmony exports
+/******/ 		__webpack_require__.d = (exports, definition) => {
+/******/ 			for(var key in definition) {
+/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
+/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
+/******/ 				}
+/******/ 			}
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+var __webpack_exports__ = {};
+// This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
+(() => {
+// ESM COMPAT FLAG
+__webpack_require__.r(__webpack_exports__);
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, {
+  "loadGradientUpdater": () => (/* binding */ loadGradientUpdater)
+});
+
+// EXTERNAL MODULE: external {"commonjs":"@tsparticles/engine","commonjs2":"@tsparticles/engine","amd":"@tsparticles/engine","root":"window"}
+var engine_root_window_ = __webpack_require__(533);
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/GradientColorOpacityAnimation.js
+
+class GradientColorOpacityAnimation {
+  constructor() {
+    this.count = 0;
+    this.enable = false;
+    this.speed = 0;
+    this.decay = 0;
+    this.sync = false;
+    this.startValue = "random";
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    if (data.count !== undefined) {
+      this.count = (0,engine_root_window_.setRangeValue)(data.count);
+    }
+    if (data.enable !== undefined) {
+      this.enable = data.enable;
+    }
+    if (data.speed !== undefined) {
+      this.speed = (0,engine_root_window_.setRangeValue)(data.speed);
+    }
+    if (data.sync !== undefined) {
+      this.sync = data.sync;
+    }
+    if (data.startValue !== undefined) {
+      this.startValue = data.startValue;
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/GradientColorOpacity.js
+
+
+class GradientColorOpacity {
+  constructor() {
+    this.value = 0;
+    this.animation = new GradientColorOpacityAnimation();
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    this.animation.load(data.animation);
+    if (data.value !== undefined) {
+      this.value = (0,engine_root_window_.setRangeValue)(data.value);
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/AnimatableGradientColor.js
+
+
+class AnimatableGradientColor {
+  constructor() {
+    this.stop = 0;
+    this.value = new engine_root_window_.AnimatableColor();
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    if (data.stop !== undefined) {
+      this.stop = data.stop;
+    }
+    this.value = engine_root_window_.AnimatableColor.create(this.value, data.value);
+    if (data.opacity !== undefined) {
+      this.opacity = new GradientColorOpacity();
+      if (typeof data.opacity === "number") {
+        this.opacity.value = data.opacity;
+      } else {
+        this.opacity.load(data.opacity);
+      }
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/GradientAngleAnimation.js
+
+class GradientAngleAnimation {
+  constructor() {
+    this.count = 0;
+    this.enable = false;
+    this.speed = 0;
+    this.decay = 0;
+    this.sync = false;
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    if (data.count !== undefined) {
+      this.count = (0,engine_root_window_.setRangeValue)(data.count);
+    }
+    if (data.enable !== undefined) {
+      this.enable = data.enable;
+    }
+    if (data.speed !== undefined) {
+      this.speed = (0,engine_root_window_.setRangeValue)(data.speed);
+    }
+    if (data.decay !== undefined) {
+      this.decay = (0,engine_root_window_.setRangeValue)(data.decay);
+    }
+    if (data.sync !== undefined) {
+      this.sync = data.sync;
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/GradientAngle.js
+
+class GradientAngle {
+  constructor() {
+    this.value = 0;
+    this.animation = new GradientAngleAnimation();
+    this.direction = "clockwise";
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    this.animation.load(data.animation);
+    if (data.value !== undefined) {
+      this.value = data.value;
+    }
+    if (data.direction !== undefined) {
+      this.direction = data.direction;
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/Options/Classes/AnimatableGradient.js
+
+
+class AnimatableGradient {
+  constructor() {
+    this.angle = new GradientAngle();
+    this.colors = [];
+    this.type = "random";
+  }
+  load(data) {
+    if (!data) {
+      return;
+    }
+    this.angle.load(data.angle);
+    if (data.colors !== undefined) {
+      this.colors = data.colors.map(s => {
+        const tmp = new AnimatableGradientColor();
+        tmp.load(s);
+        return tmp;
+      });
+    }
+    if (data.type !== undefined) {
+      this.type = data.type;
+    }
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/GradientUpdater.js
+
+
+function updateColorOpacity(delta, value) {
+  var _a, _b, _c;
+  if (!value.enable) {
+    return;
+  }
+  const decay = (_a = value.decay) !== null && _a !== void 0 ? _a : 1;
+  switch (value.status) {
+    case "increasing":
+      if (value.value >= value.max) {
+        value.status = "decreasing";
+      } else {
+        value.value += ((_b = value.velocity) !== null && _b !== void 0 ? _b : 0) * delta.factor;
+      }
+      break;
+    case "decreasing":
+      if (value.value <= value.min) {
+        value.status = "increasing";
+      } else {
+        value.value -= ((_c = value.velocity) !== null && _c !== void 0 ? _c : 0) * delta.factor;
+      }
+      break;
+  }
+  if (value.velocity && decay !== 1) {
+    value.velocity *= decay;
+  }
+}
+function updateColorValue(delta, value, max, decrease) {
+  var _a, _b;
+  const colorValue = value;
+  if (!colorValue || !colorValue.enable) {
+    return;
+  }
+  const velocity = ((_a = value.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor,
+    decay = (_b = value.decay) !== null && _b !== void 0 ? _b : 1;
+  if (!decrease || colorValue.status === "increasing") {
+    colorValue.value += velocity;
+    if (decrease && colorValue.value > max) {
+      colorValue.status = "decreasing";
+      colorValue.value -= colorValue.value % max;
+    }
+  } else {
+    colorValue.value -= velocity;
+    if (colorValue.value < 0) {
+      colorValue.status = "increasing";
+      colorValue.value += colorValue.value;
+    }
+  }
+  if (colorValue.value > max) {
+    colorValue.value %= max;
+  }
+  if (value.velocity && decay !== 1) {
+    value.velocity *= decay;
+  }
+}
+function updateAngle(delta, angle) {
+  var _a, _b;
+  const speed = ((_a = angle.velocity) !== null && _a !== void 0 ? _a : 0) * delta.factor,
+    max = 2 * Math.PI,
+    decay = (_b = angle.decay) !== null && _b !== void 0 ? _b : 1;
+  if (!angle.enable) {
+    return;
+  }
+  switch (angle.status) {
+    case "increasing":
+      angle.value += speed;
+      if (angle.value > max) {
+        angle.value -= max;
+      }
+      break;
+    case "decreasing":
+    default:
+      angle.value -= speed;
+      if (angle.value < 0) {
+        angle.value += max;
+      }
+      break;
+  }
+  if (angle.velocity && decay !== 1) {
+    angle.velocity *= decay;
+  }
+}
+function updateGradient(particle, delta) {
+  var _a, _b, _c;
+  const gradient = particle.gradient;
+  if (!gradient) {
+    return;
+  }
+  updateAngle(delta, gradient.angle);
+  for (const color of gradient.colors) {
+    if (((_a = particle.color) === null || _a === void 0 ? void 0 : _a.h) !== undefined) {
+      updateColorValue(delta, color.value.h, 360, false);
+    }
+    if (((_b = particle.color) === null || _b === void 0 ? void 0 : _b.s) !== undefined) {
+      updateColorValue(delta, color.value.s, 100, true);
+    }
+    if (((_c = particle.color) === null || _c === void 0 ? void 0 : _c.l) !== undefined) {
+      updateColorValue(delta, color.value.l, 100, true);
+    }
+    if (color.opacity) {
+      updateColorOpacity(delta, color.opacity);
+    }
+  }
+}
+class GradientUpdater {
+  getColorStyles(particle, context, radius, opacity) {
+    var _a, _b;
+    const gradient = particle.gradient;
+    if (!gradient) {
+      return {};
+    }
+    const gradientAngle = gradient.angle.value,
+      fillGradient = gradient.type === "radial" ? context.createRadialGradient(0, 0, 0, 0, 0, radius) : context.createLinearGradient(Math.cos(gradientAngle) * -radius, Math.sin(gradientAngle) * -radius, Math.cos(gradientAngle) * radius, Math.sin(gradientAngle) * radius);
+    for (const color of gradient.colors) {
+      fillGradient.addColorStop(color.stop, (0,engine_root_window_.getStyleFromHsl)({
+        h: color.value.h.value,
+        s: color.value.s.value,
+        l: color.value.l.value
+      }, (_b = (_a = color.opacity) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : opacity));
+    }
+    return {
+      fill: fillGradient
+    };
+  }
+  init(particle) {
+    const gradient = (0,engine_root_window_.itemFromSingleOrMultiple)(particle.options.gradient);
+    if (!gradient) {
+      return;
+    }
+    particle.gradient = {
+      angle: {
+        value: gradient.angle.value,
+        enable: gradient.angle.animation.enable,
+        velocity: (0,engine_root_window_.getRangeValue)(gradient.angle.animation.speed) / 360 * particle.container.retina.reduceFactor,
+        decay: 1 - (0,engine_root_window_.getRangeValue)(gradient.angle.animation.decay)
+      },
+      type: gradient.type,
+      colors: []
+    };
+    let rotateDirection = gradient.angle.direction;
+    if (rotateDirection === "random") {
+      const index = Math.floor((0,engine_root_window_.getRandom)() * 2);
+      rotateDirection = index > 0 ? "counter-clockwise" : "clockwise";
+    }
+    switch (rotateDirection) {
+      case "counter-clockwise":
+      case "counterClockwise":
+        particle.gradient.angle.status = "decreasing";
+        break;
+      case "clockwise":
+        particle.gradient.angle.status = "increasing";
+        break;
+    }
+    const reduceDuplicates = particle.options.reduceDuplicates;
+    for (const grColor of gradient.colors) {
+      const grHslColor = (0,engine_root_window_.rangeColorToHsl)(grColor.value, particle.id, reduceDuplicates);
+      if (!grHslColor) {
+        continue;
+      }
+      const grHslAnimation = (0,engine_root_window_.getHslAnimationFromHsl)(grHslColor, grColor.value.animation, particle.container.retina.reduceFactor),
+        addColor = {
+          stop: grColor.stop,
+          value: grHslAnimation,
+          opacity: grColor.opacity ? {
+            enable: grColor.opacity.animation.enable,
+            max: (0,engine_root_window_.getRangeMax)(grColor.opacity.value),
+            min: (0,engine_root_window_.getRangeMin)(grColor.opacity.value),
+            status: "increasing",
+            value: (0,engine_root_window_.getRangeValue)(grColor.opacity.value),
+            velocity: (0,engine_root_window_.getRangeValue)(grColor.opacity.animation.speed) / 100 * particle.container.retina.reduceFactor,
+            decay: 1 - (0,engine_root_window_.getRangeValue)(grColor.opacity.animation.decay)
+          } : undefined
+        };
+      if (grColor.opacity && addColor.opacity) {
+        const opacityRange = grColor.opacity.value;
+        addColor.opacity.min = (0,engine_root_window_.getRangeMin)(opacityRange);
+        addColor.opacity.max = (0,engine_root_window_.getRangeMax)(opacityRange);
+        const opacityAnimation = grColor.opacity.animation;
+        switch (opacityAnimation.startValue) {
+          case "min":
+            addColor.opacity.value = addColor.opacity.min;
+            addColor.opacity.status = "increasing";
+            break;
+          case "random":
+            addColor.opacity.value = (0,engine_root_window_.randomInRange)(addColor.opacity);
+            addColor.opacity.status = (0,engine_root_window_.getRandom)() >= 0.5 ? "increasing" : "decreasing";
+            break;
+          case "max":
+          default:
+            addColor.opacity.value = addColor.opacity.max;
+            addColor.opacity.status = "decreasing";
+            break;
+        }
+      }
+      particle.gradient.colors.push(addColor);
+    }
+  }
+  isEnabled(particle) {
+    var _a, _b, _c;
+    return !particle.destroyed && !particle.spawning && (((_a = particle.gradient) === null || _a === void 0 ? void 0 : _a.angle.enable) || ((_c = (_b = particle.gradient) === null || _b === void 0 ? void 0 : _b.colors.some(c => c.value.h.enable || c.value.s.enable || c.value.l.enable)) !== null && _c !== void 0 ? _c : false));
+  }
+  loadOptions(options, ...sources) {
+    for (const source of sources) {
+      if (!(source === null || source === void 0 ? void 0 : source.gradient)) {
+        continue;
+      }
+      const gradientToLoad = source.gradient;
+      if (!gradientToLoad) {
+        continue;
+      }
+      options.gradient = (0,engine_root_window_.executeOnSingleOrMultiple)(gradientToLoad, gradient => {
+        const tmp = new AnimatableGradient();
+        tmp.load(gradient);
+        return tmp;
+      });
+    }
+  }
+  update(particle, delta) {
+    updateGradient(particle, delta);
+  }
+}
+;// CONCATENATED MODULE: ./dist/browser/index.js
+
+function loadGradientUpdater(engine) {
+  engine.addParticleUpdater("gradient", () => new GradientUpdater());
+}
+})();
+
+/******/ 	return __webpack_exports__;
+/******/ })()
+;
+});

package/tsparticles.updater.gradient.min.js

@@ -0,0 +1,2 @@
+/*! For license information please see tsparticles.updater.gradient.min.js.LICENSE.txt */
+!function(e,a){if("object"==typeof exports&&"object"==typeof module)module.exports=a(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],a);else{var t="object"==typeof exports?a(require("@tsparticles/engine")):a(e.window);for(var o in t)("object"==typeof exports?exports:e)[o]=t[o]}}(this,(e=>(()=>{"use strict";var a={533:a=>{a.exports=e}},t={};function o(e){var i=t[e];if(void 0!==i)return i.exports;var n=t[e]={exports:{}};return a[e](n,n.exports,o),n.exports}o.d=(e,a)=>{for(var t in a)o.o(a,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:a[t]})},o.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{o.r(i),o.d(i,{loadGradientUpdater:()=>p});var e=o(533);class a{constructor(){this.count=0,this.enable=!1,this.speed=0,this.decay=0,this.sync=!1,this.startValue="random"}load(a){a&&(void 0!==a.count&&(this.count=(0,e.setRangeValue)(a.count)),void 0!==a.enable&&(this.enable=a.enable),void 0!==a.speed&&(this.speed=(0,e.setRangeValue)(a.speed)),void 0!==a.sync&&(this.sync=a.sync),void 0!==a.startValue&&(this.startValue=a.startValue))}}class t{constructor(){this.value=0,this.animation=new a}load(a){a&&(this.animation.load(a.animation),void 0!==a.value&&(this.value=(0,e.setRangeValue)(a.value)))}}class n{constructor(){this.stop=0,this.value=new e.AnimatableColor}load(a){a&&(void 0!==a.stop&&(this.stop=a.stop),this.value=e.AnimatableColor.create(this.value,a.value),void 0!==a.opacity&&(this.opacity=new t,"number"==typeof a.opacity?this.opacity.value=a.opacity:this.opacity.load(a.opacity)))}}class l{constructor(){this.count=0,this.enable=!1,this.speed=0,this.decay=0,this.sync=!1}load(a){a&&(void 0!==a.count&&(this.count=(0,e.setRangeValue)(a.count)),void 0!==a.enable&&(this.enable=a.enable),void 0!==a.speed&&(this.speed=(0,e.setRangeValue)(a.speed)),void 0!==a.decay&&(this.decay=(0,e.setRangeValue)(a.decay)),void 0!==a.sync&&(this.sync=a.sync))}}class s{constructor(){this.value=0,this.animation=new l,this.direction="clockwise"}load(e){e&&(this.animation.load(e.animation),void 0!==e.value&&(this.value=e.value),void 0!==e.direction&&(this.direction=e.direction))}}class c{constructor(){this.angle=new s,this.colors=[],this.type="random"}load(e){e&&(this.angle.load(e.angle),void 0!==e.colors&&(this.colors=e.colors.map((e=>{const a=new n;return a.load(e),a}))),void 0!==e.type&&(this.type=e.type))}}function r(e,a){var t,o,i;if(!a.enable)return;const n=null!==(t=a.decay)&&void 0!==t?t:1;switch(a.status){case"increasing":a.value>=a.max?a.status="decreasing":a.value+=(null!==(o=a.velocity)&&void 0!==o?o:0)*e.factor;break;case"decreasing":a.value<=a.min?a.status="increasing":a.value-=(null!==(i=a.velocity)&&void 0!==i?i:0)*e.factor}a.velocity&&1!==n&&(a.velocity*=n)}function u(e,a,t,o){var i,n;const l=a;if(!l||!l.enable)return;const s=(null!==(i=a.velocity)&&void 0!==i?i:0)*e.factor,c=null!==(n=a.decay)&&void 0!==n?n:1;o&&"increasing"!==l.status?(l.value-=s,l.value<0&&(l.status="increasing",l.value+=l.value)):(l.value+=s,o&&l.value>t&&(l.status="decreasing",l.value-=l.value%t)),l.value>t&&(l.value%=t),a.velocity&&1!==c&&(a.velocity*=c)}function d(e,a){var t,o,i;const n=e.gradient;if(n){!function(e,a){var t,o;const i=(null!==(t=a.velocity)&&void 0!==t?t:0)*e.factor,n=2*Math.PI,l=null!==(o=a.decay)&&void 0!==o?o:1;a.enable&&("increasing"===a.status?(a.value+=i,a.value>n&&(a.value-=n)):(a.value-=i,a.value<0&&(a.value+=n)),a.velocity&&1!==l&&(a.velocity*=l))}(a,n.angle);for(const l of n.colors)void 0!==(null===(t=e.color)||void 0===t?void 0:t.h)&&u(a,l.value.h,360,!1),void 0!==(null===(o=e.color)||void 0===o?void 0:o.s)&&u(a,l.value.s,100,!0),void 0!==(null===(i=e.color)||void 0===i?void 0:i.l)&&u(a,l.value.l,100,!0),l.opacity&&r(a,l.opacity)}}class v{getColorStyles(a,t,o,i){var n,l;const s=a.gradient;if(!s)return{};const c=s.angle.value,r="radial"===s.type?t.createRadialGradient(0,0,0,0,0,o):t.createLinearGradient(Math.cos(c)*-o,Math.sin(c)*-o,Math.cos(c)*o,Math.sin(c)*o);for(const a of s.colors)r.addColorStop(a.stop,(0,e.getStyleFromHsl)({h:a.value.h.value,s:a.value.s.value,l:a.value.l.value},null!==(l=null===(n=a.opacity)||void 0===n?void 0:n.value)&&void 0!==l?l:i));return{fill:r}}init(a){const t=(0,e.itemFromSingleOrMultiple)(a.options.gradient);if(!t)return;a.gradient={angle:{value:t.angle.value,enable:t.angle.animation.enable,velocity:(0,e.getRangeValue)(t.angle.animation.speed)/360*a.container.retina.reduceFactor,decay:1-(0,e.getRangeValue)(t.angle.animation.decay)},type:t.type,colors:[]};let o=t.angle.direction;if("random"===o){o=Math.floor(2*(0,e.getRandom)())>0?"counter-clockwise":"clockwise"}switch(o){case"counter-clockwise":case"counterClockwise":a.gradient.angle.status="decreasing";break;case"clockwise":a.gradient.angle.status="increasing"}const i=a.options.reduceDuplicates;for(const o of t.colors){const t=(0,e.rangeColorToHsl)(o.value,a.id,i);if(!t)continue;const n=(0,e.getHslAnimationFromHsl)(t,o.value.animation,a.container.retina.reduceFactor),l={stop:o.stop,value:n,opacity:o.opacity?{enable:o.opacity.animation.enable,max:(0,e.getRangeMax)(o.opacity.value),min:(0,e.getRangeMin)(o.opacity.value),status:"increasing",value:(0,e.getRangeValue)(o.opacity.value),velocity:(0,e.getRangeValue)(o.opacity.animation.speed)/100*a.container.retina.reduceFactor,decay:1-(0,e.getRangeValue)(o.opacity.animation.decay)}:void 0};if(o.opacity&&l.opacity){const a=o.opacity.value;l.opacity.min=(0,e.getRangeMin)(a),l.opacity.max=(0,e.getRangeMax)(a);switch(o.opacity.animation.startValue){case"min":l.opacity.value=l.opacity.min,l.opacity.status="increasing";break;case"random":l.opacity.value=(0,e.randomInRange)(l.opacity),l.opacity.status=(0,e.getRandom)()>=.5?"increasing":"decreasing";break;default:l.opacity.value=l.opacity.max,l.opacity.status="decreasing"}}a.gradient.colors.push(l)}}isEnabled(e){var a,t,o;return!e.destroyed&&!e.spawning&&((null===(a=e.gradient)||void 0===a?void 0:a.angle.enable)||null!==(o=null===(t=e.gradient)||void 0===t?void 0:t.colors.some((e=>e.value.h.enable||e.value.s.enable||e.value.l.enable)))&&void 0!==o&&o)}loadOptions(a,...t){for(const o of t){if(!(null==o?void 0:o.gradient))continue;const t=o.gradient;t&&(a.gradient=(0,e.executeOnSingleOrMultiple)(t,(e=>{const a=new c;return a.load(e),a})))}}update(e,a){d(e,a)}}function p(e){e.addParticleUpdater("gradient",(()=>new v))}})(),i})()));

package/tsparticles.updater.gradient.min.js.LICENSE.txt

@@ -0,0 +1,8 @@
+/*!
+ * Author : Matteo Bruni
+ * MIT license: https://opensource.org/licenses/MIT
+ * Demo / Generator : https://particles.js.org/
+ * GitHub : https://www.github.com/matteobruni/tsparticles
+ * How to use? : Check the GitHub README
+ * v3.0.0-alpha.0
+ */

package/types/GradientUpdater.d.ts

@@ -0,0 +1,32 @@
+import { GradientType } from "@tsparticles/engine";
+import type { IDelta, IParticleColorStyle, IParticleHslAnimation, IParticleNumericValueAnimation, IParticleUpdater, IParticleValueAnimation, IParticlesOptions, Particle, ParticlesOptions, RecursivePartial, SingleOrMultiple } from "@tsparticles/engine";
+import { AnimatableGradient } from "./Options/Classes/AnimatableGradient";
+import type { IAnimatableGradient } from "./Options/Interfaces/IAnimatableGradient";
+interface IParticleGradientColorAnimation {
+    opacity?: IParticleNumericValueAnimation;
+    stop: number;
+    value: IParticleHslAnimation;
+}
+interface IParticleGradientAnimation {
+    angle: IParticleValueAnimation<number>;
+    colors: IParticleGradientColorAnimation[];
+    type: GradientType;
+}
+type GradientParticle = Particle & {
+    gradient?: IParticleGradientAnimation;
+    options: GradientParticlesOptions;
+};
+type IGradientParticlesOptions = IParticlesOptions & {
+    gradient?: SingleOrMultiple<IAnimatableGradient>;
+};
+type GradientParticlesOptions = ParticlesOptions & {
+    gradient?: SingleOrMultiple<AnimatableGradient>;
+};
+export declare class GradientUpdater implements IParticleUpdater {
+    getColorStyles(particle: GradientParticle, context: CanvasRenderingContext2D, radius: number, opacity: number): IParticleColorStyle;
+    init(particle: GradientParticle): void;
+    isEnabled(particle: GradientParticle): boolean;
+    loadOptions(options: GradientParticlesOptions, ...sources: (RecursivePartial<IGradientParticlesOptions> | undefined)[]): void;
+    update(particle: GradientParticle, delta: IDelta): void;
+}
+export {};

package/types/Options/Classes/AnimatableGradient.d.ts

@@ -0,0 +1,12 @@
+import type { IOptionLoader, RecursivePartial } from "@tsparticles/engine";
+import { AnimatableGradientColor } from "./AnimatableGradientColor";
+import { GradientAngle } from "./GradientAngle";
+import { GradientType } from "@tsparticles/engine";
+import type { IAnimatableGradient } from "../Interfaces/IAnimatableGradient";
+export declare class AnimatableGradient implements IAnimatableGradient, IOptionLoader<IAnimatableGradient> {
+    angle: GradientAngle;
+    colors: AnimatableGradientColor[];
+    type: GradientType;
+    constructor();
+    load(data?: RecursivePartial<IAnimatableGradient>): void;
+}

package/types/Options/Classes/AnimatableGradientColor.d.ts

@@ -0,0 +1,11 @@
+import type { IOptionLoader, RecursivePartial } from "@tsparticles/engine";
+import { AnimatableColor } from "@tsparticles/engine";
+import { GradientColorOpacity } from "./GradientColorOpacity";
+import type { IAnimatableGradientColor } from "../Interfaces/IOptionsGradient";
+export declare class AnimatableGradientColor implements IAnimatableGradientColor, IOptionLoader<IAnimatableGradientColor> {
+    opacity?: GradientColorOpacity;
+    stop: number;
+    value: AnimatableColor;
+    constructor();
+    load(data?: RecursivePartial<IAnimatableGradientColor>): void;
+}

package/types/Options/Classes/GradientAngle.d.ts

@@ -0,0 +1,11 @@
+import type { IAnimatable, IAnimation, IOptionLoader, RecursivePartial, RotateDirectionAlt } from "@tsparticles/engine";
+import { GradientAngleAnimation } from "./GradientAngleAnimation";
+import type { IGradientAngle } from "../Interfaces/Gradients";
+import { RotateDirection } from "@tsparticles/engine";
+export declare class GradientAngle implements IGradientAngle, IAnimatable<IAnimation>, IOptionLoader<IGradientAngle & IAnimatable<IAnimation>> {
+    animation: GradientAngleAnimation;
+    direction: RotateDirection | keyof typeof RotateDirection | RotateDirectionAlt;
+    value: number;
+    constructor();
+    load(data?: RecursivePartial<IGradientAngle & IAnimatable<IAnimation>>): void;
+}

package/types/Options/Classes/GradientAngleAnimation.d.ts

@@ -0,0 +1,10 @@
+import type { IAnimation, IOptionLoader, RangeValue, RecursivePartial } from "@tsparticles/engine";
+export declare class GradientAngleAnimation implements IAnimation, IOptionLoader<IAnimation> {
+    count: RangeValue;
+    decay: RangeValue;
+    enable: boolean;
+    speed: RangeValue;
+    sync: boolean;
+    constructor();
+    load(data?: RecursivePartial<IAnimation>): void;
+}

package/types/Options/Classes/GradientColorOpacity.d.ts

@@ -0,0 +1,10 @@
+import type { IAnimatable, IAnimation, IOptionLoader, RangeValue, RecursivePartial } from "@tsparticles/engine";
+import { GradientColorOpacityAnimation } from "./GradientColorOpacityAnimation";
+import type { IGradientColorOpacity } from "../Interfaces/Gradients";
+import type { IGradientColorOpacityAnimation } from "../Interfaces/IOptionsGradient";
+export declare class GradientColorOpacity implements IGradientColorOpacity, IAnimatable<GradientColorOpacityAnimation>, IOptionLoader<IGradientColorOpacity & IAnimatable<IGradientColorOpacityAnimation>> {
+    animation: GradientColorOpacityAnimation;
+    value: RangeValue;
+    constructor();
+    load(data?: RecursivePartial<IGradientColorOpacity & IAnimatable<IAnimation>>): void;
+}

package/types/Options/Classes/GradientColorOpacityAnimation.d.ts

@@ -0,0 +1,13 @@
+import type { IOptionLoader, RangeValue, RecursivePartial } from "@tsparticles/engine";
+import { StartValueType } from "@tsparticles/engine";
+import type { IGradientColorOpacityAnimation } from "../Interfaces/IOptionsGradient";
+export declare class GradientColorOpacityAnimation implements IGradientColorOpacityAnimation, IOptionLoader<IGradientColorOpacityAnimation> {
+    count: RangeValue;
+    decay: RangeValue;
+    enable: boolean;
+    speed: RangeValue;
+    startValue: StartValueType | keyof typeof StartValueType;
+    sync: boolean;
+    constructor();
+    load(data?: RecursivePartial<IGradientColorOpacityAnimation>): void;
+}

package/types/Options/Interfaces/Gradients.d.ts

@@ -0,0 +1,18 @@
+import type { GradientType, IOptionsColor, RangeValue, RotateDirection, RotateDirectionAlt } from "@tsparticles/engine";
+export interface IGradientColorOpacity {
+    value: RangeValue;
+}
+export interface IGradientColor {
+    opacity?: IGradientColorOpacity | number;
+    stop: number;
+    value: IOptionsColor;
+}
+export interface IGradientAngle {
+    direction: RotateDirection | keyof typeof RotateDirection | RotateDirectionAlt;
+    value: number;
+}
+export interface IGradient {
+    angle?: IGradientAngle;
+    colors: IGradientColor[];
+    type: GradientType;
+}

package/types/Options/Interfaces/IAnimatableGradient.d.ts

@@ -0,0 +1,7 @@
+import type { IAnimatable, IAnimation } from "@tsparticles/engine";
+import type { IAnimatableGradientColor, IOptionsGradient } from "./IOptionsGradient";
+import type { IGradientAngle } from "./Gradients";
+export type IAnimatableGradient = IOptionsGradient & {
+    angle: IGradientAngle & IAnimatable<IAnimation>;
+    colors: IAnimatableGradientColor[];
+};

package/types/Options/Interfaces/IOptionsGradient.d.ts

@@ -0,0 +1,10 @@
+import type { IAnimatable, IAnimatableColor, IAnimation, StartValueType } from "@tsparticles/engine";
+import type { IGradient, IGradientColor, IGradientColorOpacity } from "./Gradients";
+export interface IGradientColorOpacityAnimation extends IAnimation {
+    startValue: StartValueType | keyof typeof StartValueType;
+}
+export interface IAnimatableGradientColor extends IGradientColor {
+    opacity?: (IGradientColorOpacity & IAnimatable<IGradientColorOpacityAnimation>) | number;
+    value: IAnimatableColor;
+}
+export type IOptionsGradient = IGradient;

package/types/index.d.ts

@@ -0,0 +1,2 @@
+import type { Engine } from "@tsparticles/engine";
+export declare function loadGradientUpdater(engine: Engine): void;