Component() — astro Function Reference

Architecture documentation for the Component() function in React.tsx from the astro codebase.

Function tsx E2ETesting TestFixtures

Entity Profile

E2ETesting→ TestFixtures→ Component() — astro Function Reference

Dependency Diagram

graph TD
  70fc62d0_280a_b81e_f4d3_18e6c3af16fc["Component()"]
  3efbebf9_d783_6249_ce94_7e871abc17d6["React.tsx"]
  70fc62d0_280a_b81e_f4d3_18e6c3af16fc -->|defined in| 3efbebf9_d783_6249_ce94_7e871abc17d6
  style 70fc62d0_280a_b81e_f4d3_18e6c3af16fc fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/e2e/fixtures/pass-js/src/components/React.tsx lines 21–58

export default function Component({ undefined: undefinedProp, null: nullProp, boolean, number, string, bigint, object, array, map, set, infinity, negativeInfinity }: Props) {
	// We are testing hydration, so don't return anything in the server.
	if(isNode) {
		return <div></div>
	}

	return (
		<div>
			<span id="undefined-type">{Object.prototype.toString.call(undefinedProp)}</span>
			<span id="null-type">{Object.prototype.toString.call(nullProp)}</span>
			<span id="boolean-type">{Object.prototype.toString.call(boolean)}</span>
			<span id="boolean-value">{boolean.toString()}</span>
			<span id="number-type">{Object.prototype.toString.call(number)}</span>
			<span id="number-value">{number.toString()}</span>
			<span id="infinity-type">{Object.prototype.toString.call(infinity)}</span>
			<span id="infinity-value">{infinity.toString()}</span>
			<span id="negative-infinity-type">{Object.prototype.toString.call(negativeInfinity)}</span>
			<span id="negative-infinity-value">{negativeInfinity.toString()}</span>
			<span id="string-type">{Object.prototype.toString.call(string)}</span>
			<span id="string-value">{string}</span>
			<span id="bigint-type">{Object.prototype.toString.call(bigint)}</span>
			<span id="bigint-value">{bigint.toString()}</span>
			<span id="date-type">{Object.prototype.toString.call(object.nested.date)}</span>
			<span id="date-value">{object.nested.date.toUTCString()}</span>
			<span id="regexp-type">{Object.prototype.toString.call(object.more.another.exp)}</span>
			<span id="regexp-value">{object.more.another.exp.source}</span>
			<span id="array-type">{Object.prototype.toString.call(array)}</span>
			<span id="array-value">{array.join(',')}</span>
			<span id="map-type">{Object.prototype.toString.call(map)}</span>
			<ul id="map-items">{Array.from(map).map(([key, value]) => (
				<li>{key}: {value}</li>
			))}
			</ul>
			<span id="set-type">{Object.prototype.toString.call(set)}</span>
			<span id="set-value">{Array.from(set).join(',')}</span>
		</div>
	);
}