AIQ-5472: Make icon hoverable and clickable

[atsunechka]

[ivan-shtyrlyaev-nitka]

In my opinion this is wrong.
The main idea - combobox is an input (complex input with search and dropdown).
And this functionality is unlikely to be used and need a lot.

based on ticket requirement we need to add just cursor: pointer for the icon on hover, and we could do it right in agency IQ using :deep.
Nothing to change in vue-accessible-selects package

[ivan-shtyrlyaev-nitka]

In my opinion this is wrong. The main idea - combobox is an input (complex input with search and dropdown). And this functionality is unlikely to be used and need a lot.

based on ticket requirement we need to add just cursor: pointer for the icon on hover, and we could do it right in agency IQ using :deep. Nothing to change in vue-accessible-selects package

per discussion with @atsunechka

since icon block is a sibling to input we cannot just remove pointer-events: none as propagation not working here because icon block is not a children of input block.

so we could just add a click handler to open menu. (and remove pointer-events: none). For screenreader users nothing will be changed (icon with click will be skipped as it doesn't have tabindex)

[cafloyd]

Looks great @atsunechka , and thanks for your help @ivan-shtyrlyaev-nitka !

@atsunechka - you'll also need to PR to the next branch since we also currently have an alpha version of this library.
(We still need to deprecate Vue 2 support in VAS and move the alpha (Vue 3) version to be the only version - I'll flag this issue for the FE team, it's one that has been brought up and we haven't dealt with yet.)