feature: Make Main Modal events configurable via props

[annacv]

Pull request template

Currently, when some customers want to implement features without leaving the search engine (ex. opening pop-ups), their flow is broken due to the UserClickedOutOfMainModal event being fired.

Motivation and context

A recent example is Tous, trying to open a modal when the add2Cart button is clicked, or Carrefour, with their wishlist integration.

Type of change

• Bug fix (non-breaking change that fixes an issue)
• New feature (non-breaking change that adds functionality)
• Breaking change (fix or feature that causes existing functionality to not work as expected)
• Change requires a documentation update

What is the destination branch of this PR?

• Main
• Other. Specify:

How has this been tested?

1. in Home.vue:

<MainModal
      :animation="modalAnimation"
      :openEvents="['UserClickedOpenX', 'UserOpenXProgrammatically', 'MyCustomXEvent']"
      :outOfModalClickEvent="null"
    >.........</MainModal>

2. Check devTools events' props are updated accordingly.
3. Change change x-modal styles to check that clicking out of the modal doesn't close it, + query & results are not being cleared (so the UserClickedOutOfMainModal event is not being fired):

.x-modal {
    width: 60% !important;
    left: 615px !important;
  }

Tests performed according to testing guidelines:

Checklist:

• My code follows the style guidelines of this project.
• I have performed a self-review on my own code.
• I have commented my code, particularly in hard-to-understand areas.
• I have made corresponding changes to the documentation.
• My changes generate no new warnings.
• I have added tests that prove my fix is effective or that my feature works.
• New and existing unit tests pass locally with my changes.