From 4f5dc14f315eba7ea6ec5cc8e5dacb0cb81288dd Mon Sep 17 00:00:00 2001
From: Oliver Speir <115520730+OliverSpeir@users.noreply.github.com>
Date: Tue, 2 Apr 2024 14:24:02 -0600
Subject: [PATCH] Move format option from LocalImageProps to ImageSharedProps
 (#10642)

* move format to ImageSharedProps

* add changeset

* move quality to shared

* Update lovely-trees-wait.md

Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>

---------

Co-authored-by: Florian Lefebvre <contact@florian-lefebvre.dev>
---
 .changeset/lovely-trees-wait.md    |  5 ++++
 packages/astro/src/assets/types.ts | 44 +++++++++++++++---------------
 2 files changed, 27 insertions(+), 22 deletions(-)
 create mode 100644 .changeset/lovely-trees-wait.md

diff --git a/.changeset/lovely-trees-wait.md b/.changeset/lovely-trees-wait.md
new file mode 100644
index 000000000000..2a7511d8a066
--- /dev/null
+++ b/.changeset/lovely-trees-wait.md
@@ -0,0 +1,5 @@
+---
+"astro": patch
+---
+
+Fixes typing issues when using `format` and `quality` options with remote images
diff --git a/packages/astro/src/assets/types.ts b/packages/astro/src/assets/types.ts
index 29cf1ef9ee8a..89610b05b05c 100644
--- a/packages/astro/src/assets/types.ts
+++ b/packages/astro/src/assets/types.ts
@@ -118,6 +118,28 @@ type ImageSharedProps<T> = T & {
 	 * ```
 	 */
 	height?: number | `${number}`;
+	/**
+	 * Desired output format for the image. Defaults to `webp`.
+	 *
+	 * **Example**:
+	 * ```astro
+	 * <Image src={...} format="avif" alt="..." />
+	 * ```
+	 */
+	format?: ImageOutputFormat;
+	/**
+	 * Desired quality for the image. Value can either be a preset such as `low` or `high`, or a numeric value from 0 to 100.
+	 *
+	 * The perceptual quality of the output image is service-specific.
+	 * For instance, a certain service might decide that `high` results in a very beautiful image, but another could choose for it to be at best passable.
+	 *
+	 * **Example**:
+	 * ```astro
+	 * <Image src={...} quality='high' alt="..." />
+	 * <Image src={...} quality={300} alt="..." />
+	 * ```
+	 */
+	quality?: ImageQuality;
 } & (
 		| {
 				/**
@@ -153,28 +175,6 @@ export type LocalImageProps<T> = ImageSharedProps<T> & {
 	 * ```
 	 */
 	src: ImageMetadata | Promise<{ default: ImageMetadata }>;
-	/**
-	 * Desired output format for the image. Defaults to `webp`.
-	 *
-	 * **Example**:
-	 * ```astro
-	 * <Image src={...} format="avif" alt="..." />
-	 * ```
-	 */
-	format?: ImageOutputFormat;
-	/**
-	 * Desired quality for the image. Value can either be a preset such as `low` or `high`, or a numeric value from 0 to 100.
-	 *
-	 * The perceptual quality of the output image is service-specific.
-	 * For instance, a certain service might decide that `high` results in a very beautiful image, but another could choose for it to be at best passable.
-	 *
-	 * **Example**:
-	 * ```astro
-	 * <Image src={...} quality='high' alt="..." />
-	 * <Image src={...} quality={300} alt="..." />
-	 * ```
-	 */
-	quality?: ImageQuality;
 };
 
 export type RemoteImageProps<T> =