Merge branch 'next' into arpan-withastro#12252-mdx-islands

.changeset/blue-socks-doubt.md

@@ -0,0 +1,30 @@
+---
+'astro': minor
+---
+
+Adds experimental support for built-in SVG components.
+
+
+This feature allows you to import SVG files directly into your Astro project as components. By default, Astro will inline the SVG content into your HTML output.
+
+To enable this feature, set `experimental.svg` to `true` in your Astro config:
+
+```js
+{
+  experimental: {
+    svg: true,
+  },
+}
+```
+
+To use this feature, import an SVG file in your Astro project, passing any common SVG attributes to the imported component. Astro also provides a `size` attribute to set equal `height` and `width` properties:
+
+```astro
+---
+import Logo from './path/to/svg/file.svg';
+---
+
+<Logo size={24} />
+```
+
+For a complete overview, and to give feedback on this experimental API, see the [Feature RFC](https://github.com/withastro/roadmap/pull/1035).

.changeset/bright-keys-sell.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fixes a bug where content config was ignored if it was outside of content dir and has a parent dir with an underscore

.changeset/eight-seahorses-attend.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Handle multiple root nodes on SVG files

.changeset/giant-ravens-look.md

@@ -0,0 +1,50 @@
+---
+'astro': minor
+---
+
+Adds a new `astro:routes:resolved` hook to the Integration API. Also update the `astro:build:done` hook by deprecating `routes` and adding a new `assets` map.
+
+When building an integration, you can now get access to routes inside the `astro:routes:resolved` hook:
+
+```js
+const integration = () => {
+    return {
+        name: 'my-integration',
+        hooks: {
+            'astro:routes:resolved': ({ routes }) => {
+                console.log(routes)
+            }
+        }
+    }
+}
+```
+
+This hook runs before `astro:config:done`, and whenever a route changes in development.
+
+The `routes` array from `astro:build:done` is now deprecated, and exposed properties are now available on `astro:routes:resolved`, except for `distURL`. For this, you can use the newly exposed `assets` map:
+
+```diff
+const integration = () => {
++    let routes
+    return {
+        name: 'my-integration',
+        hooks: {
++            'astro:routes:resolved': (params) => {
++                routes = params.routes
++            },
+            'astro:build:done': ({
+-                routes
++                assets
+            }) => {
++                for (const route of routes) {
++                    const distURL = assets.get(route.pattern)
++                    if (distURL) {
++                        Object.assign(route, { distURL })
++                    }
++                }
+                console.log(routes)
+            }
+        }
+    }
+}
+```

.changeset/pre.json

@@ -34,12 +34,16 @@
     "afraid-apricots-buy",
     "blue-boats-relax",
     "blue-sloths-stare",
+    "blue-socks-doubt",
     "brave-elephants-fly",
     "breezy-colts-promise",
+    "bright-keys-sell",
+    "brown-bulldogs-share",
     "chatty-teachers-sit",
     "chilly-terms-know",
     "clean-camels-drive",
     "clean-donuts-walk",
+    "clean-moles-rest",
     "cold-bananas-hear",
     "cool-mangos-shop",
     "cuddly-shoes-press",
@@ -49,6 +53,7 @@
     "dry-worms-knock",
     "dull-moles-talk",
     "eight-days-sort",
+    "eight-seahorses-attend",
     "eighty-bags-cross",
     "eighty-boxes-applaud",
     "eighty-donkeys-fly",
@@ -61,6 +66,7 @@
     "funny-wolves-dream",
     "fuzzy-pugs-live",
     "gentle-scissors-bow",
+    "giant-ravens-look",
     "giant-rocks-thank",
     "gorgeous-foxes-divide",
     "healthy-ads-scream",
@@ -95,13 +101,17 @@
     "poor-seals-clap",
     "pretty-walls-camp",
     "proud-games-repair",
+    "proud-terms-swim",
     "quick-ads-exercise",
     "quick-onions-leave",
+    "red-paws-juggle",
+    "rotten-dodos-judge",
     "rotten-phones-scream",
     "selfish-cats-crash",
     "selfish-impalas-grin",
     "sharp-worms-sniff",
     "sixty-coins-worry",
+    "sixty-fishes-flow",
     "sixty-oranges-walk",
     "slimy-mice-dance",
     "slimy-queens-hang",
@@ -116,14 +126,17 @@
     "tame-rats-cross",
     "ten-students-repair",
     "ten-walls-tap",
+    "thirty-clocks-jump",
     "three-days-cough",
     "three-olives-reflect",
     "tough-planets-dress",
     "twelve-comics-march",
     "twenty-cobras-push",
     "unlucky-bobcats-sit",
+    "unlucky-kids-compete",
     "violet-goats-grab",
     "wet-foxes-walk",
-    "wise-carrots-float"
+    "wise-carrots-float",
+    "young-terms-hammer"
   ]
 }

.changeset/proud-terms-swim.md

@@ -1,5 +1,90 @@
 ---
-'astro': patch
+'astro': minor
 ---
 
-Adds experimental reponsive image support
+Adds experimental support for automatic responsive images
+
+This feature is experimental and may change in future versions. To enable it, set `experimental.responsiveImages` to `true` in your `astro.config.mjs` file.
+
+ ```js title=astro.config.mjs
+ {
+    experimental: {
+       responsiveImages: true,
+    },
+ }
+ ```
+
+ When this flag is enabled, you can pass a `layout` prop to any `<Image />` or `<Picture />` component to create a responsive image. When a layout is set, images have automatically generated `srcset` and `sizes` attributes based on the image's dimensions and the layout type. Images with `responsive` and `full-width` layouts will have styles applied to ensure they resize according to their container.
+
+ ```astro
+ ---
+ import { Image, Picture } from 'astro:assets';
+ import myImage from '../assets/my_image.png';
+ ---
+ <Image src={myImage} alt="A description of my image." layout='responsive' width={800} height={600} />
+ <Picture src={myImage} alt="A description of my image." layout='full-width' formats={['avif', 'webp', 'jpeg']} />
+ ```
+ This `<Image />` component will generate the following HTML output:
+ ```html title=Output
+
+   <img
+    src="/_astro/my_image.hash3.webp"
+    srcset="/_astro/my_image.hash1.webp 640w,
+            /_astro/my_image.hash2.webp 750w,
+            /_astro/my_image.hash3.webp 800w,
+            /_astro/my_image.hash4.webp 828w,
+            /_astro/my_image.hash5.webp 1080w,
+            /_astro/my_image.hash6.webp 1280w,
+            /_astro/my_image.hash7.webp 1600w"
+    alt="A description of my image"
+    sizes="(min-width: 800px) 800px, 100vw"
+    loading="lazy"
+    decoding="async"
+    fetchpriority="auto"
+    width="800"
+    height="600"
+    style="--w: 800; --h: 600; --fit: cover; --pos: center;"
+    data-astro-image="responsive"
+  >
+ ```
+
+ #### Responsive image properties
+
+ These are additional properties available to the `<Image />` and `<Picture />` components when responsive images are enabled:
+
+ - `layout`: The layout type for the image. Can be `responsive`, `fixed`, `full-width` or `none`. Defaults to value of `image.experimentalLayout`.
+ - `fit`: Defines how the image should be cropped if the aspect ratio is changed. Values match those of CSS `object-fit`. Defaults to `cover`, or the value of `image.experimentalObjectFit` if set.
+ - `position`: Defines the position of the image crop if the aspect ratio is changed. Values match those of CSS `object-position`. Defaults to `center`, or the value of `image.experimentalObjectPosition` if set.
+ - `priority`: If set, eagerly loads the image. Otherwise images will be lazy-loaded. Use this for your largest above-the-fold image. Defaults to `false`.
+
+#### Default responsive image settings
+
+ You can enable responsive images for all `<Image />` and `<Picture />` components by setting `image.experimentalLayout` with a default value. This can be overridden by the `layout` prop on each component.
+
+ **Example:**
+ ```js title=astro.config.mjs
+ {
+     image: {
+       // Used for all `<Image />` and `<Picture />` components unless overridden
+       experimentalLayout: 'responsive',
+     },
+     experimental: {
+       responsiveImages: true,
+     },
+ }
+ ```
+
+ ```astro
+ ---
+ import { Image } from 'astro:assets';
+ import myImage from '../assets/my_image.png';
+ ---
+
+ <Image src={myImage} alt="This will use responsive layout" width={800} height={600} />
+
+ <Image src={myImage} alt="This will use full-width layout" layout="full-width" />
+
+ <Image src={myImage} alt="This will disable responsive images" layout="none" />
+ ```
+
+For a complete overview, and to give feedback on this experimental API, see the [Responsive Images RFC](https://github.com/withastro/roadmap/blob/responsive-images/proposals/0053-responsive-images.md).

.changeset/red-paws-juggle.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Fix SVG Component sprite references

.changeset/rotten-dodos-judge.md

@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Call server island early so it can set headers

.changeset/sixty-fishes-flow.md

@@ -0,0 +1,6 @@
+---
+'@astrojs/react': minor
+'astro': minor
+---
+
+Changes the generated URL query param from `_astroAction` to `_action` when submitting a form using Actions. This avoids leaking the framework name into the URL bar, which may be considered a security issue.

.changeset/thirty-clocks-jump.md

@@ -0,0 +1,7 @@
+---
+'astro': minor
+---
+
+Changes the default content config location from `src/content/config.*` to `src/content.config.*`.
+
+The previous location is still supported, and is required if the `legacy.collections` flag is enabled.

.changeset/young-terms-hammer.md

@@ -0,0 +1,5 @@
+---
+'@astrojs/mdx': patch
+---
+
+Fixes a case where the MDX renderer couldn't be loaded when used as a direct dependency of an Astro integration.

.github/scripts/announce.mjs

@@ -1,6 +1,6 @@
-import { globby as glob } from 'globby';
-import { fileURLToPath } from 'node:url';
 import { readFile } from 'node:fs/promises';
+import { fileURLToPath } from 'node:url';
+import { globby as glob } from 'globby';
 import { setOutput } from './utils.mjs';
 
 const { GITHUB_REF = 'main' } = process.env;
@@ -18,34 +18,34 @@ const descriptors = [
 	'updates',
 ];
 const verbs = [
-	"just went out!",
-	"just launched!",
-	"now available!",
-	"in the wild!",
-	"now live!",
-	"hit the registry!",
-	"to share!",
-	"for you!",
-	"for y’all! 🤠",
-	"comin’ your way!",
-	"comin’ atcha!",
-	"comin’ in hot!",
-	"freshly minted on the blockchain! (jk)",
-	"[is] out (now with 100% more reticulated splines!)",
-	"(as seen on TV!)",
-	"just dropped!",
-	"– artisanally hand-crafted just for you.",
-	"– oh happy day!",
-	"– enjoy!",
-	"now out. Be the first on your block to download!",
-	"made with love 💕",
-	"[is] out! Our best [version] yet!",
-	"[is] here. DOWNLOAD! DOWNLOAD! DOWNLOAD!",
-	"... HUZZAH!",
-	"[has] landed!",
-	"landed! The internet just got a little more fun.",
-	"– from our family to yours.",
-	"– go forth and build!"
+	'just went out!',
+	'just launched!',
+	'now available!',
+	'in the wild!',
+	'now live!',
+	'hit the registry!',
+	'to share!',
+	'for you!',
+	'for y’all! 🤠',
+	'comin’ your way!',
+	'comin’ atcha!',
+	'comin’ in hot!',
+	'freshly minted on the blockchain! (jk)',
+	'[is] out (now with 100% more reticulated splines!)',
+	'(as seen on TV!)',
+	'just dropped!',
+	'– artisanally hand-crafted just for you.',
+	'– oh happy day!',
+	'– enjoy!',
+	'now out. Be the first on your block to download!',
+	'made with love 💕',
+	'[is] out! Our best [version] yet!',
+	'[is] here. DOWNLOAD! DOWNLOAD! DOWNLOAD!',
+	'... HUZZAH!',
+	'[has] landed!',
+	'landed! The internet just got a little more fun.',
+	'– from our family to yours.',
+	'– go forth and build!',
 ];
 const extraVerbs = [
 	'new',
@@ -72,7 +72,7 @@ const plurals = new Map([
 
 function pluralize(text) {
 	return text.replace(/(\[([^\]]+)\])/gm, (_, _full, match) =>
-		plurals.has(match) ? plurals.get(match) : `${match}s`
+		plurals.has(match) ? plurals.get(match) : `${match}s`,
 	);
 }
 
@@ -91,7 +91,7 @@ async function generatePackageMap() {
 			const pkgFile = fileURLToPath(new URL(pkg, packageRoot));
 			const content = await readFile(pkgFile).then((res) => JSON.parse(res.toString()));
 			packageMap.set(content.name, `./packages/${pkg.replace('/package.json', '')}`);
-		})
+		}),
 	);
 }
 
@@ -110,7 +110,7 @@ async function generateMessage() {
 				version,
 				url: new URL(`${p}/CHANGELOG.md#${version.replace(/\./g, '')}`, baseUrl).toString(),
 			};
-		})
+		}),
 	);
 
 	const emoji = item(emojis);
@@ -122,7 +122,7 @@ async function generateMessage() {
 	if (packages.length === 1) {
 		const { name, version, url } = packages[0];
 		message += `${emoji} \`${name}@${version}\` ${singularlize(
-			verb
+			verb,
 		)}\nRead the [release notes →](<${url}>)\n`;
 	} else {
 		message += `${emoji} Some ${descriptor} ${pluralize(verb)}\n\n`;