Tab Challenge.md

🎒Tab Challenge:

Background:

In react we like to build components that we can then stick together. Tabs to switch between content is a component which can be found used in many applications. Let's build one ourselves :).

Your mission:

Build a tab component like this https://bwir2.csb.app/. It should indicate which tab is currently active by changing the background color of the active tab. When a tab is active the content of that tab is displayed.

The way of grading:

Does a tab become active when clicking on it? Does the content of the tab panel change when the active panel changes?

Restrictions:

Use React Components and the useState hook to complete this challenge. Do not use any other hooks provided other than the useSate hook. Use the provided API int the Tabs.jsx for your Tab Component.

// Example API, you can chose another API if you wish to build it differently :)
export default function Page() {
  const tabData = [
    {
      label: "Login",
      content: <LoginForm />
    },
    {
      label: "Signup",
      content: <SignupForm />
    }
  ];

  return (
    <div>
      <Tabs data={tabData} />
    </div>
  );
}