Merge remote-tracking branch 'origin/master' into 5-group-checkboxes

src/wpforms-multiselect-checkboxes.js

@@ -483,6 +483,7 @@
 		const handleInputClick = ( { target: input } ) => {
 			const isOpen = this.list.classList.toggle( 'open' );
 			input.setAttribute( 'aria-expanded', isOpen );
+			dispatchToggleEvent( isOpen );
 
 			if ( ! isOpen ) {
 				maybeFlushSearchInput();
@@ -561,6 +562,7 @@
 			maybeFlushSearchInput();
 			this.list.classList.remove( 'open', 'open-up' );
 			this.input.setAttribute( 'aria-expanded', false );
+			dispatchToggleEvent( false );
 		};
 
 		// Callback function to flush the search input.
@@ -573,6 +575,15 @@
 			this.search.dispatchEvent( new Event( 'input' ) );
 		};
 
+		// Dispatch a custom event to indicate whether the dropdown is open or not.
+		const dispatchToggleEvent = ( isOpen ) => {
+			const toggleEvent = new CustomEvent( 'wpforms_multiselect_checkbox_list_toggle', {
+				bubbles: true,
+				detail: { isOpen },
+			} );
+			element.dispatchEvent( toggleEvent );
+		};
+
 		// Bind event listeners.
 		this.input.addEventListener( 'click', handleInputClick );
 		this.input.addEventListener( 'keydown', handleInputFocus );