Errors when using react-tabs in an Astro page

[1R053]

I am unable to get this component running in the astro framework.

To reproduce you can create a new astro app with react support, e.g.

yarn create astro
cd to-your-project
yarn astro add react

# I had to add vite manually currently to get react support, maybe it works for you without
yarn add vite -D

# now add react-tabs
yarn add react-tabs

now just create a page like this and enable client scripting

---
import Layout from '../layouts/Layout.astro';
import { Tabs, TabList, Tab, TabPanel } from 'react-tabs';
import 'react-tabs/style/react-tabs.css';
---
<Layout title="React Tabs">
    <Tabs client:load>
        <TabList client:load>
            <Tab client:load>Tab 1</Tab>
            <Tab client:load>Tab 2</Tab>

        </TabList>

        <TabPanel client:load>
            Content for Tab 1
        </TabPanel>
        <TabPanel client:load>
            Content for Tab 2
        </TabPanel>
    </Tabs>
</Layout>

The tab buttons are loaded, but not the content. Also clicking on tabs has no effect. There are also various browser console errors and warnings.

• Error: Uncaught (in promise) SyntaxError: Expected property name or '}' in JSON at position 1 (line 1 column 2) at JSON.parse () at f.start
• Warning: Each child in a list should have a unique "key" prop. Check the top-level render call using

Any idea, what I might have misconfigured? Or is a change to the library needed to make it work?

Thanks