[Bug]: Expression produces a union type that is too complex to represent.

[Angeschossen]

Component

Nav (Preview)

Package version

9.56.8

React version

18.3.1

Environment

System:
    OS: Windows 11 10.0.26100
    CPU: (8) x64 Intel(R) Core(TM) i7-9700K CPU @ 3.60GHz
    Memory: 18.55 GB / 31.94 GB
  Browsers:
    Chrome: 131.0.6778.205
    Edge: Chromium (131.0.2903.86)
    Internet Explorer: 11.0.26100.1882
  npmPackages:
    @fluentui/react: ^8.122.4 => 8.122.4
    @fluentui/react-components: ^9.56.8 => 9.56.8
    @fluentui/react-nav-preview: ^0.10.6 => 0.10.6
    @types/react: ^18 => 18.3.18
    @types/react-dom: ^18 => 18.3.5
    react: ^18.3.1 => 18.3.1
    react-dom: ^18 => 18.3.1

Current Behavior

• Receiving Expression produces a union type that is too complex to represent. in VS-Code and when using npm run build with Next.js. npm run dev works fine, of course.
• This only happens when you add child elements to the NavDrawer component.
• I reproduced this issue with the example from the wiki. Again it only works fine with npm run dev, not npm run build.

So this produces no error:

<NavDrawer/>

But this does:

<NavDrawer>
<NavDrawerHeader>....
<NavDrawer/>

Or just this does as well:

<NavDrawer>
<p>Test</p>
<NavDrawer/>

So adding any child does this.

Expected Behavior

Being able to add children.

Reproduction

https://stackblitz.com/edit/vqvvdnhn?file=src%2Fexample.tsx

Steps to reproduce

1. Create sample project with Next.js
2. Add the Nav example from the wiki
3. Execute npm run build

Are you reporting an Accessibility issue?

None

Suggested severity

High - No workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.