fix(headeraction): close panel on other action click

[erzhan-temir-mamyrov]

Closes #3755

Summary

• on Safari
• Close header panel if clicked outside of the panel

Change List (commits, features, bugs, etc)

• Add event listener to document to toggle panel state
• Add tests

Acceptance Test (how to verify the PR)

• on Safari
• Go to this story
• Click on app switcher to open panel
• EDIT: Click on any other header action Click anywhere outside panel
• Verify that panel closed
• Click again on app switcher
• Navigate to some workspace
• Verify that panel is not closing on internal click events

Regression Test (how to make sure this PR doesn't break old functionality)

• tests here

Things to look for during review

• Make sure all references to iot or bx class prefix is using the prefix variable
• (React) All major areas have a data-testid attribute. New test ids should have test written to ensure they are not changed or removed.
• UI should be checked in RTL mode to ensure the proper handling of layout and text.
• All strings should be translatable.
• The code should pass a11y scans (The storybook a11y knob should show no violations). New components should have a11y test written.
• Unit test should be written and should have a coverage of 90% or higher in all areas.
• All components should be passing visual regression test. For new styles or components either a visual regression test should be written for all permutations or the base image updated.
• Changes or new components should either write new or update existing documentation.
• PR should link and close out an existing issue

[netlify]

✅ Deploy Preview for carbon-addons-iot-react ready!

Name	Link
🔨 Latest commit	7eeec94
🔍 Latest deploy log	https://app.netlify.com/sites/carbon-addons-iot-react/deploys/642552c446841b0008fb04fb
😎 Deploy Preview	https://deploy-preview-3758--carbon-addons-iot-react.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[jessieyan]

The only difference I saw between chrome and safari is when click on the page the AppSwitcher did not close.

Screen.Recording.2023-03-28.at.9.02.17.AM.mov

[erzhan-temir-mamyrov]

@jessieyan Thanks for the note, it was another bug. There were 2 differences in Safari:

1. When panel was open, click on other buttons in header didn't close the panel.
2. When panel was open, click outside of the panel also didn't close the panel.

[jessieyan]

Looks good