Merge branch 'main' into mt/readme

.changeset/chilly-jobs-deny.md

@@ -0,0 +1,5 @@
+---
+"astro-vtbot": patch
+---
+
+Extends `VtBotDebug` with the ability to log the animations that happen during a view transition

.changeset/warm-carrots-fry.md

@@ -0,0 +1,5 @@
+---
+"astro-vtbot": patch
+---
+
+Adds a `production` property to the `<BrakePad />`. Making the brake a pure DEV mode features unless requested otherwise.

components/BrakePad.astro

@@ -1,39 +1,32 @@
 ---
 export interface Props {
 	duration?: number;
+	production?: boolean;
 }
 const TAG = 'vtbot-brake-pad'; // see also start of script
-const { duration = 2000 } = Astro.props;
-if (!import.meta.env.DEV) {
-	console.error(
-		`${Astro.url.pathname}: Active brake pad in production? Don't forget to remove it!`
-	);
+let { duration = 2000 } = Astro.props;
+if (!(import.meta.env.DEV || Astro.props.production)) {
+	duration = 0;
 }
 ---
 
-<meta name={TAG} content={'' + duration} />
+{duration > 0 && <meta name={TAG} content={'' + duration} />}
 
-<script>
+{ duration > 0 && <script type="module">
 	const TAG = 'vtbot-brake-pad';
-
-	import {
-		TRANSITION_BEFORE_PREPARATION,
-		isTransitionBeforePreparationEvent,
-	} from 'astro:transitions/client';
-
 	const duration = () =>
-		(document.querySelector(`meta[name="${TAG}"]`) as HTMLMetaElement)?.content;
+		(document.querySelector(`meta[name="${TAG}"]`))?.content;
 
-	const beforePreparation = (event: Event) => {
+	const beforePreparation = (event) => {
 		const waitTime = duration();
 
-		if (waitTime && isTransitionBeforePreparationEvent(event)) {
+		if (waitTime) {
 			const originalLoader = event.loader;
 			event.loader = async () => {
 				await originalLoader();
 				await new Promise((resolve) => setTimeout(resolve, parseInt(waitTime, 10)));
 			};
 		}
 	};
-	document.addEventListener(TRANSITION_BEFORE_PREPARATION, beforePreparation);
-</script>
+	document.addEventListener('astro:before-preparation', beforePreparation);
+</script>}