tsparticles 1.35.4 → 1.37.2

package/browser/Options/Interfaces/Background/IBackground.d.ts

@@ -1,9 +1,44 @@
 import type { IColor } from "../../../Core/Interfaces/Colors";
+/**
+ * The background options used by the canvas element, it's not drawn, it's applied in the style
+ * [[include:Options/Background.md]]
+ * @category Options
+ */
 export interface IBackground {
+    /**
+     * The `color` property can be set to a HEX string or to a {@link IColor | color object}, that is the same as the one used in `particles.color` options.
+     *
+     * This color is set to canvas style `background-color` property, if this property is not set the background will be transparent.
+     */
     color: IColor | string;
+    /**
+     * The `image` property sets the canvas style `background-image` property.
+     *
+     * This property doesn't have a default value, anyway if you need a background image you need to specify the same CSS syntax with the `url()` function.
+     */
     image: string;
+    /**
+     * The `opacity` property sets the `color` property opacity, so you can set a semi-transparent background.
+     *
+     * This value is by default to `1` and it accepts any value between `0` and `1` included.
+     */
     opacity: number;
+    /**
+     * The `position` property sets the canvas style `background-position` property.
+     *
+     * This [link](https://developer.mozilla.org/en-US/docs/Web/CSS/background-position) can be useful to set the right value to this property.
+     */
     position: string;
+    /**
+     * The `repeat` property sets the canvas style `background-repeat` property.
+     *
+     * This [link](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat) can be useful to set the right value to this property.
+     */
     repeat: string;
+    /**
+     * The `size` property sets the canvas style `background-size` property.
+     *
+     * This [link](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size) can be useful to set the right value to this property.
+     */
     size: string;
 }

package/browser/Options/Interfaces/BackgroundMask/IBackgroundMask.d.ts

@@ -1,7 +1,28 @@
 import type { IColor } from "../../../Core/Interfaces/Colors";
 import type { IBackgroundMaskCover } from "./IBackgroundMaskCover";
+/**
+ * The options to apply a base color to canvas to cover what's behind
+ * The particles will unveil what is covered by the canvas
+ * [[include:Options/BackgroundMask.md]]
+ * @category Options
+ */
 export interface IBackgroundMask {
+    /**
+     * This property is used to choose the composition mode for the background mask effect.
+     *
+     * The default value is `destination-out`, which unveils the background below using drawn elements, any other valid value
+     * can be found [here](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation)
+     */
     composite: string;
+    /**
+     * The `cover` property can be set to a HEX string or to a {@link IColor | color object}, that is the same as the one used
+     * in `particles.color` options.
+     *
+     * The `cover` can also be a {@link IBackgroundMaskCover | cover object} like the one described below.
+     */
     cover: IBackgroundMaskCover | IColor | string;
+    /**
+     * This property set the background mask mode, this mode enables the `composite` option to all elements drawn.
+     */
     enable: boolean;
 }

package/browser/Options/Interfaces/BackgroundMask/IBackgroundMaskCover.d.ts

@@ -1,5 +1,15 @@
 import type { IColor } from "../../../Core/Interfaces/Colors";
+/**
+ * The background cover customization
+ * @category Options
+ */
 export interface IBackgroundMaskCover {
+    /**
+     * The background color hiding all elements behind, string or [[IColor]] value.
+     */
     color: IColor | string;
+    /**
+     * The opacity of the background
+     */
     opacity: number;
 }

package/browser/Options/Interfaces/FullScreen/IFullScreen.d.ts

@@ -1,4 +1,20 @@
+/**
+ * The options to set the particles in the background using CSS `fixed` position
+ * The [[zIndex]] property sets the background CSS `z-index` property
+ * [[include:Options/FullScreen.md]]
+ * @category Options
+ */
 export interface IFullScreen {
+    /**
+     * This property sets the canvas to a full window size acting like a background, the most common configuration. The default value is `false` since many already have different configurations.
+     *
+     * This is really helpful since there's no need to write CSS code to have a full size tsParticles instance.
+     */
     enable: boolean;
+    /**
+     * This is the CSS `z-index` property set to the canvas.
+     *
+     * If the `z-index` is less than `0` the mouse interactions works only with the `interactivity.detectsOn` set to `window`.
+     */
     zIndex: number;
 }

package/browser/Options/Interfaces/IAnimatableColor.d.ts

@@ -1,6 +1,14 @@
 import type { IOptionsColor } from "./IOptionsColor";
 import type { IColorAnimation } from "./IColorAnimation";
 import type { IHslAnimation } from "./IHslAnimation";
+/**
+ * The animatable color interface, it provides all the necessary properties to create a color animation
+ * [[include:Options/Particles/Color.md]]
+ * @category Options
+ */
 export interface IAnimatableColor extends IOptionsColor {
+    /**
+     * The color animation property
+     */
     animation: IColorAnimation | IHslAnimation;
 }

package/browser/Options/Interfaces/IAnimation.d.ts

@@ -1,6 +1,16 @@
 export interface IAnimation {
     count: number;
+    /**
+     * Enables/disables the animation
+     */
     enable: boolean;
+    /**
+     * Speed animation
+     */
     speed: number;
+    /**
+     * Enables the sync animations for the particles created at the same time
+     * pushed or emitter particles will be out of sync
+     */
     sync: boolean;
 }

package/browser/Options/Interfaces/IColorAnimation.d.ts

@@ -1,5 +1,12 @@
+/**
+ * Color animation interface, these properties are used to animate colors
+ * @category Options
+ */
 import type { RangeValue } from "../../Types";
 import type { IAnimation } from "./IAnimation";
 export interface IColorAnimation extends IAnimation {
+    /**
+     * The value offset percent applied to color hue
+     */
     offset: RangeValue;
 }

package/browser/Options/Interfaces/IColorAnimation.js

@@ -1 +1,5 @@
+/**
+ * Color animation interface, these properties are used to animate colors
+ * @category Options
+ */
 export {};

package/browser/Options/Interfaces/IManualParticle.d.ts

@@ -1,7 +1,18 @@
 import type { ICoordinates } from "../../Core/Interfaces/ICoordinates";
 import type { IParticles } from "./Particles/IParticles";
 import type { RecursivePartial } from "../../Types";
+/**
+ * Manual particles options
+ * [[include:Options/ManualParticles.md]]
+ * @category options
+ */
 export interface IManualParticle {
+    /**
+     * Particle position in canvas size percent, if undefined a random position will be used
+     */
     position?: ICoordinates;
+    /**
+     * Particle options, this properties will override the general particles configuration
+     */
     options?: RecursivePartial<IParticles>;
 }

package/browser/Options/Interfaces/IOptionLoader.d.ts

@@ -1,4 +1,13 @@
 import type { RecursivePartial } from "../../Types";
+/**
+ * This interface is used by the [[Options]] class to have a [[load]] method to set all needed properties from source
+ * @typeParam T the options interface to load
+ * @category Options
+ */
 export interface IOptionLoader<T> {
+    /**
+     * This load method is used to load [[data]] in the classes used as generic
+     * @param data the input options
+     */
     load(data?: RecursivePartial<T>): void;
 }

package/browser/Options/Interfaces/IOptions.d.ts

@@ -8,26 +8,97 @@ import type { IFullScreen } from "./FullScreen/IFullScreen";
 import type { IMotion } from "./Motion/IMotion";
 import type { IManualParticle } from "./IManualParticle";
 import type { IResponsive } from "./IResponsive";
+/**
+ * The Options interface, defines all the options that can be used by `tsParticles`
+ * [[include:Options.md]]
+ * @category Options
+ */
 export interface IOptions {
+    /**
+     * Sets if the animations should start automatically or manually
+     */
     autoPlay: boolean;
+    /**
+     * Background options, these background options will be used to the canvas element, they are all CSS properties
+     */
     background: IBackground;
+    /**
+     * Background Mask options, what's behind the canvas will become hidden and particles will uncover it
+     */
     backgroundMask: IBackgroundMask;
+    /**
+     * Sets the animated background mode for particles canvas bringing it to the back
+     * @deprecated use the new fullScreen instead
+     */
     backgroundMode: RecursivePartial<IFullScreen> | boolean;
+    /**
+     * Enables the retina detection, if disabled the ratio used by canvas will be always 1 and not the device setting.
+     */
     detectRetina: boolean;
+    /**
+     * The Particles effect duration in seconds, then the container will be destroyed
+     */
     duration: RangeValue;
+    /**
+     * The Frame Per Second limit applied to all particles animations.
+     * @deprecated use the new fpsLimit instead
+     */
     fps_limit: number;
+    /**
+     * The FPS (Frame Per Second) limit applied to all particles animations.
+     */
     fpsLimit: number;
+    /**
+     * Sets the animated background mode for particles canvas bringing it to the back
+     */
     fullScreen: RecursivePartial<IFullScreen> | boolean;
+    /**
+     * The particles interaction options
+     */
     interactivity: IInteractivity;
+    /**
+     * Particles inserted at load time with a specific position
+     */
     manualParticles: IManualParticle[];
+    /**
+     * Handles user's preferences about motion
+     */
     motion: IMotion;
+    /**
+     * The particles options
+     */
     particles: IParticles;
+    /**
+     * Enables or disabled the animation on window blur
+     */
     pauseOnBlur: boolean;
+    /**
+     * Enable or disabled the animation if the element is outside the viewport
+     */
     pauseOnOutsideViewport: boolean;
+    /**
+     * This property will be used to add specified presets to the options
+     */
     preset?: SingleOrMultiple<string>;
+    /**
+     * This sets custom options based on canvas size
+     */
     responsive: IResponsive[];
+    /**
+     * Enables the retina detection, if disabled the ratio used by canvas will be always 1 and not the device setting.
+     * @deprecated use the new detectRetina instead
+     */
     retina_detect: boolean;
+    /**
+     * User-defined themes that can be retrieved by the particles [[Container]]
+     */
     themes: ITheme[];
+    /**
+     * The maximum layers used in the z-axis
+     */
     zLayers: number;
+    /**
+     * More custom options for external plugins or customizations
+     */
     [name: string]: unknown;
 }

package/browser/Options/Interfaces/IOptionsColor.d.ts

@@ -1,2 +1,7 @@
 import type { IColor } from "../../Core/Interfaces";
+/**
+ * Color options
+ * [[include:Color.md]]
+ * @category Options
+ */
 export declare type IOptionsColor = IColor;

package/browser/Options/Interfaces/IResponsive.d.ts

@@ -1,6 +1,8 @@
+import { ResponsiveMode } from "../../Enums";
 import type { RecursivePartial } from "../../Types";
 import type { IOptions } from "./IOptions";
 export interface IResponsive {
     maxWidth: number;
     options: RecursivePartial<IOptions>;
+    mode: ResponsiveMode;
 }

package/browser/Options/Interfaces/IValueWithRandom.d.ts

@@ -1,6 +1,9 @@
 import type { RangeValue } from "../../Types";
 import type { IRandom } from "./IRandom";
 export interface IValueWithRandom {
+    /**
+     * @deprecated Use the new [[RangeValue]] type instead of random
+     */
     random: boolean | IRandom;
     value: RangeValue;
 }

package/browser/Options/Interfaces/Interactivity/Events/IClickEvent.d.ts

@@ -1,6 +1,18 @@
 import type { ClickMode } from "../../../../Enums";
 import type { SingleOrMultiple } from "../../../../Types";
+/**
+ * The canvas click event
+ * [[include:Options/Interactivity/Click.md]]
+ * @category Options
+ */
 export interface IClickEvent {
+    /**
+     * This property enables or disables the click event
+     */
     enable: boolean;
+    /**
+     * This property contains a [[ClickMode]] value or an array of those values.
+     * If this value is an array, every mode will be used on click.
+     */
     mode: SingleOrMultiple<ClickMode | keyof typeof ClickMode | string>;
 }

package/browser/Options/Interfaces/Interactivity/Events/IDivEvent.d.ts

@@ -1,10 +1,23 @@
 import type { DivMode, DivType } from "../../../../Enums";
 import type { SingleOrMultiple } from "../../../../Types";
+/**
+ * [[include:Options/Interactivity/Div.md]]
+ * @category Options
+ */
 export interface IDivEvent {
     enable: boolean;
     mode: SingleOrMultiple<DivMode | keyof typeof DivMode | string>;
+    /**
+     * @deprecated This property is deprecated, use the new selectors property instead
+     */
     el: SingleOrMultiple<string>;
+    /**
+     * @deprecated This property is deprecated, use the new selectors property instead
+     */
     elementId: SingleOrMultiple<string>;
+    /**
+     * @deprecated This property is deprecated, use the new selectors property instead
+     */
     ids: SingleOrMultiple<string>;
     selectors: SingleOrMultiple<string>;
     type: DivType;

package/browser/Options/Interfaces/Interactivity/Events/IEvents.d.ts

@@ -2,9 +2,22 @@ import type { IClickEvent } from "./IClickEvent";
 import type { IHoverEvent } from "./IHoverEvent";
 import type { IDivEvent } from "./IDivEvent";
 import type { SingleOrMultiple } from "../../../../Types";
+/**
+ * [[include:Options/Interactivity/Events.md]]
+ * @category Options
+ */
 export interface IEvents {
+    /**
+     * @deprecated use the new onClick instead
+     */
     onclick: IClickEvent;
+    /**
+     * @deprecated use the new onHover instead
+     */
     onhover: IHoverEvent;
+    /**
+     * @deprecated use the new onDiv instead
+     */
     ondiv: SingleOrMultiple<IDivEvent>;
     onClick: IClickEvent;
     onHover: IHoverEvent;

package/browser/Options/Interfaces/Interactivity/Events/IHoverEvent.d.ts

@@ -1,6 +1,10 @@
 import type { HoverMode } from "../../../../Enums";
 import type { IParallax } from "./IParallax";
 import type { SingleOrMultiple } from "../../../../Types";
+/**
+ * [[include:Options/Interactivity/Hover.md]]
+ * @category Options
+ */
 export interface IHoverEvent {
     enable: boolean;
     mode: SingleOrMultiple<HoverMode | keyof typeof HoverMode | string>;

package/browser/Options/Interfaces/Interactivity/Events/IParallax.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Options
+ */
 export interface IParallax {
     enable: boolean;
     force: number;

package/browser/Options/Interfaces/Interactivity/IInteractivity.d.ts

@@ -1,9 +1,29 @@
 import type { InteractivityDetect } from "../../../Enums";
 import type { IEvents } from "./Events/IEvents";
 import type { IModes } from "./Modes/IModes";
+/**
+ * Particles interactivity options
+ * [[include:Options/Interactivity.md]]
+ * @category Options
+ */
 export interface IInteractivity {
+    /**
+     * @deprecated use the new detectsOn instead
+     */
     detect_on: InteractivityDetect | keyof typeof InteractivityDetect;
+    /**
+     * Where the mouse events will be detected
+     * If set to `canvas` only the particles canvas will be targeted
+     * If set to `parent` only the particles canvas parent will be targeted
+     * If set to `window` every area will be the target
+     */
     detectsOn: InteractivityDetect | keyof typeof InteractivityDetect;
+    /**
+     * Interaction events options, this configures which events are enabled and which modes should be used
+     */
     events: IEvents;
+    /**
+     * Interaction modes options, this configures every mode behavior
+     */
     modes: IModes;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IAttract.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Options
+ */
 import { EasingType } from "../../../../Enums";
 export interface IAttract {
     distance: number;

package/browser/Options/Interfaces/Interactivity/Modes/IBubble.d.ts

@@ -1,6 +1,9 @@
 import type { SingleOrMultiple } from "../../../../Types";
 import type { IBubbleDiv } from "./IBubbleDiv";
 import type { IBubbleBase } from "./IBubbleBase";
+/**
+ * @category Options
+ */
 export interface IBubble extends IBubbleBase {
     divs?: SingleOrMultiple<IBubbleDiv>;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IBubbleBase.d.ts

@@ -1,5 +1,8 @@
 import type { SingleOrMultiple } from "../../../../Types";
 import type { IColor } from "../../../../Core/Interfaces";
+/**
+ * @category Options
+ */
 export interface IBubbleBase {
     color?: SingleOrMultiple<IColor | string>;
     mix: boolean;

package/browser/Options/Interfaces/Interactivity/Modes/IBubbleDiv.d.ts

@@ -1,4 +1,7 @@
 import type { IBubbleBase } from "./IBubbleBase";
 import type { IModeDiv } from "./IModeDiv";
+/**
+ * @category Options
+ */
 export interface IBubbleDiv extends IBubbleBase, IModeDiv {
 }

package/browser/Options/Interfaces/Interactivity/Modes/IConnect.d.ts

@@ -1,7 +1,16 @@
 import type { IConnectLinks } from "./IConnectLinks";
+/**
+ * @category Options
+ */
 export interface IConnect {
     distance: number;
+    /**
+     * @deprecated use the new links instead
+     */
     line_linked: IConnectLinks;
+    /**
+     * @deprecated use the new links instead
+     */
     lineLinked: IConnectLinks;
     links: IConnectLinks;
     radius: number;

package/browser/Options/Interfaces/Interactivity/Modes/IConnectLinks.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Options
+ */
 export interface IConnectLinks {
     opacity: number;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IGrab.d.ts

@@ -1,7 +1,16 @@
 import type { IGrabLinks } from "./IGrabLinks";
+/**
+ * @category Options
+ */
 export interface IGrab {
     distance: number;
+    /**
+     * @deprecated use the new links instead
+     */
     line_linked: IGrabLinks;
+    /**
+     * @deprecated use the new links instead
+     */
     lineLinked: IGrabLinks;
     links: IGrabLinks;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IGrabLinks.d.ts

@@ -1,4 +1,7 @@
 import type { IColor } from "../../../../Core/Interfaces/Colors";
+/**
+ * @category Options
+ */
 export interface IGrabLinks {
     blink: boolean;
     color?: string | IColor;

package/browser/Options/Interfaces/Interactivity/Modes/IModeDiv.d.ts

@@ -1,5 +1,11 @@
 import { SingleOrMultiple } from "../../../../Types";
+/**
+ * @category Options
+ */
 export interface IModeDiv {
+    /**
+     * @deprecated This property is deprecated, please use selectors instead
+     */
     ids: SingleOrMultiple<string>;
     selectors: SingleOrMultiple<string>;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IModes.d.ts

@@ -8,6 +8,10 @@ import type { ISlow } from "./ISlow";
 import type { ITrail } from "./ITrail";
 import type { IAttract } from "./IAttract";
 import type { ILight } from "./ILight";
+/**
+ * [[include:Options/Interactivity/Modes.md]]
+ * @category Options
+ */
 export interface IModes {
     attract: IAttract;
     bubble: IBubble;

package/browser/Options/Interfaces/Interactivity/Modes/IPush.d.ts

@@ -1,4 +1,10 @@
+/**
+ * @category Options
+ */
 export interface IPush {
+    /**
+     * @deprecated use the new quantity instead
+     */
     particles_nb: number;
     default: boolean;
     groups: string[];

package/browser/Options/Interfaces/Interactivity/Modes/IRemove.d.ts

@@ -1,4 +1,10 @@
+/**
+ * @category Options
+ */
 export interface IRemove {
+    /**
+     * @deprecated use the new quantity instead
+     */
     particles_nb: number;
     quantity: number;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IRepulse.d.ts

@@ -1,6 +1,9 @@
 import type { SingleOrMultiple } from "../../../../Types";
 import type { IRepulseDiv } from "./IRepulseDiv";
 import type { IRepulseBase } from "./IRepulseBase";
+/**
+ * @category Options
+ */
 export interface IRepulse extends IRepulseBase {
     divs?: SingleOrMultiple<IRepulseDiv>;
 }

package/browser/Options/Interfaces/Interactivity/Modes/IRepulseBase.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @category Options
+ */
 import type { EasingType } from "../../../../Enums";
 export interface IRepulseBase {
     distance: number;

package/browser/Options/Interfaces/Interactivity/Modes/IRepulseDiv.d.ts

@@ -1,4 +1,7 @@
 import type { IRepulseBase } from "./IRepulseBase";
 import type { IModeDiv } from "./IModeDiv";
+/**
+ * @category Options
+ */
 export interface IRepulseDiv extends IRepulseBase, IModeDiv {
 }

package/browser/Options/Interfaces/Interactivity/Modes/ISlow.d.ts

@@ -1,4 +1,10 @@
+/**
+ * @category Options
+ */
 export interface ISlow {
+    /**
+     * @deprecated this property will be removed soon, please use the HoverMode.slow in the HoverEvent
+     */
     active: boolean;
     radius: number;
     factor: number;

package/browser/Options/Interfaces/Interactivity/Modes/ITrail.d.ts

@@ -1,5 +1,8 @@
 import type { IParticles } from "../../Particles/IParticles";
 import type { RecursivePartial } from "../../../../Types";
+/**
+ * @category Options
+ */
 export interface ITrail {
     delay: number;
     particles?: RecursivePartial<IParticles>;

package/browser/Options/Interfaces/Motion/IMotion.d.ts

@@ -1,5 +1,16 @@
 import { IMotionReduce } from "./IMotionReduce";
+/**
+ * [[include:Options/Motion.md]]
+ * @category Options
+ */
 export interface IMotion {
+    /**
+     * Disables motions for users with `prefer-reduced-motion` enabled
+     */
     disable: boolean;
+    /**
+     * Reduce motion settings for users with `prefer-reduced-motion` enabled
+     * If [[disable]] is `true` these values will be ignored
+     */
     reduce: IMotionReduce;
 }