Hover not toggled until next mouse-enter

GrapesJS version

• I confirm to use the latest version of GrapesJS

What browser are you using?

Chrome Version 98.0.4758.80 (Official Build) (arm64)

Reproducible demo link

https://jsfiddle.net/01pa5mty/9/

Describe the bug

also thank you for adding hover:before and select:before events, will be really useful!

How to reproduce the bug? (Steps for reproducible demo)

1. Add any container block
2. Add a text block and select anything besides text and immediate parent. (selection, highlight, hover for text gets disabled as expected).
3. By keeping cursor on top of the text, select the parent cell. Cell gets selected and selection,highlight,hover for text is enabled but gjs-hovered class isn't added until mouse exits and re-enters the text component.

What is the expected behavior? Component shows as hovered and highlighted on enabling both properties while cursor is on top of the component.

What is the current behavior? Cursor needs to re-enter the component to trigger highlight and hover

If is necessary to execute some code in order to reproduce the bug, paste it here below:

editor.on('component:mount', component => {
    if (component.is('text')) {
      component.set('highlightable', false);
      component.set('selectable', false);
      component.set('hoverable', false);
    }
});

editor.on('component:selected', component => {
		component.components().map(child => {
    		child.set('highlightable', true);
	      child.set('hoverable', true);
	      child.set('selectable', true);
    });
});

Code of Conduct

• I agree to follow this project's Code of Conduct