addClientOnlyMetadata() — astro Function Reference

Architecture documentation for the addClientOnlyMetadata() function in rehype.ts from the astro codebase.

Function typescript CoreAstro RenderingEngine called by 1

Entity Profile

CoreAstro→ RenderingEngine→ addClientOnlyMetadata() — astro Function Reference

Dependency Diagram

graph TD
  4e3bfe6a_df90_e8eb_8780_b01939be9909["addClientOnlyMetadata()"]
  89da4403_ab4a_62fa_64f0_d53bd0b3aee8["rehype.ts"]
  4e3bfe6a_df90_e8eb_8780_b01939be9909 -->|defined in| 89da4403_ab4a_62fa_64f0_d53bd0b3aee8
  d17ed63a_5ec6_bc29_96d7_b3145cec7d5d["rehypeAnalyzeAstroMetadata()"]
  d17ed63a_5ec6_bc29_96d7_b3145cec7d5d -->|calls| 4e3bfe6a_df90_e8eb_8780_b01939be9909
  style 4e3bfe6a_df90_e8eb_8780_b01939be9909 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/jsx/rehype.ts lines 298–340

function addClientOnlyMetadata(
	node: MdxJsxFlowElementHast | MdxJsxTextElementHast,
	meta: { path: string; name: string },
	resolvedPath: string,
) {
	const attributeNames = node.attributes
		.map((attr) => (attr.type === 'mdxJsxAttribute' ? attr.name : null))
		.filter(Boolean);

	if (!attributeNames.includes('client:display-name')) {
		node.attributes.push({
			type: 'mdxJsxAttribute',
			name: 'client:display-name',
			value: node.name,
		});
	}
	if (!attributeNames.includes('client:component-hydpathation')) {
		node.attributes.push({
			type: 'mdxJsxAttribute',
			name: 'client:component-path',
			value: resolvedPath,
		});
	}
	if (!attributeNames.includes('client:component-export')) {
		if (meta.name === '*') {
			meta.name = node.name!.split('.').slice(1).join('.')!;
		}
		node.attributes.push({
			type: 'mdxJsxAttribute',
			name: 'client:component-export',
			value: meta.name,
		});
	}
	if (!attributeNames.includes('client:component-hydration')) {
		node.attributes.push({
			type: 'mdxJsxAttribute',
			name: 'client:component-hydration',
			value: null,
		});
	}

	node.name = ClientOnlyPlaceholder;
}