astro 7.0.0-alpha.0 → 7.0.0-alpha.2

package/components/Code.astro

@@ -1,5 +1,5 @@
 ---
-import { createShikiHighlighter, type ThemePresets } from '@astrojs/markdown-remark/shiki';
+import { createShikiHighlighter, type ThemePresets } from '@astrojs/internal-helpers/shiki';
 import type { ShikiTransformer, ThemeRegistration, ThemeRegistrationRaw } from 'shiki';
 import { bundledLanguages } from 'shiki/langs';
 import type { CodeLanguage } from '../dist/types/public/common.js';

package/dist/actions/handler.d.ts

@@ -0,0 +1,32 @@
+import type { APIContext } from '../types/public/context.js';
+import type { FetchState } from '../core/fetch/fetch-state.js';
+/**
+ * Handles Astro Action requests in both modes:
+ *
+ * - **RPC**: POST requests to `/_actions/<name>` (originating from the
+ *   generated JS client). Runs the action and returns the serialized result
+ *   as the response, so the caller can short-circuit rendering.
+ * - **Form**: POST requests with `?_action=<name>` targeting a page route
+ *   (originating from an HTML `<form action={actions.foo}>`). Runs the
+ *   action, stashes the result into `locals._actionPayload`, and returns
+ *   `undefined` so the caller continues to render the page.
+ *
+ * Non-action requests are a no-op (`undefined`).
+ *
+ * This handler is invoked at the bottom of the middleware chain, before
+ * page dispatch. That placement preserves the existing behavior where
+ * user middleware sees action requests and response finalization (cookies,
+ * sessions, etc.) runs around the action response.
+ */
+export declare class ActionHandler {
+    #private;
+    /**
+     * Run action handling for the current request. Expects the APIContext
+     * that is already being used by the render pipeline.
+     *
+     * Returns a `Response` when the action fully handles the request (RPC),
+     * or `undefined` when the caller should continue processing the
+     * request (form actions or non-action requests).
+     */
+    handle(apiContext: APIContext, state: FetchState): Promise<Response | undefined> | undefined;
+}

package/dist/actions/handler.js

@@ -0,0 +1,45 @@
+import { PipelineFeatures } from "../core/base-pipeline.js";
+import { getActionContext, serializeActionResult } from "./runtime/server.js";
+class ActionHandler {
+  /**
+   * Run action handling for the current request. Expects the APIContext
+   * that is already being used by the render pipeline.
+   *
+   * Returns a `Response` when the action fully handles the request (RPC),
+   * or `undefined` when the caller should continue processing the
+   * request (form actions or non-action requests).
+   */
+  handle(apiContext, state) {
+    state.pipeline.usedFeatures |= PipelineFeatures.actions;
+    if (apiContext.isPrerendered) {
+      return void 0;
+    }
+    const { action, setActionResult } = getActionContext(apiContext);
+    if (!action) {
+      return void 0;
+    }
+    return this.#executeAction(action, setActionResult);
+  }
+  async #executeAction(action, setActionResult) {
+    const actionResult = await action.handler();
+    const serialized = serializeActionResult(actionResult);
+    if (action.calledFrom === "rpc") {
+      if (serialized.type === "empty") {
+        return new Response(null, {
+          status: serialized.status
+        });
+      }
+      return new Response(serialized.body, {
+        status: serialized.status,
+        headers: {
+          "Content-Type": serialized.contentType
+        }
+      });
+    }
+    setActionResult(action.name, serialized);
+    return void 0;
+  }
+}
+export {
+  ActionHandler
+};

package/dist/actions/runtime/server.js

@@ -266,7 +266,7 @@ function handleFormDataGetAll(key, formData, validator) {
   if (elementValidator instanceof z.$ZodNumber) {
     return entries.map(Number);
   } else if (elementValidator instanceof z.$ZodBoolean) {
-    return entries.map(Boolean);
+    return entries.map((v) => v === "true" ? true : v === "false" ? false : Boolean(v));
   }
   return entries;
 }

package/dist/assets/build/generate.js

@@ -234,7 +234,7 @@ function getStaticImageList() {
 }
 async function loadImage(path, env) {
   if (isRemotePath(path)) {
-    return await loadRemoteImage(path);
+    return await loadRemoteImage(path, void 0, env.imageConfig);
   }
   return {
     data: await fs.promises.readFile(getFullImagePath(path, env)),

package/dist/assets/build/remote.d.ts

@@ -1,10 +1,11 @@
+import { type RemoteImageConfig } from '../utils/redirectValidation.js';
 export type RemoteCacheEntry = {
     data?: string;
     expires: number;
     etag?: string;
     lastModified?: string;
 };
-export declare function loadRemoteImage(src: string, fetchFn?: typeof fetch): Promise<{
+export declare function loadRemoteImage(src: string, fetchFn?: typeof fetch, imageConfig?: RemoteImageConfig): Promise<{
     data: Buffer<ArrayBuffer>;
     expires: number;
     etag: string | undefined;
@@ -22,7 +23,7 @@ export declare function loadRemoteImage(src: string, fetchFn?: typeof fetch): Pr
 export declare function revalidateRemoteImage(src: string, revalidationData: {
     etag?: string;
     lastModified?: string;
-}, fetchFn?: typeof fetch): Promise<{
+}, fetchFn?: typeof fetch, imageConfig?: RemoteImageConfig): Promise<{
     data: Buffer<ArrayBuffer> | null;
     expires: number;
     etag: string | undefined;

package/dist/assets/build/remote.js

@@ -1,15 +1,17 @@
 import CachePolicy from "http-cache-semantics";
-async function loadRemoteImage(src, fetchFn = globalThis.fetch) {
-  const req = new Request(src);
-  const res = await fetchFn(req, { redirect: "manual" });
-  if (res.status >= 300 && res.status < 400) {
-    throw new Error(`Failed to load remote image ${src}. The request was redirected.`);
-  }
+import { fetchWithRedirects } from "../utils/redirectValidation.js";
+async function loadRemoteImage(src, fetchFn = globalThis.fetch, imageConfig = { remotePatterns: [], domains: [] }) {
+  const res = await fetchWithRedirects({
+    url: src,
+    fetchFn,
+    imageConfig
+  });
   if (!res.ok) {
     throw new Error(
       `Failed to load remote image ${src}. The request did not return a 200 OK response. (received ${res.status}))`
     );
   }
+  const req = new Request(src);
   const policy = new CachePolicy(webToCachePolicyRequest(req), webToCachePolicyResponse(res));
   const expires = policy.storable() ? policy.timeToLive() : 0;
   return {
@@ -19,13 +21,18 @@ async function loadRemoteImage(src, fetchFn = globalThis.fetch) {
     lastModified: res.headers.get("Last-Modified") ?? void 0
   };
 }
-async function revalidateRemoteImage(src, revalidationData, fetchFn = globalThis.fetch) {
+async function revalidateRemoteImage(src, revalidationData, fetchFn = globalThis.fetch, imageConfig = { remotePatterns: [], domains: [] }) {
   const headers = {
     ...revalidationData.etag && { "If-None-Match": revalidationData.etag },
     ...revalidationData.lastModified && { "If-Modified-Since": revalidationData.lastModified }
   };
   const req = new Request(src, { headers, cache: "no-cache" });
-  const res = await fetchFn(req, { redirect: "manual" });
+  const res = await fetchWithRedirects({
+    url: src,
+    headers: new Headers(headers),
+    imageConfig,
+    fetchFn
+  });
   if (!res.ok && res.status !== 304) {
     if (res.status >= 300 && res.status < 400) {
       throw new Error(
@@ -38,7 +45,7 @@ async function revalidateRemoteImage(src, revalidationData, fetchFn = globalThis
   }
   const data = Buffer.from(await res.arrayBuffer());
   if (res.ok && !data.length) {
-    return await loadRemoteImage(src, fetchFn);
+    return await loadRemoteImage(src, fetchFn, imageConfig);
   }
   const policy = new CachePolicy(
     webToCachePolicyRequest(req),

package/dist/assets/endpoint/dev.js

@@ -38,7 +38,7 @@ async function loadLocalImage(src, url) {
   } else {
     const sourceUrl = new URL(src, url.origin);
     if (sourceUrl.origin !== url.origin) {
-      returnValue = void 0;
+      return void 0;
     }
     return loadRemoteImage(sourceUrl);
   }

package/dist/assets/endpoint/generic.js

@@ -4,24 +4,7 @@ import { isRemoteAllowed } from "@astrojs/internal-helpers/remote";
 import * as mime from "mrmime";
 import { getConfiguredImageService } from "../internal.js";
 import { etag } from "../utils/etag.js";
-async function loadRemoteImage(src, headers) {
-  try {
-    const res = await fetch(src, {
-      // Forward all headers from the original request
-      headers,
-      redirect: "manual"
-    });
-    if (res.status >= 300 && res.status < 400) {
-      return void 0;
-    }
-    if (!res.ok) {
-      return void 0;
-    }
-    return await res.arrayBuffer();
-  } catch {
-    return void 0;
-  }
-}
+import { loadImage } from "./loadImage.js";
 const GET = async ({ request }) => {
   try {
     const imageService = await getConfiguredImageService();
@@ -42,7 +25,12 @@ const GET = async ({ request }) => {
     if (!isRemoteImage && sourceUrl.origin !== url.origin) {
       return new Response("Forbidden", { status: 403 });
     }
-    inputBuffer = await loadRemoteImage(sourceUrl, isRemoteImage ? new Headers() : request.headers);
+    inputBuffer = await loadImage(
+      sourceUrl,
+      isRemoteImage ? new Headers() : request.headers,
+      imageConfig,
+      isRemoteImage
+    );
     if (!inputBuffer) {
       return new Response("Not Found", { status: 404 });
     }
@@ -62,7 +50,7 @@ const GET = async ({ request }) => {
     });
   } catch (err) {
     console.error("Could not process image request:", err);
-    return new Response(`Server Error: ${err}`, { status: 500 });
+    return new Response("Internal Server Error", { status: 500 });
   }
 };
 export {

package/dist/assets/endpoint/loadImage.d.ts

@@ -0,0 +1,11 @@
+import type { RemoteImageConfig } from '../utils/redirectValidation.js';
+/**
+ * Fetches an image by URL. Used by the generic image endpoint for both
+ * remote images and local images (self-fetched from the same origin).
+ *
+ * For remote images, the final URL (after any redirects) is validated
+ * against `imageConfig.domains` and `imageConfig.remotePatterns`.
+ * Local images skip this check — they are already guarded by the
+ * same-origin check in the caller.
+ */
+export declare function loadImage(src: URL, headers: Headers, imageConfig: RemoteImageConfig, isRemote: boolean, fetchFn?: typeof globalThis.fetch): Promise<ArrayBuffer | undefined>;

package/dist/assets/endpoint/loadImage.js

@@ -0,0 +1,19 @@
+import { isRemoteAllowed } from "@astrojs/internal-helpers/remote";
+import { fetchWithRedirects } from "../utils/redirectValidation.js";
+async function loadImage(src, headers, imageConfig, isRemote, fetchFn) {
+  try {
+    const res = await fetchWithRedirects({ url: src, headers, imageConfig, fetchFn });
+    if (isRemote && !isRemoteAllowed(res.url, imageConfig)) {
+      return void 0;
+    }
+    if (!res.ok) {
+      return void 0;
+    }
+    return await res.arrayBuffer();
+  } catch {
+    return void 0;
+  }
+}
+export {
+  loadImage
+};

package/dist/assets/endpoint/shared.js

@@ -5,10 +5,15 @@ import * as mime from "mrmime";
 import { getConfiguredImageService } from "../internal.js";
 import { etag } from "../utils/etag.js";
 import { inferSourceFormat } from "../utils/inferSourceFormat.js";
+import { fetchWithRedirects } from "../utils/redirectValidation.js";
+const isLocal = (url) => {
+  const hostname = new URL(url).hostname;
+  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "[::1]";
+};
 async function loadRemoteImage(src) {
   try {
-    const res = await fetch(src, { redirect: "manual" });
-    if (res.status >= 300 && res.status < 400) {
+    const res = await fetchWithRedirects({ url: src, imageConfig });
+    if (!isRemoteAllowed(res.url, imageConfig) && !isLocal(res.url)) {
       return void 0;
     }
     if (!res.ok) {

package/dist/assets/fonts/config.d.ts

@@ -7,11 +7,11 @@ export declare const StyleSchema: z.ZodEnum<{
     oblique: "oblique";
 }>;
 export declare const DisplaySchema: z.ZodEnum<{
-    optional: "optional";
     auto: "auto";
+    optional: "optional";
+    fallback: "fallback";
     block: "block";
     swap: "swap";
-    fallback: "fallback";
 }>;
 export declare const FontProviderSchema: z.ZodCustom<FontProvider<never>, FontProvider<never>>;
 export declare const FontFamilySchema: z.ZodObject<{
@@ -45,11 +45,11 @@ export declare const FontFamilySchema: z.ZodObject<{
     fallbacks: z.ZodOptional<z.ZodArray<z.ZodString>>;
     optimizedFallbacks: z.ZodOptional<z.ZodBoolean>;
     display: z.ZodOptional<z.ZodEnum<{
-        optional: "optional";
         auto: "auto";
+        optional: "optional";
+        fallback: "fallback";
         block: "block";
         swap: "swap";
-        fallback: "fallback";
     }>>;
     stretch: z.ZodOptional<z.ZodString>;
     featureSettings: z.ZodOptional<z.ZodString>;

package/dist/assets/fonts/core/optimize-fallbacks.js

@@ -1,4 +1,17 @@
 import { isGenericFontFamily, unifontFontFaceDataToProperties } from "../utils.js";
+function deriveFallbackVariant(data) {
+  const weight = data.weight;
+  if (typeof weight === "number" && weight >= 700) {
+    return "bold";
+  }
+  if (typeof weight === "string") {
+    if (weight === "bold") return "bold";
+    if (weight.includes(" ")) return "normal";
+    const n = Number.parseInt(weight, 10);
+    if (!Number.isNaN(n) && n >= 700) return "bold";
+  }
+  return "normal";
+}
 async function optimizeFallbacks({
   family,
   fallbacks: _fallbacks,
@@ -14,28 +27,40 @@ async function optimizeFallbacks({
   if (!isGenericFontFamily(lastFallback)) {
     return null;
   }
-  const localFonts = systemFallbacksProvider.getLocalFonts(lastFallback);
-  if (!localFonts || localFonts.length === 0) {
+  const collectedWithLocalFonts = collectedFonts.map((collected) => ({
+    collected,
+    localFonts: systemFallbacksProvider.getLocalFonts(lastFallback, deriveFallbackVariant(collected.data)) ?? []
+  }));
+  const uniqueLocalFonts = [];
+  for (const { localFonts } of collectedWithLocalFonts) {
+    for (const font of localFonts) {
+      if (!uniqueLocalFonts.includes(font)) {
+        uniqueLocalFonts.push(font);
+      }
+    }
+  }
+  if (uniqueLocalFonts.length === 0) {
     return null;
   }
-  if (localFonts.includes(family.name)) {
+  if (uniqueLocalFonts.includes(family.name)) {
     return null;
   }
-  const localFontsMappings = localFonts.map((font) => ({
-    font,
+  const nameForFont = (font) => (
     // We mustn't wrap in quote because that's handled by the CSS renderer
-    name: `${family.uniqueName} fallback: ${font}`
-  }));
-  fallbacks = [...localFontsMappings.map((m) => m.name), ...fallbacks];
+    `${family.uniqueName} fallback: ${font}`
+  );
+  fallbacks = [...uniqueLocalFonts.map(nameForFont), ...fallbacks];
   let css = "";
-  for (const { font, name } of localFontsMappings) {
-    for (const collected of collectedFonts) {
+  for (const { collected, localFonts } of collectedWithLocalFonts) {
+    const properties = unifontFontFaceDataToProperties(collected.data);
+    const metrics = await fontMetricsResolver.getMetrics(family.name, collected);
+    for (const font of localFonts) {
       css += fontMetricsResolver.generateFontFace({
-        metrics: await fontMetricsResolver.getMetrics(family.name, collected),
+        metrics,
         fallbackMetrics: systemFallbacksProvider.getMetricsForLocalFont(font),
         font,
-        name,
-        properties: unifontFontFaceDataToProperties(collected.data)
+        name: nameForFont(font),
+        properties
       });
     }
   }

package/dist/assets/fonts/definitions.d.ts

@@ -1,6 +1,6 @@
 import type * as unifont from 'unifont';
 import type { CollectedFontForMetrics } from './core/optimize-fallbacks.js';
-import type { CssProperties, FontFaceMetrics, FontFileData, FontProvider, FontType, GenericFallbackName, ResolveFontOptions, Style } from './types.js';
+import type { CssProperties, FallbackVariant, FontFaceMetrics, FontFileData, FontProvider, FontType, GenericFallbackName, ResolveFontOptions, Style } from './types.js';
 export interface Hasher {
     hashString: (input: string) => string;
     hashObject: (input: Record<string, any>) => string;
@@ -28,7 +28,7 @@ export interface FontMetricsResolver {
     }) => string;
 }
 export interface SystemFallbacksProvider {
-    getLocalFonts: (fallback: GenericFallbackName) => Array<string> | null;
+    getLocalFonts: (fallback: GenericFallbackName, variant: FallbackVariant) => Array<string> | null;
     getMetricsForLocalFont: (family: string) => FontFaceMetrics;
 }
 export interface FontFetcher {

package/dist/assets/fonts/infra/system-fallbacks-provider.d.ts

@@ -1,6 +1,6 @@
 import type { SystemFallbacksProvider } from '../definitions.js';
-import type { FontFaceMetrics, GenericFallbackName } from '../types.js';
+import type { FallbackVariant, FontFaceMetrics, GenericFallbackName } from '../types.js';
 export declare class RealSystemFallbacksProvider implements SystemFallbacksProvider {
-    getLocalFonts(fallback: GenericFallbackName): Array<string> | null;
+    getLocalFonts(fallback: GenericFallbackName, variant: FallbackVariant): Array<string> | null;
     getMetricsForLocalFont(family: string): FontFaceMetrics;
 }

package/dist/assets/fonts/infra/system-fallbacks-provider.js

@@ -6,6 +6,14 @@ const SYSTEM_METRICS = {
     unitsPerEm: 2048,
     xWidthAvg: 832
   },
+  "Times New Roman Bold": {
+    ascent: 1825,
+    descent: -443,
+    lineGap: 87,
+    unitsPerEm: 2048,
+    xWidthAvg: 886
+  },
+  // Times New Roman Italic almost has the same properties as Times New Roman, we don't include it
   Arial: {
     ascent: 1854,
     descent: -434,
@@ -13,6 +21,14 @@ const SYSTEM_METRICS = {
     unitsPerEm: 2048,
     xWidthAvg: 913
   },
+  "Arial Bold": {
+    ascent: 1854,
+    descent: -434,
+    lineGap: 67,
+    unitsPerEm: 2048,
+    xWidthAvg: 983
+  },
+  // Arial Italic has the same properties as Arial, we don't include it
   "Courier New": {
     ascent: 1705,
     descent: -615,
@@ -20,6 +36,8 @@ const SYSTEM_METRICS = {
     unitsPerEm: 2048,
     xWidthAvg: 1229
   },
+  // Courier New Bold has the same properties as Courier New, we don't include it
+  // Courier New Italic has the same properties as Courier New, we don't include it
   BlinkMacSystemFont: {
     ascent: 1980,
     descent: -432,
@@ -50,17 +68,36 @@ const SYSTEM_METRICS = {
   }
 };
 const DEFAULT_FALLBACKS = {
-  serif: ["Times New Roman"],
-  "sans-serif": ["Arial"],
-  monospace: ["Courier New"],
-  "system-ui": ["BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial"],
-  "ui-serif": ["Times New Roman"],
-  "ui-sans-serif": ["Arial"],
-  "ui-monospace": ["Courier New"]
+  serif: {
+    normal: ["Times New Roman"],
+    bold: ["Times New Roman Bold"]
+  },
+  "sans-serif": {
+    normal: ["Arial"],
+    bold: ["Arial Bold"]
+  },
+  monospace: { normal: ["Courier New"] },
+  "system-ui": {
+    normal: ["BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial"],
+    bold: ["BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial Bold"]
+  },
+  "ui-serif": {
+    normal: ["Times New Roman"],
+    bold: ["Times New Roman Bold"]
+  },
+  "ui-sans-serif": {
+    normal: ["Arial"],
+    bold: ["Arial Bold"]
+  },
+  "ui-monospace": { normal: ["Courier New"] }
 };
 class RealSystemFallbacksProvider {
-  getLocalFonts(fallback) {
-    return DEFAULT_FALLBACKS[fallback] ?? null;
+  getLocalFonts(fallback, variant) {
+    const entry = DEFAULT_FALLBACKS[fallback];
+    if (!entry) {
+      return null;
+    }
+    return entry[variant] ?? entry.normal ?? null;
   }
   getMetricsForLocalFont(family) {
     return SYSTEM_METRICS[family];

package/dist/assets/fonts/types.d.ts

@@ -191,6 +191,7 @@ export interface PreloadData {
 }
 export type FontFaceMetrics = Pick<Font, 'ascent' | 'descent' | 'lineGap' | 'unitsPerEm' | 'xWidthAvg'>;
 export type GenericFallbackName = (typeof GENERIC_FALLBACK_NAMES)[number];
+export type FallbackVariant = 'normal' | 'bold';
 export type Defaults = Required<Pick<ResolvedFontFamily, 'weights' | 'styles' | 'subsets' | 'fallbacks' | 'optimizedFallbacks' | 'formats'>>;
 export interface FontFileData {
     id: string;

package/dist/assets/index.d.ts

@@ -2,3 +2,4 @@ export { getConfiguredImageService, getImage, verifyOptions } from './internal.j
 export { baseService, isLocalService } from './services/service.js';
 export { hashTransform, propsToFilename } from './utils/hash.js';
 export type { LocalImageProps, RemoteImageProps } from './types.js';
+export { fetchWithRedirects } from './utils/redirectValidation.js';

package/dist/assets/index.js

@@ -1,8 +1,10 @@
 import { getConfiguredImageService, getImage, verifyOptions } from "./internal.js";
 import { baseService, isLocalService } from "./services/service.js";
 import { hashTransform, propsToFilename } from "./utils/hash.js";
+import { fetchWithRedirects } from "./utils/redirectValidation.js";
 export {
   baseService,
+  fetchWithRedirects,
   getConfiguredImageService,
   getImage,
   hashTransform,

package/dist/assets/internal.js

@@ -13,6 +13,7 @@ import {
   isImageMetadata
 } from "./types.js";
 import { isESMImportedImage, isRemoteImage, resolveSrc } from "./utils/imageKind.js";
+import { resolveDefaultOutputFormat } from "./utils/inferSourceFormat.js";
 import { inferRemoteSize } from "./utils/remoteProbe.js";
 import { createPlaceholderURL, stringifyPlaceholderURL } from "./utils/url.js";
 import { verifyOptions } from "./services/service.js";
@@ -73,6 +74,9 @@ async function getImage(options, imageConfig) {
       const result = await getRemoteSize(resolvedOptions.src);
       resolvedOptions.width ??= result.width;
       resolvedOptions.height ??= result.height;
+      if (result.format) {
+        resolvedOptions.format ??= resolveDefaultOutputFormat(result.format);
+      }
       originalWidth = result.width;
       originalHeight = result.height;
     }
@@ -122,11 +126,15 @@ async function getImage(options, imageConfig) {
     if (resolvedOptions.fit && cssFitValues.includes(resolvedOptions.fit)) {
       resolvedOptions["data-astro-image-fit"] = resolvedOptions.fit;
     }
-    if (resolvedOptions.position) {
-      resolvedOptions["data-astro-image-pos"] = resolvedOptions.position.replace(/\s+/g, "-");
-    }
+    const currentPosition = resolvedOptions.position || "center";
+    resolvedOptions["data-astro-image-pos"] = currentPosition.replace(/\s+/g, "-");
   }
   const validatedOptions = service.validateOptions ? await service.validateOptions(resolvedOptions, imageConfig) : resolvedOptions;
+  validatedOptions.format ??= await peekRemoteFormatForStaticEmit(
+    validatedOptions,
+    imageConfig,
+    service
+  );
   const srcSetTransforms = service.getSrcSet ? await service.getSrcSet(validatedOptions, imageConfig) : [];
   const lazyImageURLFactory = (getValue) => {
     let cached = null;
@@ -188,6 +196,17 @@ async function getImage(options, imageConfig) {
     attributes: service.getHTMLAttributes !== void 0 ? await service.getHTMLAttributes(validatedOptions, imageConfig) : {}
   };
 }
+async function peekRemoteFormatForStaticEmit(options, imageConfig, service) {
+  if (!isRemoteImage(options.src) || !isRemoteAllowed(options.src, imageConfig) || !globalThis.astroAsset?.addStaticImage || !isLocalService(service) || !service.getRemoteSize) {
+    return void 0;
+  }
+  try {
+    const probed = await service.getRemoteSize(options.src, imageConfig);
+    return resolveDefaultOutputFormat(probed.format);
+  } catch {
+    return void 0;
+  }
+}
 export {
   cssFitValues,
   getConfiguredImageService,

package/dist/assets/services/service.d.ts

@@ -82,7 +82,7 @@ export type BaseServiceTransform = {
     src: string;
     width?: number;
     height?: number;
-    format: string;
+    format?: string;
     quality?: string | null;
     fit?: ImageFit;
     position?: string;

package/dist/assets/services/service.js

@@ -1,8 +1,9 @@
 import { isRemoteAllowed } from "@astrojs/internal-helpers/remote";
 import { AstroError, AstroErrorData } from "../../core/errors/index.js";
 import { isRemotePath, joinPaths } from "../../core/path.js";
-import { DEFAULT_HASH_PROPS, DEFAULT_OUTPUT_FORMAT, VALID_SUPPORTED_FORMATS } from "../consts.js";
+import { DEFAULT_HASH_PROPS, VALID_SUPPORTED_FORMATS } from "../consts.js";
 import { isESMImportedImage, isRemoteImage } from "../utils/imageKind.js";
+import { inferSourceFormat, resolveDefaultOutputFormat } from "../utils/inferSourceFormat.js";
 import { inferRemoteSize } from "../utils/remoteProbe.js";
 function isLocalService(service) {
   if (!service) {
@@ -74,10 +75,11 @@ const baseService = {
   validateOptions(options) {
     verifyOptions(options);
     if (!options.format) {
-      if (isESMImportedImage(options.src) && options.src.format === "svg") {
-        options.format = "svg";
+      if (isESMImportedImage(options.src)) {
+        options.format = resolveDefaultOutputFormat(options.src.format);
       } else {
-        options.format = DEFAULT_OUTPUT_FORMAT;
+        const inferred = inferSourceFormat(options.src);
+        if (inferred) options.format = resolveDefaultOutputFormat(inferred);
       }
     }
     if (options.width) options.width = Math.round(options.width);
@@ -120,7 +122,7 @@ const baseService = {
     const { targetWidth, targetHeight } = getTargetDimensions(options);
     const aspectRatio = targetWidth / targetHeight;
     const { widths, densities } = options;
-    const targetFormat = options.format ?? DEFAULT_OUTPUT_FORMAT;
+    const targetFormat = options.format;
     let transformedWidths = (widths ?? []).sort(sortNumeric);
     let imageWidth = options.width;
     let maxWidth = Number.POSITIVE_INFINITY;
@@ -164,9 +166,7 @@ const baseService = {
       return {
         transform,
         descriptor,
-        attributes: {
-          type: `image/${targetFormat}`
-        }
+        attributes: targetFormat ? { type: `image/${targetFormat}` } : {}
       };
     });
   },
@@ -210,7 +210,7 @@ const baseService = {
       src: params.get("href"),
       width: params.has("w") ? Number.parseInt(params.get("w")) : void 0,
       height: params.has("h") ? Number.parseInt(params.get("h")) : void 0,
-      format: params.get("f"),
+      format: params.has("f") ? params.get("f") : void 0,
       quality: params.get("q"),
       fit: params.get("fit"),
       position: params.get("position") ?? void 0,