renderHTMLComponent() — astro Function Reference

Architecture documentation for the renderHTMLComponent() function in component.ts from the astro codebase.

Function typescript CoreAstro RenderingEngine called by 1

Entity Profile

CoreAstro→ RenderingEngine→ renderHTMLComponent() — astro Function Reference

Dependency Diagram

graph TD
  6f2499fd_5163_c84a_13ac_b343beae6c61["renderHTMLComponent()"]
  8fc97f1b_c914_c155_013d_cbd729fb6b4f["component.ts"]
  6f2499fd_5163_c84a_13ac_b343beae6c61 -->|defined in| 8fc97f1b_c914_c155_013d_cbd729fb6b4f
  94f21ea8_f0e7_2f4c_ee40_699f26c9ede0["renderComponent()"]
  94f21ea8_f0e7_2f4c_ee40_699f26c9ede0 -->|calls| 6f2499fd_5163_c84a_13ac_b343beae6c61
  style 6f2499fd_5163_c84a_13ac_b343beae6c61 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/runtime/server/render/component.ts lines 420–436

async function renderHTMLComponent(
	result: SSRResult,
	Component: unknown,
	_props: Record<string | number, any>,
	slots: any = {},
): Promise<RenderInstance> {
	const { slotInstructions, children } = await renderSlots(result, slots);
	const html = (Component as any)({ slots: children });
	const hydrationHtml = slotInstructions
		? slotInstructions.map((instr) => chunkToString(result, instr)).join('')
		: '';
	return {
		render(destination) {
			destination.write(markHTMLString(hydrationHtml + html));
		},
	};
}