fix: optimize tab navigation for sd-tab, sd-tab-group, sd-tab-panel a11y

[Vahid1919]

Description:

Closes #1489

Definition of Reviewable:

• [x] E2E tests (features, a11y, bug fixes) are created/updated
• [x] relevant tickets are linked

[github-actions[bot]]

🚀 Storybook has been deployed for branch fix_sd-tab-sd-tab-panel-and-sd-tab-group-a11y

• View Storybook

[smfonseca]

@Vahid1919 I tested with voice over and whenever I focus on the tab panel there no announcement of its content. I think we need to add aria-labelledby. Can you please test?

[Vahid1919]

@Vahid1919 I tested with voice over and whenever I focus on the tab panel there no announcement of its content. I think we need to add aria-labelledby. Can you please test?

@smfonseca I tested on chrome and safari and works on my side.

What browser/screen reader did you test on?

[smfonseca]

@smfonseca I tested on chrome and safari and works on my side. What browser/screen reader did you test on?

Tested is Safari and Chrome with the VoiceOver. I also get the announcement "tab panel" as shown in your screenshot, but what I'm missing is the annoucement of the content which in the case of your screenshot would be "tab panel 4".

[Vahid1919]

@smfonseca Requesting re-review :)

[mariohamann]

Really enjoy the UX here. Shall we let it test by Manuel?