diff --git a/.changeset/breezy-peaches-agree.md b/.changeset/breezy-peaches-agree.md new file mode 100644 index 000000000000..0c639b8ce99d --- /dev/null +++ b/.changeset/breezy-peaches-agree.md @@ -0,0 +1,5 @@ +--- +"astro": patch +--- + +Fixes minor type issues inside the built-in components of Astro diff --git a/packages/astro/components/Code.astro b/packages/astro/components/Code.astro index 98047b5b8ea5..43cc847bb8fa 100644 --- a/packages/astro/components/Code.astro +++ b/packages/astro/components/Code.astro @@ -80,7 +80,7 @@ const highlighter = await getCachedHighlighter({ ? Object.keys(bundledLanguages).includes(lang) ? lang : 'plaintext' - : lang, + : (lang as any), ], theme, themes, @@ -89,7 +89,7 @@ const highlighter = await getCachedHighlighter({ const html = highlighter.highlight(code, typeof lang === 'string' ? lang : lang.name, { inline, - attributes: rest, + attributes: rest as any, }); --- diff --git a/packages/astro/components/Picture.astro b/packages/astro/components/Picture.astro index b37b2d5451dc..f23ab6ccce7a 100644 --- a/packages/astro/components/Picture.astro +++ b/packages/astro/components/Picture.astro @@ -1,7 +1,7 @@ --- import { getImage, type LocalImageProps, type RemoteImageProps } from 'astro:assets'; import type { GetImageResult, ImageOutputFormat } from '../dist/@types/astro'; -import { isESMImportedImage } from '../dist/assets/utils/imageKind'; +import { isESMImportedImage, resolveSrc } from '../dist/assets/utils/imageKind'; import { AstroError, AstroErrorData } from '../dist/core/errors/index.js'; import type { HTMLAttributes } from '../types'; @@ -27,20 +27,27 @@ if (props.alt === undefined || props.alt === null) { throw new AstroError(AstroErrorData.ImageMissingAlt); } +const originalSrc = await resolveSrc(props.src); const optimizedImages: GetImageResult[] = await Promise.all( formats.map( async (format) => - await getImage({ ...props, format: format, widths: props.widths, densities: props.densities }) + await getImage({ + ...props, + src: originalSrc, + format: format, + widths: props.widths, + densities: props.densities, + }) ) ); let resultFallbackFormat = fallbackFormat ?? defaultFallbackFormat; if ( !fallbackFormat && - isESMImportedImage(props.src) && - specialFormatsFallback.includes(props.src.format) + isESMImportedImage(originalSrc) && + originalSrc.format in specialFormatsFallback ) { - resultFallbackFormat = props.src.format; + resultFallbackFormat = originalSrc.format; } const fallbackImage = await getImage({ diff --git a/packages/astro/src/assets/internal.ts b/packages/astro/src/assets/internal.ts index 4d29247a557c..5cd3cc7bf56e 100644 --- a/packages/astro/src/assets/internal.ts +++ b/packages/astro/src/assets/internal.ts @@ -8,7 +8,7 @@ import type { SrcSetValue, UnresolvedImageTransform, } from './types.js'; -import { isESMImportedImage, isRemoteImage } from './utils/imageKind.js'; +import { isESMImportedImage, isRemoteImage, resolveSrc } from './utils/imageKind.js'; import { probe } from './utils/remoteProbe.js'; export async function getConfiguredImageService(): Promise { @@ -56,10 +56,7 @@ export async function getImage( // If the user inlined an import, something fairly common especially in MDX, or passed a function that returns an Image, await it for them const resolvedOptions: ImageTransform = { ...options, - src: - typeof options.src === 'object' && 'then' in options.src - ? (await options.src).default ?? (await options.src) - : options.src, + src: await resolveSrc(options.src), }; // Infer size for remote images if inferSize is true diff --git a/packages/astro/src/assets/utils/imageKind.ts b/packages/astro/src/assets/utils/imageKind.ts index 866d9ed87662..7b42f9f7017f 100644 --- a/packages/astro/src/assets/utils/imageKind.ts +++ b/packages/astro/src/assets/utils/imageKind.ts @@ -1,4 +1,4 @@ -import type { ImageMetadata } from '../types.js'; +import type { ImageMetadata, UnresolvedImageTransform } from '../types.js'; export function isESMImportedImage(src: ImageMetadata | string): src is ImageMetadata { return typeof src === 'object'; @@ -7,3 +7,7 @@ export function isESMImportedImage(src: ImageMetadata | string): src is ImageMet export function isRemoteImage(src: ImageMetadata | string): src is string { return typeof src === 'string'; } + +export async function resolveSrc(src: UnresolvedImageTransform['src']) { + return typeof src === 'object' && 'then' in src ? (await src).default ?? (await src) : src; +}