renderToStaticMarkup() — astro Function Reference

Source Code

packages/integrations/react/src/server.ts lines 66–125

async function renderToStaticMarkup(
	this: RendererContext,
	Component: any,
	props: Record<string, any>,
	{ default: children, ...slotted }: Record<string, any>,
	metadata?: AstroComponentMetadata,
) {
	let prefix;
	if (this && this.result) {
		prefix = incrementId(this.result);
	}
	const attrs: Record<string, any> = { prefix };

	delete props['class'];
	const slots: Record<string, any> = {};
	for (const [key, value] of Object.entries(slotted)) {
		const name = slotName(key);
		slots[name] = React.createElement(StaticHtml, {
			hydrate: needsHydration(metadata),
			value,
			name,
		});
	}
	// Note: create newProps to avoid mutating `props` before they are serialized
	const newProps = {
		...props,
		...slots,
	};
	const newChildren = children ?? props.children;
	if (children && opts.experimentalReactChildren) {
		attrs['data-react-children'] = true;
		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,
		});
	}
	const formState = this ? await getFormState(this) : undefined;
	if (formState) {
		attrs['data-action-result'] = JSON.stringify(formState[0]);
		attrs['data-action-key'] = formState[1];
		attrs['data-action-name'] = formState[2];
	}
	const vnode = React.createElement(Component, newProps);
	const renderOptions = {
		identifierPrefix: prefix,
		formState,
	};
	let html: string;
	if (opts.experimentalDisableStreaming) {
		html = ReactDOM.renderToString(vnode);
	} else if ('renderToReadableStream' in ReactDOM) {
		html = await renderToReadableStreamAsync(vnode, renderOptions);
	} else {
		html = await renderToPipeableStreamAsync(vnode, renderOptions);
	}
	return { html, attrs };
}