Home > widget-integration > FilterController > handleMouseLeave

FilterController.handleMouseLeave property

Handles mouse leave event for product swatches. Resets swatch selection and restores default product images when mouse leaves the swatch area.

Respects the global flag window.boostSDKeepVariantOnHoverOutside which allows variant selections to persist even after hovering outside.

Signature:

handleMouseLeave: (swatch: any, productItem: any, images: any) => void;

Remarks

This method provides the "reset on hover out" behavior for swatches. The global flag allows shops to customize whether variants persist or reset after mouse leave.

Example

Override to customize hover-out behavior:

window.boostWidgetIntegration.extend('FilterController', (FilterController) => {
  return class CustomFilterController extends FilterController {
    handleMouseLeave(swatch, productItem, images) {
      // Add delay before resetting
      const timeoutId = setTimeout(() => {
        super.handleMouseLeave(swatch, productItem, images);
      }, 300);

      // Store timeout to cancel if mouse re-enters quickly
      swatch.dataset.hoverTimeout = timeoutId;
    }
  };
});