mirror of
https://github.com/withastro/astro.git
synced 2025-01-06 22:10:10 -05:00
7373d61cdc
* feat: pass all slots to renderers * refactor: pass `slots` as top-level props * test: add named slot test for frameworks * fix: nested hydration, slots that are not initially rendered * test: add nested-recursive e2e test * fix: render unmatched custom element children * chore: update lockfile * fix: unrendered slots for client:only * fix(lit): ensure lit integration uses new slots API * chore: add changeset * chore: add changesets * fix: lit slots * feat: convert dash-case or snake_case slots to camelCase for JSX * feat: remove tmpl special logic * test: add slot components-in-markdown test * refactor: prefer Object.entries.map() to for/of loop Co-authored-by: Nate Moore <nate@astro.build>
41 lines
1.1 KiB
JavaScript
41 lines
1.1 KiB
JavaScript
import { sharedConfig } from 'solid-js';
|
|
import { hydrate, render, createComponent } from 'solid-js/web';
|
|
|
|
export default (element) =>
|
|
(Component, props, slotted, { client }) => {
|
|
// Prepare global object expected by Solid's hydration logic
|
|
if (!window._$HY) {
|
|
window._$HY = { events: [], completed: new WeakSet(), r: {} };
|
|
}
|
|
if (!element.hasAttribute('ssr')) return;
|
|
|
|
const fn = client === 'only' ? render : hydrate;
|
|
|
|
let _slots = {};
|
|
if (Object.keys(slotted).length > 0) {
|
|
// hydrating
|
|
if (sharedConfig.context) {
|
|
element.querySelectorAll('astro-slot').forEach((slot) => {
|
|
_slots[slot.getAttribute('name') || 'default'] = slot.cloneNode(true);
|
|
});
|
|
} else {
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
_slots[key] = document.createElement('astro-slot');
|
|
if (key !== 'default') _slots[key].setAttribute('name', key);
|
|
_slots[key].innerHTML = value;
|
|
}
|
|
}
|
|
}
|
|
|
|
const { default: children, ...slots } = _slots;
|
|
|
|
fn(
|
|
() =>
|
|
createComponent(Component, {
|
|
...props,
|
|
...slots,
|
|
children
|
|
}),
|
|
element
|
|
);
|
|
};
|