AstroComponentInstance Class — astro Architecture

Source Code

packages/astro/src/runtime/server/render/astro/instance.ts lines 14–85

export class AstroComponentInstance {
	[astroComponentInstanceSym] = true;

	private readonly result: SSRResult;
	private readonly props: ComponentProps;
	private readonly slotValues: ComponentSlots;
	private readonly factory: AstroComponentFactory;
	private returnValue: ReturnType<AstroComponentFactory> | undefined;
	constructor(
		result: SSRResult,
		props: ComponentProps,
		slots: ComponentSlots,
		factory: AstroComponentFactory,
	) {
		this.result = result;
		this.props = props;
		this.factory = factory;
		this.slotValues = {};
		for (const name in slots) {
			// prerender the slots eagerly to make collection entries propagate styles and scripts
			let didRender = false;
			let value = slots[name](result);
			this.slotValues[name] = () => {
				// use prerendered value only once
				if (!didRender) {
					didRender = true;
					return value;
				}
				// render afresh for the advanced use-case where the same slot is rendered multiple times
				return slots[name](result);
			};
		}
	}

	init(result: SSRResult): AstroFactoryReturnValue | Promise<AstroFactoryReturnValue> {
		if (this.returnValue !== undefined) {
			return this.returnValue;
		}

		this.returnValue = this.factory(result, this.props, this.slotValues);

		// Save the resolved value after promise is resolved for optimization
		if (isPromise(this.returnValue)) {
			this.returnValue
				.then((resolved) => {
					this.returnValue = resolved;
				})
				.catch(() => {
					// Ignore errors and appease unhandledrejection error
				});
		}
		return this.returnValue;
	}

	render(destination: RenderDestination): void | Promise<void> {
		const returnValue = this.init(this.result);

		if (isPromise(returnValue)) {
			return returnValue.then((x) => this.renderImpl(destination, x));
		}

		return this.renderImpl(destination, returnValue);
	}

	private renderImpl(destination: RenderDestination, returnValue: AstroFactoryReturnValue) {
		if (isHeadAndContent(returnValue)) {
			return returnValue.content.render(destination);
		} else {
			return renderChild(destination, returnValue);
		}
	}
}