updated definitions for @types/canvas-confetti (#41732)

types/canvas-confetti/canvas-confetti-tests.ts

@@ -41,7 +41,8 @@ confetti({
     particleCount: r(50, 100),
     origin: {
         y: 0.6
-    }
+    },
+    shapes: ['square', 'circle', 'square']
 });
 
 const canvas = document.createElement('canvas');
@@ -49,6 +50,10 @@ const myConfetti = confetti.create(canvas);
 
 myConfetti();
 
+confetti.reset();
+
+myConfetti.reset();
+
 myConfetti({
     particleCount: 150
 });

types/canvas-confetti/index.d.ts

@@ -1,6 +1,7 @@
-// Type definitions for canvas-confetti 0.1
+// Type definitions for canvas-confetti 1.0
 // Project: https://github.com/catdad/canvas-confetti#readme
 // Definitions by: Martin Tracey <https://github.com/matracey>
+//                 Josh Batley <https://github.com/joshbatley>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 
 /**
@@ -24,6 +25,8 @@ declare namespace confetti {
      */
     let Promise: any;
 
+    type shape = 'square' | 'circle';
+
     interface Options {
         /**
          * The number of confetti to launch. More is always fun... but be cool, there's a lot of math involved.
@@ -63,12 +66,18 @@ declare namespace confetti {
          * An array of color strings, in the HEX format... you know, like #bada55.
          */
         colors?: string[];
+        /**
+         * The possible values are square and circle. The default is to use both shapes in an even mix.
+         * @default ['square','circle']
+         */
+        shapes?: shape[];
         /**
          * The confetti should be on top, after all. But if you have a crazy high page, you can set it even higher.
          * @default 100
          */
         zIndex?: number;
     }
+
     interface Origin {
         /**
          * The x position on the page, with 0 being the left edge and 1 being the right edge.
@@ -81,14 +90,37 @@ declare namespace confetti {
          */
         y?: number;
     }
+
     interface GlobalOptions {
-        resize: boolean;
+        /**
+         * Whether to allow setting the canvas image size, as well as keep it correctly sized if the window changes size
+         * @default false
+         */
+        resize?: boolean;
+        /**
+         * Whether to use an asynchronous web worker to render the confetti animation, whenever possible
+         * @default false
+         */
+        useWorker?: boolean;
     }
 
+    /**
+     * Stops the animation and clears all confetti, as well as immediately resolves any outstanding promises.
+     */
+    type Reset = () => void;
+    function reset(): Reset;
+
+    interface CreateTypes {
+        (options?: Options): () => Promise<null> | null;
+        reset: Reset;
+    }
+    /**
+     * This method creates an instance of the confetti function that uses a custom canvas.
+     */
     function create(
         canvas: HTMLCanvasElement,
         options?: GlobalOptions
-    ): (options?: Options) => Promise<null> | null;
+    ): CreateTypes;
 }
 
 export = confetti;