Now grew into an Astro intergration!

Author: martrapp

.changeset/blue-carrots-grin.md

@@ -0,0 +1,6 @@
+---
+"astro-vtbot": minor
+---
+
+Enables installation as an Astro integration with `npx astro add astro-vtbot`. This automatically adds the `<Linter>` component to all your `<ViewTransition>` pages!  
+

integration/env.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="astro/client" />
+/// <reference path="../.astro/types.d.ts" />

integration/index.ts

@@ -0,0 +1,27 @@
+
+import type { AstroConfig, AstroIntegration } from "astro";
+import vitePluginVtbotExtend from "./vite-plugin-extend";
+
+type VtBotOptions = {
+	autoLint: boolean;
+};
+
+export default function createIntegration(options?: VtBotOptions): AstroIntegration {
+	let config: AstroConfig;
+	return {
+		name: 'astro-vtbot',
+		hooks: {
+			'astro:config:setup': ({ updateConfig }) => {
+				(options?.autoLint ?? true) && updateConfig({
+					vite: {
+						plugins: [vitePluginVtbotExtend()],
+					},
+				});
+			},
+
+			'astro:config:done': async ({ config: cfg }) => {
+				config = cfg;
+			},
+		},
+	};
+}

integration/view-transition-extension.ts

@@ -0,0 +1,3 @@
+import VTPL from './vtpl.astro';
+export * from 'astro:transitions';
+export { VTPL as ViewTransitions };

integration/vite-plugin-extend.ts

@@ -0,0 +1,32 @@
+import { parse } from "acorn";
+import { walk, type Node } from 'estree-walker';
+import type { Plugin } from "vite";
+
+export default function vitePluginVtbotExtend(): Plugin {
+	return {
+		name: "vtbot:linter",
+		enforce: "pre",
+		transform(code: string, id: string) {
+			if (!import.meta.env.DEV || id.endsWith("vtpl.astro") || !id.endsWith(".astro")) return;
+
+			const match = code.match(/from\s*['"]astro:transitions["']/ms);
+			if (match) {
+				console.log('id :>> ', id);
+				const ast = parse(code, {
+					ecmaVersion: 'latest',
+					sourceType: 'module',
+				}) as Node;
+
+				walk(ast, {
+					enter(node: any) {
+						if (node.type === 'ImportDeclaration' && node.source.value === 'astro:transitions') {
+							code = code.substring(0, node.source.start) + '"astro-vtbot/vtext"' + code.substring(node.source.end);
+						}
+					}
+				});
+			};
+			return code;
+		}
+	};
+};
+

integration/vtpl.astro

@@ -0,0 +1,7 @@
+---
+import { ViewTransitions } from 'astro:transitions';
+import Linter from '../components/Linter.astro';
+---
+
+<ViewTransitions />
+<Linter />