added confetti when the tour finishes

Author: [email protected]

package-lock.json

@@ -17,6 +17,7 @@
 		"@wordpress/dom-ready": "^3.2.3",
 		"@wordpress/icons": "^6.1.1",
 		"bigpicture": "^2.5.3",
+		"canvas-confetti": "^1.9.3",
 		"classnames": "^2.2.6",
 		"color-rgba": "^2.2.3",
 		"compare-versions": "^3.6.0",

package.json

@@ -3,6 +3,7 @@ import {
 	guidedTourStates, // TODO: This doesn't exist yet. The state should be loaded here from localize values, this should be an object with the tour ID as the key and the state as the value.
 } from 'stackable'
 import classNames from 'classnames'
+import confetti from 'canvas-confetti'
 
 import {
 	Modal, Flex, Button,
@@ -235,6 +236,12 @@ const ModalTour = props => {
 						variant="primary"
 						onClick={ () => {
 							if ( currentStep === steps.length - 1 ) {
+								confetti( {
+									angle: -90,
+									spread: 90,
+									origin: { y: -0.3 },
+									zIndex: 100000,
+								} )
 								onClose()
 							} else {
 								setCurrentStep( currentStep + 1 )