Tabs: Conditional rendering -> Cannot read properties of null (reading 'type')

[baur]

Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io.
• I have read the console error message carefully (if applicable).

Description

I got an error: Cannot read properties of null (reading 'type')

Reproducible demo

No response

Steps to reproduce

<Tabs>
  <TabItem value="apple" label="Apple" default>
    This is an apple 🍎
  </TabItem>
  <TabItem value="orange" label="Orange">
    This is an orange 🍊
  </TabItem>
  {1===0?<TabItem value="banana" label="Banana">
    This is a banana 🍌
  </TabItem>:null}
</Tabs>

Expected behavior

Do not render third Tab

Actual behavior

Your environment

• Docusaurus version used: 2.3.1
• Environment name and version (e.g. Chrome 89, Node.js 16.4): Chrome
• Operating system and version (e.g. Ubuntu 20.04.2 LTS): Windows11

[baur]

same behavior md and mdx