Repository: withastro/astro
File: packages/astro/src/types/public/content.ts (TypeScript)

Code before:
	/** Browser URL for files under `/src/pages` (e.g. `/en/guides/markdown-content`) */
	url: string | undefined;
	/** Component to render content in `.astro` files. Usage: `<Content />` */
	Content: AstroComponentFactory;
	/** raw Markdown file content, excluding layout HTML and YAML frontmatter */
	rawContent(): string;
	/** Markdown file compiled to HTML, excluding layout HTML */
	compiledContent(): Promise<string>;
	/** List of headings (h1 -> h6) with associated metadata */
	getHeadings(): MarkdownHeading[];
	default: AstroComponentFactory;
}

export interface MDXInstance<T extends Record<string, any>>
	extends Omit<MarkdownInstance<T>, 'rawContent' | 'compiledContent'> {
	components: Record<string, AstroComponentFactory> | undefined;
}

/**
 * Props accepted by the MDX `Content` component when using `await render()`.
 * Allows passing custom components to override default MDX element rendering.
 *
 * @example
 * ```astro
 * ---
 * import { getEntry, render } from 'astro:content';
 * const entry = await getEntry('blog', 'post');
 * const { Content } = await render(entry);
 * ---
 * <Content components={{ h1: MyCustomH1, img: MyImage }} />
 * ```
 */
export interface MDXContentProps {
	/** Custom components to use for MDX elements (e.g., h1, h2, img, a, etc.) */
	components?: Record<string, AstroComponentFactory>;
	/** Any additional props to pass to the MDX content */
	[key: string]: any;
}

/**
 * The MDX `Content` component returned from `await render()`.
 * Extends `AstroComponentFactory` with typed props for better developer experience.
 */
export type MDXContent = AstroComponentFactory & ((props?: MDXContentProps) => any);

export interface MarkdownLayoutProps<T extends Record<string, any>> {
	frontmatter: {
		file: MarkdownInstance<T>['file'];
		url: MarkdownInstance<T>['url'];
	} & T;
	file: MarkdownInstance<T>['file'];

Review comment (suggestion):
```suggestion
 * import { getEntry, render } from 'astro:content';
 * import MyCustomH1 from '../components/CustomHeading.astro';
 * import MyImage from '../images/MyImage.jpg';
```
Probably something like this? (We don't state a file name, so relative path is just approximate)

Code after:
	/** Browser URL for files under `/src/pages` (e.g. `/en/guides/markdown-content`) */
	url: string | undefined;
	/** Component to render content in `.astro` files. Usage: `<Content />` */
	Content: AstroComponentFactory;
	/** raw Markdown file content, excluding layout HTML and YAML frontmatter */
	rawContent(): string;
	/** Markdown file compiled to HTML, excluding layout HTML */
	compiledContent(): Promise<string>;
	/** List of headings (h1 -> h6) with associated metadata */
	getHeadings(): MarkdownHeading[];
	default: AstroComponentFactory;
}

export interface MDXInstance<T extends Record<string, any>>
	extends Omit<MarkdownInstance<T>, 'rawContent' | 'compiledContent'> {
	components: Record<string, AstroComponentFactory> | undefined;
}

/**
 * Props accepted by the MDX `Content` component when using `await render()`.
 * Allows passing custom components to override default MDX element rendering.
 *
 * @example
 * ```astro
 * ---
 * import { getEntry, render } from 'astro:content';
 * import MyCustomH1 from '../components/CustomHeading.astro';
 * import MyImage from '../images/MyImage.jpg';
 * const entry = await getEntry('blog', 'post');
 * const { Content } = await render(entry);
 * ---
 * <Content components={{ h1: MyCustomH1, img: MyImage }} />
 * ```
 */
export interface MDXContentProps {
	/** Custom components to use for MDX elements (e.g., h1, h2, img, a, etc.) */
	components?: Record<string, AstroComponentFactory>;
	/** Any additional props to pass to the MDX content */
	[key: string]: any;
}

/**
 * The MDX `Content` component returned from `await render()`.
 * Extends `AstroComponentFactory` with typed props for better developer experience.
 */
export type MDXContent = AstroComponentFactory & ((props?: MDXContentProps) => any);

export interface MarkdownLayoutProps<T extends Record<string, any>> {
	frontmatter: {
		file: MarkdownInstance<T>['file'];
		url: MarkdownInstance<T>['url'];