Merge branch 'main' into add-Minification

.changeset/chatty-dolls-visit.md

@@ -1,5 +0,0 @@
----
-'@astrojs/sitemap': minor
----
-
-Adds support to SSR routes to sitemap generation.

.changeset/friendly-fishes-sing.md

@@ -1,5 +0,0 @@
----
-'astro': minor
----
-
-Implement Inline Stylesheets RFC as experimental

.changeset/green-cups-hammer.md

@@ -1,21 +0,0 @@
----
-'astro': minor
----
-
-Implements a new class-based scoping strategy
-
-This implements the [Scoping RFC](https://github.com/withastro/roadmap/pull/543), providing a way to opt in to increased style specificity for Astro component styles.
-
-This prevents bugs where global styles override Astro component styles due to CSS ordering and the use of element selectors.
-
-To enable class-based scoping, you can set it in your config:
-
-```js
-import { defineConfig } from 'astro/config';
-
-export default defineConfig({
-  scopedStyleStrategy: 'class'
-});
-```
-
-Note that the 0-specificity `:where` pseudo-selector is still the default strategy. The intent is to change `'class'` to be the default in 3.0.

.changeset/nine-geckos-act.md

@@ -1,5 +0,0 @@
----
-'astro': minor
----
-
-Support `<Code inline />` to output inline code HTML (no `pre` tag)

.changeset/pretty-bears-deliver.md

@@ -1,5 +0,0 @@
----
-'astro': minor
----
-
-New middleware API

.changeset/smooth-cows-jog.md

@@ -1,8 +0,0 @@
----
-'@astrojs/markdoc': patch
-'@astrojs/mdx': patch
-'@astrojs/markdown-remark': minor
-'astro': minor
----
-
-Upgrade shiki to v0.14.1. This updates the shiki theme colors and adds the theme name to the `pre` tag, e.g. `<pre class="astro-code github-dark">`.

.changeset/twelve-feet-switch.md

@@ -1,5 +0,0 @@
----
-'astro': patch
----
-
-Ensure multiple cookies set in dev result in multiple set-cookie headers

packages/astro/CHANGELOG.md

@@ -1,5 +1,92 @@
 # astro
 
+## 2.4.1
+
+### Patch Changes
+
+- [#6995](https://github.com/withastro/astro/pull/6995) [`71332cf96`](https://github.com/withastro/astro/commit/71332cf9697755884e5e2e63d6d2499cc2c5edd1) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Move sharpImageService and squooshImageService functions to `astro/config` so they can be imported
+
+## 2.4.0
+
+### Minor Changes
+
+- [#6990](https://github.com/withastro/astro/pull/6990) [`818252acd`](https://github.com/withastro/astro/commit/818252acda3c00499cea51ffa0f26d4c2ccd3a02) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Generated optimized images are now cached inside the `node_modules/.astro/assets` folder. The cached images will be used to avoid doing extra work and speed up subsequent builds.
+
+- [#6659](https://github.com/withastro/astro/pull/6659) [`80e3d4d3d`](https://github.com/withastro/astro/commit/80e3d4d3d0f7719d8eae5435bba3805503057511) Thanks [@lilnasy](https://github.com/lilnasy)! - Implement Inline Stylesheets RFC as experimental
+
+- [#6771](https://github.com/withastro/astro/pull/6771) [`3326492b9`](https://github.com/withastro/astro/commit/3326492b94f76ed2b0154dd9b9a1a9eb883c1e31) Thanks [@matthewp](https://github.com/matthewp)! - Implements a new class-based scoping strategy
+
+  This implements the [Scoping RFC](https://github.com/withastro/roadmap/pull/543), providing a way to opt in to increased style specificity for Astro component styles.
+
+  This prevents bugs where global styles override Astro component styles due to CSS ordering and the use of element selectors.
+
+  To enable class-based scoping, you can set it in your config:
+
+  ```js
+  import { defineConfig } from 'astro/config';
+
+  export default defineConfig({
+    scopedStyleStrategy: 'class',
+  });
+  ```
+
+  Note that the 0-specificity `:where` pseudo-selector is still the default strategy. The intent is to change `'class'` to be the default in 3.0.
+
+- [#6959](https://github.com/withastro/astro/pull/6959) [`cac4a321e`](https://github.com/withastro/astro/commit/cac4a321e814fb805eb0e3ced469e25261a50885) Thanks [@bluwy](https://github.com/bluwy)! - Support `<Code inline />` to output inline code HTML (no `pre` tag)
+
+- [#6721](https://github.com/withastro/astro/pull/6721) [`831b67cdb`](https://github.com/withastro/astro/commit/831b67cdb8250f93f66e3b171fab024652bf80f2) Thanks [@ematipico](https://github.com/ematipico)! - Implements a new experimental middleware in Astro.
+
+  The middleware is available under the following experimental flag:
+
+  ```js
+  export default defineConfig({
+    experimental: {
+      middleware: true,
+    },
+  });
+  ```
+
+  Or via CLI, using the new argument `--experimental-middleware`.
+
+  Create a file called `middleware.{js,ts}` inside the `src` folder, and
+  export a `onRequest` function.
+
+  From `astro/middleware`, use the `defineMiddleware` utility to take advantage of type-safety, and use
+  the `sequence` utility to chain multiple middleware functions.
+
+  Example:
+
+  ```ts
+  import { defineMiddleware, sequence } from 'astro/middleware';
+
+  const redirects = defineMiddleware((context, next) => {
+    if (context.request.url.endsWith('/old-url')) {
+      return context.redirect('/new-url');
+    }
+    return next();
+  });
+
+  const minify = defineMiddleware(async (context, next) => {
+    const repsonse = await next();
+    const minifiedHtml = await minifyHtml(response.text());
+    return new Response(minifiedHtml, {
+      status: 200,
+      headers: response.headers,
+    });
+  });
+
+  export const onRequest = sequence(redirects, minify);
+  ```
+
+- [#6932](https://github.com/withastro/astro/pull/6932) [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7) Thanks [@bluwy](https://github.com/bluwy)! - Upgrade shiki to v0.14.1. This updates the shiki theme colors and adds the theme name to the `pre` tag, e.g. `<pre class="astro-code github-dark">`.
+
+### Patch Changes
+
+- [#6973](https://github.com/withastro/astro/pull/6973) [`0883fd487`](https://github.com/withastro/astro/commit/0883fd4875548a613df122f0b87a1ca8b7a7cf7d) Thanks [@matthewp](https://github.com/matthewp)! - Ensure multiple cookies set in dev result in multiple set-cookie headers
+
+- Updated dependencies [[`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7)]:
+  - @astrojs/markdown-remark@2.2.0
+
 ## 2.3.4
 
 ### Patch Changes

packages/astro/config.d.ts

@@ -1,6 +1,7 @@
 type ViteUserConfig = import('vite').UserConfig;
 type ViteUserConfigFn = import('vite').UserConfigFn;
 type AstroUserConfig = import('./dist/@types/astro.js').AstroUserConfig;
+type ImageServiceConfig = import('./dist/@types/astro.js').ImageServiceConfig;
 
 /**
  * See the full Astro Configuration API Documentation
@@ -12,3 +13,14 @@ export function defineConfig(config: AstroUserConfig): AstroUserConfig;
  * Use Astro to generate a fully resolved Vite config
  */
 export function getViteConfig(config: ViteUserConfig): ViteUserConfigFn;
+
+/**
+ * Return the configuration needed to use the Sharp-based image service
+ * See: https://docs.astro.build/en/guides/assets/#using-sharp
+ */
+export function sharpImageService(): ImageServiceConfig;
+
+/**
+ * Return the configuration needed to use the Squoosh-based image service
+ */
+export function squooshImageService(): ImageServiceConfig;

packages/astro/config.mjs

@@ -1 +1,15 @@
 export { defineConfig, getViteConfig } from './dist/config/index.js';
+
+export function sharpImageService() {
+	return {
+		entrypoint: 'astro/assets/services/sharp',
+		config: {},
+	};
+}
+
+export function squooshImageService() {
+	return {
+		entrypoint: 'astro/assets/services/squoosh',
+		config: {},
+	};
+}

packages/astro/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro",
-  "version": "2.3.4",
+  "version": "2.4.1",
   "description": "Astro is a modern site builder with web best practices, performance, and DX front-of-mind.",
   "type": "module",
   "author": "withastro",
@@ -112,7 +112,7 @@
   "dependencies": {
     "@astrojs/compiler": "^1.4.0",
     "@astrojs/language-server": "^1.0.0",
-    "@astrojs/markdown-remark": "^2.1.4",
+    "@astrojs/markdown-remark": "^2.2.0",
     "@astrojs/telemetry": "^2.1.1",
     "@astrojs/webapi": "^2.1.1",
     "@babel/core": "^7.18.2",

packages/astro/src/@types/astro.ts

@@ -430,6 +430,23 @@ export interface AstroUserConfig {
 	 */
 	outDir?: string;
 
+	/**
+	 * @docs
+	 * @name cacheDir
+	 * @type {string}
+	 * @default `"./node_modules/.astro"`
+	 * @description Set the directory for caching build artifacts. Files in this directory will be used in subsequent builds to speed up the build time.
+	 *
+	 * The value can be either an absolute file system path or a path relative to the project root.
+	 *
+	 * ```js
+	 * {
+	 *   cacheDir: './my-custom-cache-directory'
+	 * }
+	 * ```
+	 */
+	cacheDir?: string;
+
 	/**
 	 * @docs
 	 * @name site
@@ -518,8 +535,8 @@ export interface AstroUserConfig {
 	 * @name scopedStyleStrategy
 	 * @type {('where' | 'class')}
 	 * @default `'where'`
-	 * @description
 	 * @version 2.4
+	 * @description
 	 *
 	 * Specify the strategy used for scoping styles within Astro components. Choose from:
 	 *   - `'where'` - Use `:where` selectors, causing no specifity increase.
@@ -1051,6 +1068,7 @@ export interface AstroUserConfig {
 		 *		assets: true,
 		 * 	},
 		 * }
+		 * ```
 		 */
 		assets?: boolean;
 
@@ -1060,8 +1078,8 @@ export interface AstroUserConfig {
 		 * @type {('always' | 'auto' | 'never')}
 		 * @default `never`
 		 * @description
-		 * Control whether styles are sent to the browser in a separate css file or inlined into <style> tags. Choose from the following options:
-		 *  - `'always'` - all styles are inlined into <style> tags
+		 * Control whether styles are sent to the browser in a separate css file or inlined into `<style>` tags. Choose from the following options:
+		 *  - `'always'` - all styles are inlined into `<style>` tags
 		 *  - `'auto'` - only stylesheets smaller than `ViteConfig.build.assetsInlineLimit` (default: 4kb) are inlined. Otherwise, styles are sent in external stylesheets.
 		 *  - `'never'` - all styles are sent in external stylesheets
 		 *
@@ -1071,6 +1089,7 @@ export interface AstroUserConfig {
 		 *		inlineStylesheets: `auto`,
 		 * 	},
 		 * }
+		 * ```
 		 */
 		inlineStylesheets?: 'always' | 'auto' | 'never';
 
@@ -1091,6 +1110,7 @@ export interface AstroUserConfig {
 		 *		middleware: true,
 		 * 	},
 		 * }
+		 * ```
 		 */
 		middleware?: boolean;
 	};

packages/astro/src/assets/index.ts

@@ -1,21 +1,5 @@
-import type { ImageServiceConfig } from '../@types/astro.js';
-
 export { getConfiguredImageService, getImage } from './internal.js';
 export { baseService, isLocalService } from './services/service.js';
 export { type LocalImageProps, type RemoteImageProps } from './types.js';
 export { emitESMImage } from './utils/emitAsset.js';
 export { imageMetadata } from './utils/metadata.js';
-
-export function sharpImageService(): ImageServiceConfig {
-	return {
-		entrypoint: 'astro/assets/services/sharp',
-		config: {},
-	};
-}
-
-export function squooshImageService(): ImageServiceConfig {
-	return {
-		entrypoint: 'astro/assets/services/squoosh',
-		config: {},
-	};
-}

packages/astro/src/assets/internal.ts

@@ -73,13 +73,20 @@ export function getStaticImageList(): Iterable<
 	return globalThis.astroAsset.staticImages?.entries();
 }
 
-interface GenerationData {
+interface GenerationDataUncached {
+	cached: false;
 	weight: {
 		before: number;
 		after: number;
 	};
 }
 
+interface GenerationDataCached {
+	cached: true;
+}
+
+type GenerationData = GenerationDataUncached | GenerationDataCached;
+
 export async function generateImage(
 	buildOpts: StaticBuildOptions,
 	options: ImageTransform,
@@ -89,7 +96,19 @@ export async function generateImage(
 		return undefined;
 	}
 
-	const imageService = (await getConfiguredImageService()) as LocalImageService;
+	let useCache = true;
+	const assetsCacheDir = new URL('assets/', buildOpts.settings.config.cacheDir);
+
+	// Ensure that the cache directory exists
+	try {
+		await fs.promises.mkdir(assetsCacheDir, { recursive: true });
+	} catch (err) {
+		console.error(
+			'An error was encountered while creating the cache directory. Proceeding without caching. Error: ',
+			err
+		);
+		useCache = false;
+	}
 
 	let serverRoot: URL, clientRoot: URL;
 	if (buildOpts.settings.config.output === 'server') {
@@ -100,6 +119,20 @@ export async function generateImage(
 		clientRoot = buildOpts.settings.config.outDir;
 	}
 
+	const finalFileURL = new URL('.' + filepath, clientRoot);
+	const finalFolderURL = new URL('./', finalFileURL);
+	const cachedFileURL = new URL(basename(filepath), assetsCacheDir);
+
+	try {
+		await fs.promises.copyFile(cachedFileURL, finalFileURL);
+
+		return {
+			cached: true,
+		};
+	} catch (e) {
+		// no-op
+	}
+
 	// The original file's path (the `src` attribute of the ESM imported image passed by the user)
 	const originalImagePath = options.src.src;
 
@@ -112,19 +145,33 @@ export async function generateImage(
 			serverRoot
 		)
 	);
+
+	const imageService = (await getConfiguredImageService()) as LocalImageService;
 	const resultData = await imageService.transform(
 		fileData,
 		{ ...options, src: originalImagePath },
 		buildOpts.settings.config.image.service.config
 	);
 
-	const finalFileURL = new URL('.' + filepath, clientRoot);
-	const finalFolderURL = new URL('./', finalFileURL);
-
 	await fs.promises.mkdir(finalFolderURL, { recursive: true });
-	await fs.promises.writeFile(finalFileURL, resultData.data);
+
+	if (useCache) {
+		try {
+			await fs.promises.writeFile(cachedFileURL, resultData.data);
+			await fs.promises.copyFile(cachedFileURL, finalFileURL);
+		} catch (e) {
+			console.error(
+				`There was an error creating the cache entry for ${filepath}. Attempting to write directly to output directory. Error: `,
+				e
+			);
+			await fs.promises.writeFile(finalFileURL, resultData.data);
+		}
+	} else {
+		await fs.promises.writeFile(finalFileURL, resultData.data);
+	}
 
 	return {
+		cached: false,
 		weight: {
 			before: Math.trunc(fileData.byteLength / 1024),
 			after: Math.trunc(resultData.data.byteLength / 1024),

packages/astro/src/core/build/generate.ts

@@ -146,13 +146,10 @@ async function generateImage(opts: StaticBuildOptions, transform: ImageTransform
 	const timeEnd = performance.now();
 	const timeChange = getTimeStat(timeStart, timeEnd);
 	const timeIncrease = `(+${timeChange})`;
-	info(
-		opts.logging,
-		null,
-		`  ${green('▶')} ${path} ${dim(
-			`(before: ${generationData.weight.before}kb, after: ${generationData.weight.after}kb)`
-		)} ${dim(timeIncrease)}`
-	);
+	const statsText = generationData.cached
+		? `(reused cache entry)`
+		: `(before: ${generationData.weight.before}kb, after: ${generationData.weight.after}kb)`;
+	info(opts.logging, null, `  ${green('▶')} ${path} ${dim(statsText)} ${dim(timeIncrease)}`);
 }
 
 async function generatePage(

packages/astro/src/core/config/schema.ts

@@ -13,6 +13,7 @@ const ASTRO_CONFIG_DEFAULTS: AstroUserConfig & any = {
 	srcDir: './src',
 	publicDir: './public',
 	outDir: './dist',
+	cacheDir: './node_modules/.astro',
 	base: '/',
 	trailingSlash: 'ignore',
 	build: {
@@ -64,6 +65,11 @@ export const AstroConfigSchema = z.object({
 		.optional()
 		.default(ASTRO_CONFIG_DEFAULTS.outDir)
 		.transform((val) => new URL(val)),
+	cacheDir: z
+		.string()
+		.optional()
+		.default(ASTRO_CONFIG_DEFAULTS.cacheDir)
+		.transform((val) => new URL(val)),
 	site: z.string().url().optional(),
 	compressHTML: z.boolean().optional().default(ASTRO_CONFIG_DEFAULTS.compressHTML),
 	base: z.string().optional().default(ASTRO_CONFIG_DEFAULTS.base),
@@ -226,6 +232,10 @@ export function createRelativeSchema(cmd: string, fileProtocolRoot: URL) {
 			.string()
 			.default(ASTRO_CONFIG_DEFAULTS.outDir)
 			.transform((val) => new URL(appendForwardSlash(val), fileProtocolRoot)),
+		cacheDir: z
+			.string()
+			.default(ASTRO_CONFIG_DEFAULTS.cacheDir)
+			.transform((val) => new URL(appendForwardSlash(val), fileProtocolRoot)),
 		build: z
 			.object({
 				format: z

packages/astro/test/core-image.test.js

@@ -1,7 +1,9 @@
 import { expect } from 'chai';
 import * as cheerio from 'cheerio';
+import { basename } from 'node:path';
 import { Writable } from 'node:stream';
 import { fileURLToPath } from 'node:url';
+import { removeDir } from '../dist/core/fs/index.js';
 import testAdapter from './test-adapter.js';
 import { loadFixture } from './test-utils.js';
 
@@ -455,6 +457,9 @@ describe('astro:image', () => {
 					assets: true,
 				},
 			});
+			// Remove cache directory
+			removeDir(new URL('./fixtures/core-image-ssg/node_modules/.astro', import.meta.url));
+
 			await fixture.build();
 		});
 
@@ -569,6 +574,39 @@ describe('astro:image', () => {
 			const $ = cheerio.load(html);
 			expect($('#no-format img').attr('src')).to.not.equal($('#format-avif img').attr('src'));
 		});
+
+		it('has cache entries', async () => {
+			const generatedImages = (await fixture.glob('_astro/**/*.webp')).map((path) =>
+				basename(path)
+			);
+			const cachedImages = (await fixture.glob('../node_modules/.astro/assets/**/*.webp')).map(
+				(path) => basename(path)
+			);
+
+			expect(generatedImages).to.deep.equal(cachedImages);
+		});
+
+		it('uses cache entries', async () => {
+			const logs = [];
+			const logging = {
+				dest: {
+					write(chunk) {
+						logs.push(chunk);
+					},
+				},
+			};
+
+			await fixture.build({ logging });
+			const generatingImageIndex = logs.findIndex((logLine) =>
+				logLine.message.includes('generating optimized images')
+			);
+			const relevantLogs = logs.slice(generatingImageIndex + 1, -1);
+			const isReusingCache = relevantLogs.every((logLine) =>
+				logLine.message.includes('(reused cache entry)')
+			);
+
+			expect(isReusingCache).to.be.true;
+		});
 	});
 
 	describe('prod ssr', () => {

packages/astro/test/fixtures/react-component/src/components/WithId.jsx

@@ -0,0 +1,6 @@
+import React from 'react';
+
+export default function () {
+	const id = React.useId();
+  return <p className='react-use-id' id={id}>{id}</p>;
+}

packages/astro/test/fixtures/react-component/src/pages/index.astro

@@ -8,6 +8,7 @@ import Pure from '../components/Pure.jsx';
 import TypeScriptComponent from '../components/TypeScriptComponent';
 import CloneElement from '../components/CloneElement';
 import WithChildren from '../components/WithChildren';
+import WithId from '../components/WithId';
 
 const someProps = {
   text: 'Hello world!',
@@ -34,5 +35,7 @@ const someProps = {
 		<CloneElement />
 		<WithChildren client:load>test</WithChildren>
 		<WithChildren client:load children="test" />
+		<WithId client:idle />
+		<WithId client:idle />
   </body>
 </html>

packages/astro/test/react-component.test.js

@@ -42,16 +42,21 @@ describe('React Components', () => {
 			expect($('#pure')).to.have.lengthOf(1);
 
 			// test 8: Check number of islands
-			expect($('astro-island[uid]')).to.have.lengthOf(7);
+			expect($('astro-island[uid]')).to.have.lengthOf(9);
 
 			// test 9: Check island deduplication
 			const uniqueRootUIDs = new Set($('astro-island').map((i, el) => $(el).attr('uid')));
-			expect(uniqueRootUIDs.size).to.equal(6);
+			expect(uniqueRootUIDs.size).to.equal(8);
 
 			// test 10: Should properly render children passed as props
 			const islandsWithChildren = $('.with-children');
 			expect(islandsWithChildren).to.have.lengthOf(2);
 			expect($(islandsWithChildren[0]).html()).to.equal($(islandsWithChildren[1]).html());
+
+			// test 11: Should generate unique React.useId per island
+			const islandsWithId = $('.react-use-id');
+			expect(islandsWithId).to.have.lengthOf(2);
+			expect($(islandsWithId[0]).attr('id')).to.not.equal($(islandsWithId[1]).attr('id'));
 		});
 
 		it('Can load Vue', async () => {

packages/integrations/cloudflare/package.json

@@ -38,7 +38,7 @@
     "tiny-glob": "^0.2.9"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "astro": "workspace:*",

packages/integrations/deno/package.json

@@ -33,7 +33,7 @@
     "esbuild": "^0.15.18"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "astro": "workspace:*",

packages/integrations/image/package.json

@@ -62,7 +62,7 @@
     "vite": "^4.3.1"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4",
+    "astro": "workspace:^2.4.1",
     "sharp": ">=0.31.0"
   },
   "peerDependenciesMeta": {

packages/integrations/markdoc/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @astrojs/markdoc
 
+## 0.1.2
+
+### Patch Changes
+
+- [#6932](https://github.com/withastro/astro/pull/6932) [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7) Thanks [@bluwy](https://github.com/bluwy)! - Upgrade shiki to v0.14.1. This updates the shiki theme colors and adds the theme name to the `pre` tag, e.g. `<pre class="astro-code github-dark">`.
+
+- Updated dependencies [[`818252acd`](https://github.com/withastro/astro/commit/818252acda3c00499cea51ffa0f26d4c2ccd3a02), [`80e3d4d3d`](https://github.com/withastro/astro/commit/80e3d4d3d0f7719d8eae5435bba3805503057511), [`3326492b9`](https://github.com/withastro/astro/commit/3326492b94f76ed2b0154dd9b9a1a9eb883c1e31), [`cac4a321e`](https://github.com/withastro/astro/commit/cac4a321e814fb805eb0e3ced469e25261a50885), [`831b67cdb`](https://github.com/withastro/astro/commit/831b67cdb8250f93f66e3b171fab024652bf80f2), [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7), [`0883fd487`](https://github.com/withastro/astro/commit/0883fd4875548a613df122f0b87a1ca8b7a7cf7d)]:
+  - astro@2.4.0
+
 ## 0.1.1
 
 ### Patch Changes

packages/integrations/markdoc/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/markdoc",
   "description": "Add support for Markdoc pages in your Astro site",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",
@@ -41,7 +41,7 @@
     "zod": "^3.17.3"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "@types/chai": "^4.3.1",

packages/integrations/mdx/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @astrojs/mdx
 
+## 0.19.1
+
+### Patch Changes
+
+- [#6932](https://github.com/withastro/astro/pull/6932) [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7) Thanks [@bluwy](https://github.com/bluwy)! - Upgrade shiki to v0.14.1. This updates the shiki theme colors and adds the theme name to the `pre` tag, e.g. `<pre class="astro-code github-dark">`.
+
+- Updated dependencies [[`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7)]:
+  - @astrojs/markdown-remark@2.2.0
+
 ## 0.19.0
 
 ### Minor Changes

packages/integrations/mdx/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/mdx",
   "description": "Add support for MDX pages in your Astro site",
-  "version": "0.19.0",
+  "version": "0.19.1",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",
@@ -30,7 +30,7 @@
     "test:match": "mocha --timeout 20000 -g"
   },
   "dependencies": {
-    "@astrojs/markdown-remark": "^2.1.4",
+    "@astrojs/markdown-remark": "^2.2.0",
     "@astrojs/prism": "^2.1.1",
     "@mdx-js/mdx": "^2.3.0",
     "@mdx-js/rollup": "^2.3.0",

packages/integrations/netlify/package.json

@@ -39,7 +39,7 @@
     "esbuild": "^0.15.18"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "@netlify/edge-functions": "^2.0.0",

packages/integrations/node/package.json

@@ -35,7 +35,7 @@
     "server-destroy": "^1.0.1"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "@types/send": "^0.17.1",

packages/integrations/react/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @astrojs/react
 
+## 2.1.3
+
+### Patch Changes
+
+- [#6976](https://github.com/withastro/astro/pull/6976) [`ca329bbca`](https://github.com/withastro/astro/commit/ca329bbcae7a6075af4f428f6f64466e9d152c8f) Thanks [@SudoCat](https://github.com/SudoCat)! - Prevent ID collisions in React.useId
+
 ## 2.1.2
 
 ### Patch Changes

packages/integrations/react/client.js

@@ -13,6 +13,9 @@ function isAlreadyHydrated(element) {
 export default (element) =>
 	(Component, props, { default: children, ...slotted }, { client }) => {
 		if (!element.hasAttribute('ssr')) return;
+		const renderOptions = {
+			identifierPrefix: element.getAttribute('prefix'),
+		};
 		for (const [key, value] of Object.entries(slotted)) {
 			props[key] = createElement(StaticHtml, { value, name: key });
 		}
@@ -28,10 +31,10 @@ export default (element) =>
 		}
 		if (client === 'only') {
 			return startTransition(() => {
-				createRoot(element).render(componentEl);
+				createRoot(element, renderOptions).render(componentEl);
 			});
 		}
 		return startTransition(() => {
-			hydrateRoot(element, componentEl);
+			hydrateRoot(element, componentEl, renderOptions);
 		});
 	};

packages/integrations/react/context.js

@@ -0,0 +1,24 @@
+const contexts = new WeakMap();
+
+const ID_PREFIX = 'r';
+
+function getContext(rendererContextResult) {
+	if (contexts.has(rendererContextResult)) {
+		return contexts.get(rendererContextResult);
+	}
+	const ctx = {
+		currentIndex: 0,
+		get id() {
+			return ID_PREFIX + this.currentIndex.toString();
+		},
+	};
+	contexts.set(rendererContextResult, ctx);
+	return ctx;
+}
+
+export function incrementId(rendererContextResult) {
+	const ctx = getContext(rendererContextResult);
+	const id = ctx.id;
+	ctx.currentIndex++;
+	return id;
+}

packages/integrations/react/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/react",
   "description": "Use React components within Astro",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",

packages/integrations/react/server.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom/server';
 import StaticHtml from './static-html.js';
+import { incrementId } from './context.js';
 
 const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase());
 const reactTypeof = Symbol.for('react.element');
@@ -58,6 +59,12 @@ async function getNodeWritable() {
 }
 
 async function renderToStaticMarkup(Component, props, { default: children, ...slotted }, metadata) {
+	let prefix;
+	if (this && this.result) {
+		prefix = incrementId(this.result);
+	}
+	const attrs = { prefix };
+
 	delete props['class'];
 	const slots = {};
 	for (const [key, value] of Object.entries(slotted)) {
@@ -74,29 +81,33 @@ async function renderToStaticMarkup(Component, props, { default: children, ...sl
 		newProps.children = React.createElement(StaticHtml, { value: newChildren });
 	}
 	const vnode = React.createElement(Component, newProps);
+	const renderOptions = {
+		identifierPrefix: prefix,
+	};
 	let html;
 	if (metadata && metadata.hydrate) {
 		if ('renderToReadableStream' in ReactDOM) {
-			html = await renderToReadableStreamAsync(vnode);
+			html = await renderToReadableStreamAsync(vnode, renderOptions);
 		} else {
-			html = await renderToPipeableStreamAsync(vnode);
+			html = await renderToPipeableStreamAsync(vnode, renderOptions);
 		}
 	} else {
 		if ('renderToReadableStream' in ReactDOM) {
-			html = await renderToReadableStreamAsync(vnode);
+			html = await renderToReadableStreamAsync(vnode, renderOptions);
 		} else {
-			html = await renderToStaticNodeStreamAsync(vnode);
+			html = await renderToStaticNodeStreamAsync(vnode, renderOptions);
 		}
 	}
-	return { html };
+	return { html, attrs };
 }
 
-async function renderToPipeableStreamAsync(vnode) {
+async function renderToPipeableStreamAsync(vnode, options) {
 	const Writable = await getNodeWritable();
 	let html = '';
 	return new Promise((resolve, reject) => {
 		let error = undefined;
 		let stream = ReactDOM.renderToPipeableStream(vnode, {
+			...options,
 			onError(err) {
 				error = err;
 				reject(error);
@@ -118,11 +129,11 @@ async function renderToPipeableStreamAsync(vnode) {
 	});
 }
 
-async function renderToStaticNodeStreamAsync(vnode) {
+async function renderToStaticNodeStreamAsync(vnode, options) {
 	const Writable = await getNodeWritable();
 	let html = '';
 	return new Promise((resolve, reject) => {
-		let stream = ReactDOM.renderToStaticNodeStream(vnode);
+		let stream = ReactDOM.renderToStaticNodeStream(vnode, options);
 		stream.on('error', (err) => {
 			reject(err);
 		});
@@ -164,8 +175,8 @@ async function readResult(stream) {
 	}
 }
 
-async function renderToReadableStreamAsync(vnode) {
-	return await readResult(await ReactDOM.renderToReadableStream(vnode));
+async function renderToReadableStreamAsync(vnode, options) {
+	return await readResult(await ReactDOM.renderToReadableStream(vnode, options));
 }
 
 export default {

packages/integrations/sitemap/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @astrojs/sitemap
 
+## 1.3.0
+
+### Minor Changes
+
+- [#6534](https://github.com/withastro/astro/pull/6534) [`ad907196c`](https://github.com/withastro/astro/commit/ad907196cb42f21d9540ae0d77aa742bf7adf030) Thanks [@atilafassina](https://github.com/atilafassina)! - Adds support to SSR routes to sitemap generation.
+
 ## 1.2.2
 
 ### Patch Changes

packages/integrations/sitemap/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@astrojs/sitemap",
   "description": "Generate a sitemap for your Astro site",
-  "version": "1.2.2",
+  "version": "1.3.0",
   "type": "module",
   "types": "./dist/index.d.ts",
   "author": "withastro",

packages/integrations/svelte/package.json

@@ -43,7 +43,7 @@
     "vite": "^4.3.1"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4",
+    "astro": "workspace:^2.4.1",
     "svelte": "^3.54.0"
   },
   "engines": {

packages/integrations/tailwind/package.json

@@ -40,7 +40,7 @@
     "vite": "^4.3.1"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4",
+    "astro": "workspace:^2.4.1",
     "tailwindcss": "^3.0.24"
   },
   "pnpm": {

packages/integrations/vercel/package.json

@@ -55,7 +55,7 @@
     "web-vitals": "^3.1.1"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4"
+    "astro": "workspace:^2.4.1"
   },
   "devDependencies": {
     "@types/set-cookie-parser": "^2.4.2",

packages/integrations/vue/package.json

@@ -50,7 +50,7 @@
     "vue": "^3.2.37"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.4",
+    "astro": "workspace:^2.4.1",
     "vue": "^3.2.30"
   },
   "engines": {

packages/markdown/remark/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @astrojs/markdown-remark
 
+## 2.2.0
+
+### Minor Changes
+
+- [#6932](https://github.com/withastro/astro/pull/6932) [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7) Thanks [@bluwy](https://github.com/bluwy)! - Upgrade shiki to v0.14.1. This updates the shiki theme colors and adds the theme name to the `pre` tag, e.g. `<pre class="astro-code github-dark">`.
+
+### Patch Changes
+
+- Updated dependencies [[`818252acd`](https://github.com/withastro/astro/commit/818252acda3c00499cea51ffa0f26d4c2ccd3a02), [`80e3d4d3d`](https://github.com/withastro/astro/commit/80e3d4d3d0f7719d8eae5435bba3805503057511), [`3326492b9`](https://github.com/withastro/astro/commit/3326492b94f76ed2b0154dd9b9a1a9eb883c1e31), [`cac4a321e`](https://github.com/withastro/astro/commit/cac4a321e814fb805eb0e3ced469e25261a50885), [`831b67cdb`](https://github.com/withastro/astro/commit/831b67cdb8250f93f66e3b171fab024652bf80f2), [`49514e4ce`](https://github.com/withastro/astro/commit/49514e4ce40fedb39bf7decd2c296258efbdafc7), [`0883fd487`](https://github.com/withastro/astro/commit/0883fd4875548a613df122f0b87a1ca8b7a7cf7d)]:
+  - astro@2.4.0
+
 ## 2.1.4
 
 ### Patch Changes

packages/markdown/remark/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astrojs/markdown-remark",
-  "version": "2.1.4",
+  "version": "2.2.0",
   "type": "module",
   "author": "withastro",
   "license": "MIT",
@@ -25,7 +25,7 @@
     "test": "mocha --exit --timeout 20000"
   },
   "peerDependencies": {
-    "astro": "workspace:^2.3.0"
+    "astro": "workspace:^2.4.0"
   },
   "dependencies": {
     "@astrojs/prism": "^2.1.0",