Write a React component named TabbedNavigation
that renders tabs along with their associated content, and allows navigating between them.
This component will receive a prop named tabbedNavigationConfig
with the following type:
TabbedNavigationConfig = {
id: string;
title: string;
content: JSX.Element;
}[]
This prop controls the tabs we will render. For each item in this Array we will render a tab button, and when clicking on it, we'll see the tab panel with the specific content inside.
See the demo below, for how the component should work if it receives the following input.
NOTE: The component should use appropriate ARIA roles for accessibility.