diff options
| author |  Matthew Phillips <matthew@skypack.dev>
| 2023-08-16 13:40:57 -0400 |
|---|---|---|
| committer |  GitHub <noreply@github.com>
| 2023-08-16 13:40:57 -0400 |
| commit | 16a3fdf93165a1a0404c1db0973871345b2c591b (patch) | |
| tree | 3a08e093351ded708f717e12ad3b69c7950fb66f /packages/integrations/react/server.js | |
| parent | 7177f7579b6e866f0fd895b3fd079d8ba330b1a9 (diff) | |
| download | astro-16a3fdf93165a1a0404c1db0973871345b2c591b.tar.gz astro-16a3fdf93165a1a0404c1db0973871345b2c591b.tar.zst astro-16a3fdf93165a1a0404c1db0973871345b2c591b.zip | |
Add experimentalReactChildren option to React integration (#8082)
* wip: support true react vnodes in renderer
* Add new experimentalReactChildren option to React integration
* Update the test
* Add docs
* Update packages/integrations/react/server.js
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
* Update with a better test
* Update .changeset/yellow-snakes-jam.md
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
* Update packages/integrations/react/README.md
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
* Update packages/integrations/react/README.md
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
---------
Co-authored-by: Nate Moore <nate@astro.build>
Co-authored-by: Nate Moore <natemoo-re@users.noreply.github.com>
Co-authored-by: Sarah Rainsberger <sarah@rainsberger.ca>
Diffstat (limited to 'packages/integrations/react/server.js')
| -rw-r--r-- | packages/integrations/react/server.js | 6 |
1 files changed, 5 insertions, 1 deletions
diff --git a/packages/integrations/react/server.js b/packages/integrations/react/server.js index 8c02c4b26..3f0d93e97 100644 --- a/packages/integrations/react/server.js +++ b/packages/integrations/react/server.js @@ -2,6 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom/server'; import StaticHtml from './static-html.js'; import { incrementId } from './context.js'; +import opts from 'astro:react:opts'; const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); const reactTypeof = Symbol.for('react.element'); @@ -85,7 +86,10 @@ async function renderToStaticMarkup(Component, props, { default: children, ...sl ...slots, }; const newChildren = children ?? props.children; - if (newChildren != null) { + if (children && opts.experimentalReactChildren) { + const convert = await import('./vnode-children.js').then(mod => mod.default); + newProps.children = convert(children); + } else if (newChildren != null) { newProps.children = React.createElement(StaticHtml, { hydrate: needsHydration(metadata), value: newChildren, |