diff options
Diffstat (limited to 'packages/integrations')
-rw-r--r-- | packages/integrations/preact/client.js | 21 | ||||
-rw-r--r-- | packages/integrations/preact/server.js | 4 | ||||
-rw-r--r-- | packages/integrations/react/server-v17.js | 6 | ||||
-rw-r--r-- | packages/integrations/react/server.js | 6 | ||||
-rw-r--r-- | packages/integrations/solid/client.js | 2 | ||||
-rw-r--r-- | packages/integrations/solid/server.js | 8 | ||||
-rw-r--r-- | packages/integrations/svelte/client.js | 19 | ||||
-rw-r--r-- | packages/integrations/svelte/server.js | 3 |
8 files changed, 37 insertions, 32 deletions
diff --git a/packages/integrations/preact/client.js b/packages/integrations/preact/client.js index e2f4ca803..78d8720f0 100644 --- a/packages/integrations/preact/client.js +++ b/packages/integrations/preact/client.js @@ -1,13 +1,14 @@ import { h, render } from 'preact'; import StaticHtml from './static-html.js'; -export default (element) => (Component, props, { default: children, ...slotted }) => { - if (!element.hasAttribute('ssr')) return; - for (const [key, value] of Object.entries(slotted)) { - props[key] = h(StaticHtml, { value, name: key }); - } - render( - h(Component, props, children != null ? h(StaticHtml, { value: children }) : children), - element - ); -}; +export default (element) => + (Component, props, { default: children, ...slotted }) => { + if (!element.hasAttribute('ssr')) return; + for (const [key, value] of Object.entries(slotted)) { + props[key] = h(StaticHtml, { value, name: key }); + } + render( + h(Component, props, children != null ? h(StaticHtml, { value: children }) : children), + element + ); + }; diff --git a/packages/integrations/preact/server.js b/packages/integrations/preact/server.js index 31f980aa3..29ae8a3b0 100644 --- a/packages/integrations/preact/server.js +++ b/packages/integrations/preact/server.js @@ -2,7 +2,7 @@ import { h, Component as BaseComponent } from 'preact'; import render from 'preact-render-to-string'; import StaticHtml from './static-html.js'; -const slotName = str => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); +const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); function check(Component, props, children) { if (typeof Component !== 'function') return false; @@ -33,7 +33,7 @@ function renderToStaticMarkup(Component, props, { default: children, ...slotted slots[name] = h(StaticHtml, { value, name }); } // Note: create newProps to avoid mutating `props` before they are serialized - const newProps = { ...props, ...slots } + const newProps = { ...props, ...slots }; const html = render( h(Component, newProps, children != null ? h(StaticHtml, { value: children }) : children) ); diff --git a/packages/integrations/react/server-v17.js b/packages/integrations/react/server-v17.js index 5d747a832..8613ef01a 100644 --- a/packages/integrations/react/server-v17.js +++ b/packages/integrations/react/server-v17.js @@ -2,7 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom/server.js'; import StaticHtml from './static-html.js'; -const slotName = str => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); +const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); const reactTypeof = Symbol.for('react.element'); function errorIsComingFromPreactComponent(err) { @@ -59,11 +59,11 @@ function renderToStaticMarkup(Component, props, { default: children, ...slotted slots[name] = React.createElement(StaticHtml, { value, name }); } // Note: create newProps to avoid mutating `props` before they are serialized - const newProps = { + const newProps = { ...props, ...slots, children: children != null ? React.createElement(StaticHtml, { value: children }) : undefined, - } + }; const vnode = React.createElement(Component, newProps); let html; if (metadata && metadata.hydrate) { diff --git a/packages/integrations/react/server.js b/packages/integrations/react/server.js index cda839a1c..5e4454151 100644 --- a/packages/integrations/react/server.js +++ b/packages/integrations/react/server.js @@ -2,7 +2,7 @@ import React from 'react'; import ReactDOM from 'react-dom/server'; import StaticHtml from './static-html.js'; -const slotName = str => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); +const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); const reactTypeof = Symbol.for('react.element'); function errorIsComingFromPreactComponent(err) { @@ -65,11 +65,11 @@ async function renderToStaticMarkup(Component, props, { default: children, ...sl slots[name] = React.createElement(StaticHtml, { value, name }); } // Note: create newProps to avoid mutating `props` before they are serialized - const newProps = { + const newProps = { ...props, ...slots, children: children != null ? React.createElement(StaticHtml, { value: children }) : undefined, - } + }; const vnode = React.createElement(Component, newProps); let html; if (metadata && metadata.hydrate) { diff --git a/packages/integrations/solid/client.js b/packages/integrations/solid/client.js index ceb7546d2..fa8cabcc0 100644 --- a/packages/integrations/solid/client.js +++ b/packages/integrations/solid/client.js @@ -34,7 +34,7 @@ export default (element) => createComponent(Component, { ...props, ...slots, - children + children, }), element ); diff --git a/packages/integrations/solid/server.js b/packages/integrations/solid/server.js index 92b614012..2398ec317 100644 --- a/packages/integrations/solid/server.js +++ b/packages/integrations/solid/server.js @@ -1,6 +1,6 @@ import { renderToString, ssr, createComponent } from 'solid-js/web'; -const slotName = str => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); +const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase()); function check(Component, props, children) { if (typeof Component !== 'function') return false; @@ -15,14 +15,14 @@ function renderToStaticMarkup(Component, props, { default: children, ...slotted slots[name] = ssr(`<astro-slot name="${name}">${value}</astro-slot>`); } // Note: create newProps to avoid mutating `props` before they are serialized - const newProps = { + const newProps = { ...props, ...slots, // In Solid SSR mode, `ssr` creates the expected structure for `children`. children: children != null ? ssr(`<astro-slot>${children}</astro-slot>`) : children, - } + }; const html = renderToString(() => createComponent(Component, newProps)); - return { html } + return { html }; } export default { diff --git a/packages/integrations/svelte/client.js b/packages/integrations/svelte/client.js index 36a8e8de1..c8c252eaa 100644 --- a/packages/integrations/svelte/client.js +++ b/packages/integrations/svelte/client.js @@ -11,10 +11,10 @@ export default (target) => { try { new Component({ target, - props: { + props: { ...props, $$slots: slots, - $$scope: { ctx: [] } + $$scope: { ctx: [] }, }, hydrate: client !== 'only', $$inline: true, @@ -24,11 +24,14 @@ export default (target) => { }; function createSlotDefinition(key, children) { - return [ - () => ({ + return [ + () => ({ // mount m(target) { - target.insertAdjacentHTML('beforeend', `<astro-slot${key === 'default' ? '' : ` name="${key}"`}>${children}</astro-slot>`) + target.insertAdjacentHTML( + 'beforeend', + `<astro-slot${key === 'default' ? '' : ` name="${key}"`}>${children}</astro-slot>` + ); }, // create c: noop, @@ -37,7 +40,7 @@ function createSlotDefinition(key, children) { // destroy d: noop, }), - noop, - noop, - ] + noop, + noop, + ]; } diff --git a/packages/integrations/svelte/server.js b/packages/integrations/svelte/server.js index 7a5610b4a..98ece3314 100644 --- a/packages/integrations/svelte/server.js +++ b/packages/integrations/svelte/server.js @@ -5,7 +5,8 @@ function check(Component) { async function renderToStaticMarkup(Component, props, slotted) { const slots = {}; for (const [key, value] of Object.entries(slotted)) { - slots[key] = () => `<astro-slot${key === 'default' ? '' : ` name="${key}"`}>${value}</astro-slot>`; + slots[key] = () => + `<astro-slot${key === 'default' ? '' : ` name="${key}"`}>${value}</astro-slot>`; } const { html } = Component.render(props, { $$slots: slots }); return { html }; |