enhancement: add MaskedInput icon click-ability

[abdulbasithqb]

What does this PR do?

Introduces the ability to make the MaskedInput icon clickable, triggering the display of suggestion options.

Where should the reviewer start?

Review changes in the MaskedInput component related to icon click-ability(components/MaskedInput/MaskedInput.js).

What testing has been done on this PR?

• Manually clicking the icon to ensure the expected behavior.
• Local Jest tests.

How should this be manually tested?

Manually test by clicking the icon in a MaskedInput field with the maskIconClickable prop set to true and verify the suggestion options appear. Then, test with maskIconClickable set to false and ensure the icon does not trigger the suggestions.

Do Jest tests follow these best practices?

• screen is used for querying.
• The correct query is used. (Refer to this list of queries)
• asFragment() is used for snapshot testing.

Any background context you want to provide?

This enhancement improves user interaction with MaskedInput by allowing suggestions to be triggered by clicking the icon.

What are the relevant issues?

fixes: #7042

Screen-record (if appropriate)

Screen.Recording.2023-12-14.at.2.06.43.AM.mov

Do the grommet docs need to be updated?

No

Should this PR be mentioned in the release notes?

Not sure.

Is this change backwards compatible or is it a breaking change?

No.

[taysea]

Thanks for this proposal. I'm tagging this as "discussion" because there is a bit to discuss here from an API standpoint and accessibility standpoint as well since we would need to consider rendering this as a Button/avoiding nested interactive elements/etc.