Repository: react
Issue: [Compiler Bug]: server components built externally by the compiler error when rendered in app
Labels: Type: Bug,Component: Optimizing Compiler

### What kind of issue is this?

- [X] React Compiler core (the JS output is incorrect, or your app works incorrectly after optimization)
- [ ] babel-plugin-react-compiler (build issue installing or using the Babel plugin)
- [ ] eslint-plugin-react-compiler (build issue installing or using the eslint plugin)
- [ ] react-compiler-healthcheck (build issue installing or using the healthcheck script)

### Link to repro

https://github.com/DanielOrtel/compiler-bug

### Repro steps

I'm building an esm UI library and ran into a weird issue with one component when adding react compiler to the build pipeline(which uses rollup with babel). You can check the reproduction repo above, steps:
- set node 20.18.0 if not set automatically
- run `yarn install`
- run `yarn test-compiler-error` // this will build the library and start a bare-bones next app
- open localhost:3000\
- app should error out with the following:
```
TypeError: Cannot read properties of undefined (reading 'H')
    at IconsRoot (../../libraries/ui/.dist/icons-root/index.js:12:72)
    at AsyncLocalStorage.run (node:async_hooks:346:14)
    at stringify (<anonymous>)
    at stringify (<anonymous>)
    at AsyncLocalStorage.run (node:async_hooks:346:14)
    at AsyncResource.runInAsyncScope (node:async_hooks:206:9)
digest: "2235527820"
  15 |       require("next/dist/compiled/react").__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
  16 |     exports.c = function (size) {
> 17 |       var dispatcher = ReactSharedInternals.H; // <-- ReactSharedInternals is undefined here. 
```

This is a limited snippet of the larger UI library. The error occurs because the file doesn't have the `'use client'` directive, but this component should be server-renderable, it's just a barebones `div` component. If I remove the `react-compiler` from the build pipeline or if I make this a client component, it works as expected.

Ultimately, I'd expect adding the compiler to the build pipeline of my library to not break components which previously could be server rendered and force the use of client directive when it is unnecessary. 

My suggestion, in case compiler-optimized components can't be rendered in server components, would be to have some config option that can be enabled for libraries to check for client directives and only optimize client components. And also to add some form of an error boundary to let consumers know that they're trying to render a compiler-optimized component in a server environment. The current error is just confusing and it took me a while to figure out what was the exact cause of it. 

But the ideal scenario would be to not have to worry about in which environment the component is rendered. Sure, the compiler optimizations do nothing on the server, but that means that they could be essentially stubbed and still render as expected. I dislike the idea of having to output separate versions of components that can be potentially server rendered, simply because I'd like the client versions to be optimized by the compiler. 

### How often does this bug happen?

Every time

### What version of React are you using?

19

### What version of React Compiler are you using?

19.0.0-beta-df7b47d-20241124