2023-12-07 09:47:04 -05:00
|
|
|
import { add_snippet_symbol } from 'svelte/internal';
|
2024-02-27 06:15:27 -05:00
|
|
|
import { render } from 'svelte/server';
|
2023-12-07 09:47:04 -05:00
|
|
|
|
|
|
|
// Allow a slot to be rendered as a snippet (dev validation only)
|
|
|
|
const tagSlotAsSnippet = import.meta.env.DEV ? add_snippet_symbol : (s) => s;
|
2023-11-15 10:40:23 -05:00
|
|
|
|
|
|
|
function check(Component) {
|
|
|
|
// Svelte 5 generated components always accept these two props
|
|
|
|
const str = Component.toString();
|
|
|
|
return str.includes('$$payload') && str.includes('$$props');
|
|
|
|
}
|
|
|
|
|
|
|
|
function needsHydration(metadata) {
|
|
|
|
// Adjust how this is hydrated only when the version of Astro supports `astroStaticSlot`
|
|
|
|
return metadata.astroStaticSlot ? !!metadata.hydrate : true;
|
|
|
|
}
|
|
|
|
|
|
|
|
async function renderToStaticMarkup(Component, props, slotted, metadata) {
|
|
|
|
const tagName = needsHydration(metadata) ? 'astro-slot' : 'astro-static-slot';
|
|
|
|
|
|
|
|
let children = undefined;
|
|
|
|
let $$slots = undefined;
|
|
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
|
|
if (key === 'default') {
|
2023-12-07 09:47:04 -05:00
|
|
|
children = tagSlotAsSnippet(() => `<${tagName}>${value}</${tagName}>`);
|
2023-11-15 10:40:23 -05:00
|
|
|
} else {
|
|
|
|
$$slots ??= {};
|
2023-12-07 09:47:04 -05:00
|
|
|
$$slots[key] = tagSlotAsSnippet(() => `<${tagName} name="${key}">${value}</${tagName}>`);
|
2023-11-15 10:40:23 -05:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const { html } = render(Component, {
|
|
|
|
props: {
|
|
|
|
...props,
|
|
|
|
children,
|
|
|
|
$$slots,
|
|
|
|
},
|
|
|
|
});
|
|
|
|
return { html };
|
|
|
|
}
|
|
|
|
|
|
|
|
export default {
|
|
|
|
check,
|
|
|
|
renderToStaticMarkup,
|
|
|
|
supportsAstroStaticSlot: true,
|
|
|
|
};
|