@voidzero-dev/vitepress-theme 0.0.10 → 0.0.12

package/components/terminal-animations/TerminalAnimation6.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import Typewriter from 'typewriter-effect/dist/core'
+import {onMounted, onUnmounted} from "vue";
+
+const props = defineProps<{
+  onAnimationComplete?: () => void
+}>()
+
+let typewriter;
+
+onMounted(() => {
+    const target = document.getElementById('terminal-code');
+  typewriter = new Typewriter(target, {
+    loop: false,
+    delay: 1,
+  })
+  typewriter
+      .typeString(`<span>$ vite build</span>`)
+      .pauseFor(200)
+      .pasteString(`<span class="block w-full h-[1rem]"></span>`)
+      .pasteString(`<div class="block"><span class="text-vite">VITE+ v1.0.0</span> <span class="text-aqua">building for production</span></div>`)
+      .pauseFor(100)
+      .pasteString(`<div class="block">transforming...</div>`)
+      .pauseFor(400)
+      .pasteString(`<div class="block"><span class="text-zest">✓</span> <span class="text-grey">32 modules transformed...</span></div>`)
+      .pauseFor(300)
+      .pasteString(`<div class="block">rendering chunks...</div>`)
+      .pasteString(`<div class="block">computing gzip size...</div>`)
+      .pasteString(`<div class="block text-grey"><span class="w-72 inline-block">dist/<span class="text-white">index.html</span></span>&nbsp;&nbsp;0.46 kB | gzip:  0.30 kB</div>`)
+      .pasteString(`<div class="block text-grey"><span class="w-72 inline-block">dist/assets/<span class="text-vite">react-CHdo91hT.svg</span></span>&nbsp;&nbsp;4.13 kB | gzip:  2.05 kB</div>`)
+      .pasteString(`<div class="block text-grey"><span class="w-72 inline-block">dist/assets/<span class="text-electric">index-D8b4DHJx.css</span></span>&nbsp;&nbsp;1.39 kB | gzip:  0.71 kB</div>`)
+      .pasteString(`<div class="block text-grey"><span class="w-72 inline-block">dist/assets/<span class="text-aqua">index-CAl1KfkQ.js</span></span>188.06 kB | gzip: 59.21 kB</div>`)
+      .pasteString(`<div class="block"><span class="text-zest">✓ built in 308ms</span></div>`)
+      .pasteString(`<span class="block w-full h-[1rem]"></span>`)
+      .callFunction(() => {
+        if (props.onAnimationComplete) {
+          props.onAnimationComplete()
+        }
+      })
+      .start();
+})
+
+onUnmounted(() => {
+  if(typewriter){
+    typewriter.stop()
+  }
+})
+</script>
+
+<template>
+  <p class="font-mono text-sm text-white leading-[1.5rem]">
+    <span id="terminal-code"></span>
+  </p>
+</template>

package/index.ts

@@ -0,0 +1,44 @@
+/**
+ * @voidzero-dev/vitepress-theme
+ *
+ * Shared VitePress theme providing base styles, fonts, and design tokens
+ * for VoidZero projects.
+ *
+ * Usage:
+ * Extend this theme in your project's VitePress theme.
+ *
+ * @example
+ * ```ts
+ * // In your-project/.vitepress/theme/index.ts
+ * import Theme from '@voidzero-dev/vitepress-theme'
+ * import './overrides.css' // Your project-specific styles
+ *
+ * export default {
+ *   extends: Theme,
+ *   Layout: YourLayout
+ * }
+ * ```
+ */
+
+import type { Theme } from 'vitepress'
+import Footer from './components/Footer.vue'
+import Header from './components/Header.vue'
+import Terminal from './components/Terminal.vue'
+import Eyebrow from './components/Eyebrow.vue'
+import RiveAnimation from './components/RiveAnimation.vue'
+
+// NOTE: We don't import style.css here because the consuming theme
+// needs to import Tailwind first, then our styles.
+// See the usage example in the JSDoc comment above.
+
+export default {
+  Layout: () => null, // Base theme provides no layout, consuming themes must provide one
+  enhanceApp({ app }) {
+    // Register shared components globally - available in all consuming projects
+    app.component('Footer', Footer)
+    app.component('Header', Header)
+    app.component('Terminal', Terminal)
+    app.component('Eyebrow', Eyebrow)
+    app.component('RiveAnimation', RiveAnimation)
+  }
+} satisfies Theme

package/package.json

@@ -1,26 +1,22 @@
 {
   "name": "@voidzero-dev/vitepress-theme",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "description": "Shared VitePress theme for VoidZero projects",
   "type": "module",
-  "license": "MIT",
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "main": "./index.ts",
   "exports": {
     ".": {
-      "style": "./dist/index.css",
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
-    },
-    "./index.css": "./dist/index.css"
+      "style": "./style.css",
+      "import": "./index.ts"
+    }
   },
   "files": [
-    "dist"
+    "index.ts",
+    "style.css",
+    "fonts",
+    "assets",
+    "components"
   ],
-  "scripts": {
-    "dev": "tsdown --watch",
-    "build": "tsdown"
-  },
   "peerDependencies": {
     "vitepress": "^2.0.0-alpha.12",
     "vue": "^3.5.0"
@@ -29,14 +25,15 @@
     "@rive-app/canvas": "^2.31.6",
     "@tailwindcss/typography": "^0.5.19",
     "@tailwindcss/vite": "^4.1.13",
-    "reka-ui": "^2.5.1",
     "tailwindcss": "^4.1.13",
+    "reka-ui": "^2.5.1",
     "typewriter-effect": "^2.22.0"
   },
-  "devDependencies": {
-    "tsdown": "^0.15.11",
-    "typescript": "^5.9.3",
-    "unplugin-vue": "^7.0.4",
-    "vue-tsc": "^3.1.2"
-  }
+  "keywords": [
+    "vitepress",
+    "theme",
+    "voidzero",
+    "tailwind"
+  ],
+  "license": "MIT"
 }

package/{dist/index.css → style.css}

@@ -13,31 +13,31 @@
 @font-face {
     font-family: 'APK Protocol';
     font-weight: 500;
-    src: url('fonts/APK-Protocol-Medium.woff2') format('woff2');
+    src: url('./fonts/APK-Protocol-Medium.woff2') format('woff2');
 }
 
 @font-face {
     font-family: 'KH Teka';
     font-weight: 400;
-    src: url('fonts/KHTeka-Regular.woff2') format('woff2');
+    src: url('./fonts/KHTeka-Regular.woff2') format('woff2');
 }
 
 @font-face {
     font-family: 'KH Teka';
     font-weight: 500;
-    src: url('fonts/KHTeka-Medium.woff2') format('woff2');
+    src: url('./fonts/KHTeka-Medium.woff2') format('woff2');
 }
 
 @font-face {
     font-family: 'KH Teka Mono';
     font-weight: 400;
-    src: url('fonts/KHTekaMono-Regular.woff2') format('woff2');
+    src: url('./fonts/KHTekaMono-Regular.woff2') format('woff2');
 }
 
 @font-face {
     font-family: 'KH Teka Mono';
     font-weight: 500;
-    src: url('fonts/KHTekaMono-Medium.woff2') format('woff2');
+    src: url('./fonts/KHTekaMono-Medium.woff2') format('woff2');
 }
 
 @custom-variant dark (&:where([data-theme=dark], [data-theme=dark] *));
@@ -178,7 +178,7 @@
                 right: -3px;
                 bottom: -3px;
                 background-color: #CCCCCC;
-                background-image: url('assets/primary-button-background.jpg');
+                background-image: url('./assets/primary-button-background.jpg');
                 background-size: 150% 150%;
                 background-position: center;
                 border-radius: calc(0.5rem + 3px);
@@ -273,7 +273,7 @@
                 transform: translateY(-50%);
                 width: 20px;
                 height: 20px;
-                background-image: url('assets/checkmark.svg');
+                background-image: url('./assets/checkmark.svg');
                 background-size: contain;
                 background-repeat: no-repeat;
                 background-position: center;

package/dist/_virtual/_/plugin-vue/export-helper.js

@@ -1,11 +0,0 @@
-//#region \0/plugin-vue/export-helper
-var export_helper_default = (sfc, props) => {
-	const target = sfc.__vccOpts || sfc;
-	for (const [key, val] of props) {
-		target[key] = val;
-	}
-	return target;
-};
-
-//#endregion
-export { export_helper_default as default };

package/dist/assets/cta-background-CgYtVhnO.jpg

@@ -1 +0,0 @@
-PLACEHOLDER - Replace with actual cta-background.jpg from viteplus.dev repository

package/dist/assets/cta-background.jpg

@@ -1 +0,0 @@
-PLACEHOLDER - Replace with actual cta-background.jpg from viteplus.dev repository

package/dist/index.d.ts

@@ -1,2 +0,0 @@
-import { VPTheme } from "./vitepress/index.js";
-export { VPTheme, VPTheme as default };

package/dist/index.js

@@ -1,3 +0,0 @@
-import vitepress_default, { VPTheme } from "./vitepress/index.js";
-
-export { VPTheme, vitepress_default as default };

package/dist/vitepress/assets/cta-background.js

@@ -1,5 +0,0 @@
-//#region src/vitepress/assets/cta-background.jpg
-var cta_background_default = "assets/cta-background-CgYtVhnO.jpg";
-
-//#endregion
-export { cta_background_default as default };

package/dist/vitepress/assets/terminal-background.js

@@ -1,5 +0,0 @@
-//#region src/vitepress/assets/terminal-background.jpg
-var terminal_background_default = "assets/terminal-background-BWgFWVXf.jpg";
-
-//#endregion
-export { terminal_background_default as default };

package/dist/vitepress/components/Eyebrow.js

@@ -1,18 +0,0 @@
-import { createElementBlock, createElementVNode, defineComponent, openBlock, toDisplayString } from "vue";
-
-//#region src/vitepress/components/Eyebrow.vue
-const _hoisted_1 = { class: "wrapper wrapper--ticks border-t p-5 pl-10" };
-const _hoisted_2 = { class: "text-nickel dark:text-white text-xs font-medium font-mono uppercase tracking-wide" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-	__name: "Eyebrow",
-	props: { title: {} },
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("section", _hoisted_1, [createElementVNode("span", _hoisted_2, toDisplayString(__props.title), 1)]);
-		};
-	}
-});
-var Eyebrow_default = _sfc_main;
-
-//#endregion
-export { Eyebrow_default as default };

package/dist/vitepress/components/Footer.js

@@ -1,72 +0,0 @@
-import VZIconGitHub_default from "./icons/VZIconGitHub.js";
-import VZIconBluesky_default from "./icons/VZIconBluesky.js";
-import VZIconTwitter_default from "./icons/VZIconTwitter.js";
-import cta_background_default from "../assets/cta-background.js";
-import { createElementBlock, createElementVNode, createStaticVNode, createTextVNode, createVNode, defineComponent, normalizeStyle, openBlock, toDisplayString, unref } from "vue";
-
-//#region src/vitepress/components/Footer.vue
-const _hoisted_1 = {
-	class: "bg-primary",
-	"data-theme": "dark"
-};
-const _hoisted_2 = { class: "wrapper" };
-const _hoisted_3 = { class: "px-5 md:px-24 pt-10 md:pt-16 pb-16 md:pb-30 flex flex-col md:flex-row gap-10 md:gap-0 md:justify-between" };
-const _hoisted_4 = { class: "flex flex-col gap-3" };
-const _hoisted_5 = {
-	href: "https://github.com/voidzero-dev",
-	target: "_blank",
-	rel: "noopener noreferrer",
-	class: "text-white text-base flex gap-3 items-center"
-};
-const _hoisted_6 = {
-	href: "https://web-cdn.bsky.app/profile/voidzero.dev",
-	target: "_blank",
-	rel: "noopener noreferrer",
-	class: "text-white text-base flex gap-3 items-center"
-};
-const _hoisted_7 = {
-	href: "https://x.com/voidzerodev",
-	target: "_blank",
-	rel: "noopener noreferrer",
-	class: "text-white text-base flex gap-3 items-center"
-};
-const _hoisted_8 = { class: "wrapper wrapper--ticks border-t py-5 px-5 md:px-24" };
-const _hoisted_9 = { class: "text-sm" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-	__name: "Footer",
-	setup(__props) {
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("footer", _hoisted_1, [createElementVNode("section", _hoisted_2, [createElementVNode("div", {
-				class: "bg-wine bg-cover py-16 md:py-30 px-5 md:px-0 overflow-clip flex flex-col items-center justify-center gap-8 md:gap-12",
-				style: normalizeStyle({ backgroundImage: `url(${unref(cta_background_default)})` })
-			}, [..._cache[0] || (_cache[0] = [createElementVNode("h2", { class: "text-white w-full md:w-2xl text-center text-balance" }, "Take your team's productivity to the next level with Vite+", -1), createElementVNode("div", { class: "flex items-center gap-5" }, [createElementVNode("a", {
-				href: "https://tally.so/r/nGWebL",
-				target: "_blank",
-				rel: "noopener noreferrer",
-				class: "button"
-			}, "Register your interest"), createElementVNode("a", {
-				href: "https://voidzero.dev/posts/announcing-vite-plus?utm_source=viteplusdev&utm_content=bottom_learn_more",
-				target: "_blank",
-				rel: "noopener noreferrer",
-				class: "button"
-			}, " Learn more ")], -1)])], 4), createElementVNode("div", _hoisted_3, [_cache[5] || (_cache[5] = createStaticVNode("<div><p class=\"text-grey text-xs font-mono uppercase tracking-wide mb-8\">Company</p><ul class=\"flex flex-col gap-3\"><li><a href=\"https://voidzero.dev/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-white text-base\">VoidZero</a></li><li><a href=\"https://vite.dev/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-white text-base\">Vite</a></li><li><a href=\"https://rolldown.rs/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-white text-base\">Rolldown</a></li><li><a href=\"https://vitest.dev/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-white text-base\">Vitest</a></li><li><a href=\"https://oxc.rs/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"text-white text-base\">Oxc</a></li></ul></div>", 1)), createElementVNode("div", null, [_cache[4] || (_cache[4] = createElementVNode("p", { class: "text-grey text-xs font-mono uppercase tracking-wide mb-8" }, "Social", -1)), createElementVNode("ul", _hoisted_4, [
-				createElementVNode("li", null, [createElementVNode("a", _hoisted_5, [createVNode(VZIconGitHub_default, {
-					class: "size-5",
-					"aria-label": "GitHub"
-				}), _cache[1] || (_cache[1] = createTextVNode("GitHub", -1))])]),
-				createElementVNode("li", null, [createElementVNode("a", _hoisted_6, [createVNode(VZIconBluesky_default, {
-					class: "size-5",
-					"aria-label": "Bluesky"
-				}), _cache[2] || (_cache[2] = createTextVNode("Bluesky", -1))])]),
-				createElementVNode("li", null, [createElementVNode("a", _hoisted_7, [createVNode(VZIconTwitter_default, {
-					class: "size-5",
-					"aria-label": "Twitter"
-				}), _cache[3] || (_cache[3] = createTextVNode("X.com", -1))])])
-			])])])]), createElementVNode("section", _hoisted_8, [createElementVNode("p", _hoisted_9, [createTextVNode("© " + toDisplayString((/* @__PURE__ */ new Date()).getFullYear()) + " VoidZero Inc. ", 1), _cache[6] || (_cache[6] = createElementVNode("span", { class: "hidden sm:inline" }, "All Rights Reserved.", -1))])])]);
-		};
-	}
-});
-var Footer_default = _sfc_main;
-
-//#endregion
-export { Footer_default as default };

package/dist/vitepress/components/Header.js

@@ -1,34 +0,0 @@
-import VZIconLogo_default from "./icons/VZIconLogo.js";
-import { Fragment, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, unref } from "vue";
-import { useData, useRoute } from "vitepress";
-
-//#region src/vitepress/components/Header.vue
-const _hoisted_1 = { class: "wrapper px-6 py-7 flex items-center justify-between" };
-const _hoisted_2 = { class: "flex items-center gap-10" };
-const _hoisted_3 = { href: "/" };
-const _hoisted_4 = { class: "nav" };
-const _hoisted_5 = ["href"];
-const _hoisted_6 = { class: "flex items-center gap-6" };
-const _sfc_main = /* @__PURE__ */ defineComponent({
-	__name: "Header",
-	setup(__props) {
-		const { site, theme } = useData();
-		const nav = theme.value.nav;
-		const route = useRoute();
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("header", _hoisted_1, [createElementVNode("div", _hoisted_2, [createElementVNode("a", _hoisted_3, [createVNode(VZIconLogo_default, {
-				class: "h-4",
-				"aria-label": unref(site).title
-			}, null, 8, ["aria-label"])]), createElementVNode("ul", _hoisted_4, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(nav), (navItem) => {
-				return openBlock(), createElementBlock("li", { key: navItem.link }, [createElementVNode("a", {
-					class: normalizeClass({ active: unref(route).path === navItem.link }),
-					href: navItem.link
-				}, toDisplayString(navItem.text), 11, _hoisted_5)]);
-			}), 128))])]), createElementVNode("div", _hoisted_6, [renderSlot(_ctx.$slots, "right-side", {}, () => [createCommentVNode(" Right-aligned links / calls-to-action ")])])]);
-		};
-	}
-});
-var Header_default = _sfc_main;
-
-//#endregion
-export { Header_default as default };

package/dist/vitepress/components/RiveAnimation.js

@@ -1,117 +0,0 @@
-import { computed, createElementBlock, createElementVNode, defineComponent, normalizeClass, onMounted, onUnmounted, openBlock, ref } from "vue";
-import * as rive from "@rive-app/canvas";
-
-//#region src/vitepress/components/RiveAnimation.vue
-const _hoisted_1 = ["width", "height"];
-const _sfc_main = /* @__PURE__ */ defineComponent({
-	__name: "RiveAnimation",
-	props: {
-		desktopSrc: {},
-		mobileSrc: {},
-		breakpoint: { default: 768 },
-		stateMachines: { default: "State Machine 1" },
-		canvasClass: { default: "w-full" },
-		desktopWidth: {},
-		desktopHeight: {},
-		mobileWidth: {},
-		mobileHeight: {}
-	},
-	setup(__props) {
-		const props = __props;
-		const canvasRef = ref(null);
-		const containerRef = ref(null);
-		let riveInstance = null;
-		let hasStarted = ref(false);
-		let observer = null;
-		const isMobile = ref(false);
-		const checkMobile = () => {
-			isMobile.value = window.innerWidth < props.breakpoint;
-		};
-		const getCurrentSrc = () => {
-			return isMobile.value && props.mobileSrc ? props.mobileSrc : props.desktopSrc;
-		};
-		const currentWidth = computed(() => {
-			return isMobile.value && props.mobileWidth ? props.mobileWidth : props.desktopWidth;
-		});
-		const currentHeight = computed(() => {
-			return isMobile.value && props.mobileHeight ? props.mobileHeight : props.desktopHeight;
-		});
-		const loadAnimation = () => {
-			if (!canvasRef.value || riveInstance) return;
-			const src = getCurrentSrc();
-			riveInstance = new rive.Rive({
-				src,
-				canvas: canvasRef.value,
-				autoplay: false,
-				stateMachines: props.stateMachines,
-				onLoad: () => {
-					riveInstance?.resizeDrawingSurfaceToCanvas();
-				}
-			});
-		};
-		const playAnimation = () => {
-			if (riveInstance) {
-				riveInstance.play();
-			}
-		};
-		const cleanupAnimation = () => {
-			if (riveInstance) {
-				riveInstance.cleanup();
-				riveInstance = null;
-			}
-		};
-		const handleResize = () => {
-			const wasMobile = isMobile.value;
-			checkMobile();
-			if (wasMobile !== isMobile.value) {
-				const wasPlaying = hasStarted.value;
-				cleanupAnimation();
-				loadAnimation();
-				if (wasPlaying) {
-					playAnimation();
-				}
-			}
-		};
-		onMounted(() => {
-			checkMobile();
-			loadAnimation();
-			observer = new IntersectionObserver((entries) => {
-				entries.forEach((entry) => {
-					if (entry.isIntersecting && !hasStarted.value) {
-						hasStarted.value = true;
-						playAnimation();
-					}
-				});
-			}, { threshold: .1 });
-			if (containerRef.value) {
-				observer.observe(containerRef.value);
-			}
-			window.addEventListener("resize", handleResize);
-		});
-		onUnmounted(() => {
-			cleanupAnimation();
-			if (observer && containerRef.value) {
-				observer.unobserve(containerRef.value);
-				observer.disconnect();
-			}
-			window.removeEventListener("resize", handleResize);
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", {
-				ref_key: "containerRef",
-				ref: containerRef,
-				class: "pointer-events-none touch-none select-none"
-			}, [createElementVNode("canvas", {
-				ref_key: "canvasRef",
-				ref: canvasRef,
-				width: currentWidth.value,
-				height: currentHeight.value,
-				class: normalizeClass(__props.canvasClass)
-			}, null, 10, _hoisted_1)], 512);
-		};
-	}
-});
-var RiveAnimation_default = _sfc_main;
-
-//#endregion
-export { RiveAnimation_default as default };

package/dist/vitepress/components/Terminal.js

@@ -1,163 +0,0 @@
-import TerminalAnimation1_default from "./terminal-animations/TerminalAnimation1.js";
-import TerminalAnimation2_default from "./terminal-animations/TerminalAnimation2.js";
-import TerminalAnimation3_default from "./terminal-animations/TerminalAnimation3.js";
-import TerminalAnimation4_default from "./terminal-animations/TerminalAnimation4.js";
-import TerminalAnimation5_default from "./terminal-animations/TerminalAnimation5.js";
-import TerminalAnimation6_default from "./terminal-animations/TerminalAnimation6.js";
-import terminal_background_default from "../assets/terminal-background.js";
-import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, unref, withCtx } from "vue";
-import { TabsContent, TabsList, TabsRoot, TabsTrigger } from "reka-ui";
-
-//#region src/vitepress/components/Terminal.vue
-const AUTO_ADVANCE_DELAY = 1500;
-const _sfc_main = /* @__PURE__ */ defineComponent({
-	__name: "Terminal",
-	setup(__props) {
-		const activeTab = ref("tab1");
-		const autoPlayEnabled = ref(true);
-		let autoAdvanceTimeout = null;
-		const sectionRef = ref(null);
-		const isVisible = ref(false);
-		let observer = null;
-		const tabSequence = [
-			"tab1",
-			"tab2",
-			"tab3",
-			"tab4",
-			"tab5",
-			"tab6"
-		];
-		const goToNextTab = () => {
-			const currentIndex = tabSequence.indexOf(activeTab.value);
-			const nextIndex = (currentIndex + 1) % tabSequence.length;
-			activeTab.value = tabSequence[nextIndex];
-		};
-		const onAnimationComplete = () => {
-			if (!autoPlayEnabled.value) return;
-			if (autoAdvanceTimeout) {
-				clearTimeout(autoAdvanceTimeout);
-			}
-			autoAdvanceTimeout = setTimeout(() => {
-				goToNextTab();
-			}, AUTO_ADVANCE_DELAY);
-		};
-		const onTabChange = () => {
-			autoPlayEnabled.value = false;
-			if (autoAdvanceTimeout) {
-				clearTimeout(autoAdvanceTimeout);
-				autoAdvanceTimeout = null;
-			}
-		};
-		onMounted(() => {
-			if (!sectionRef.value) return;
-			observer = new IntersectionObserver((entries) => {
-				entries.forEach((entry) => {
-					if (entry.isIntersecting && !isVisible.value) {
-						isVisible.value = true;
-						observer?.disconnect();
-					}
-				});
-			}, {
-				threshold: .2,
-				rootMargin: "0px"
-			});
-			observer.observe(sectionRef.value);
-		});
-		onUnmounted(() => {
-			if (autoAdvanceTimeout) {
-				clearTimeout(autoAdvanceTimeout);
-			}
-			if (observer) {
-				observer.disconnect();
-			}
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("section", {
-				ref_key: "sectionRef",
-				ref: sectionRef,
-				class: "wrapper border-t h-[40rem] bg-wine bg-cover bg-top flex justify-center pt-28 overflow-clip",
-				style: normalizeStyle({ backgroundImage: `url(${unref(terminal_background_default)})` })
-			}, [createElementVNode("div", {
-				class: normalizeClass([
-					"self-stretch px-4 sm:px-8 py-5 sm:py-7 relative bg-primary rounded-tl-lg rounded-tr-lg inline-flex flex-col justify-start items-start gap-2 overflow-hidden w-[62rem] outline-1 outline-offset-[3px] outline-white/30",
-					"transition-transform duration-1000",
-					isVisible.value ? "translate-y-0" : "translate-y-24"
-				]),
-				style: { "transition-timing-function": "cubic-bezier(0.16, 1, 0.3, 1)" }
-			}, [isVisible.value ? (openBlock(), createBlock(unref(TabsRoot), {
-				key: 0,
-				modelValue: activeTab.value,
-				"onUpdate:modelValue": [_cache[0] || (_cache[0] = ($event) => activeTab.value = $event), onTabChange]
-			}, {
-				default: withCtx(() => [
-					createVNode(unref(TabsList), {
-						"aria-label": "features",
-						class: normalizeClass([
-							"absolute bottom-6 left-1/2 -translate-x-1/2 flex items-center p-1 rounded-md border border-white/10",
-							"transition-transform duration-700 delay-300",
-							isVisible.value ? "translate-y-0" : "translate-y-12"
-						]),
-						style: { "transition-timing-function": "cubic-bezier(0.16, 1, 0.3, 1)" }
-					}, {
-						default: withCtx(() => [
-							createVNode(unref(TabsTrigger), { value: "tab1" }, {
-								default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode(" new ", -1)])]),
-								_: 1
-							}),
-							createVNode(unref(TabsTrigger), { value: "tab2" }, {
-								default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode(" dev ", -1)])]),
-								_: 1
-							}),
-							createVNode(unref(TabsTrigger), { value: "tab3" }, {
-								default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" lint ", -1)])]),
-								_: 1
-							}),
-							createVNode(unref(TabsTrigger), { value: "tab4" }, {
-								default: withCtx(() => [..._cache[4] || (_cache[4] = [createTextVNode(" fmt ", -1)])]),
-								_: 1
-							}),
-							createVNode(unref(TabsTrigger), { value: "tab5" }, {
-								default: withCtx(() => [..._cache[5] || (_cache[5] = [createTextVNode(" test ", -1)])]),
-								_: 1
-							}),
-							createVNode(unref(TabsTrigger), { value: "tab6" }, {
-								default: withCtx(() => [..._cache[6] || (_cache[6] = [createTextVNode(" build ", -1)])]),
-								_: 1
-							})
-						]),
-						_: 1
-					}, 8, ["class"]),
-					createVNode(unref(TabsContent), { value: "tab1" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation1_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					}),
-					createVNode(unref(TabsContent), { value: "tab2" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation2_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					}),
-					createVNode(unref(TabsContent), { value: "tab3" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation3_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					}),
-					createVNode(unref(TabsContent), { value: "tab4" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation4_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					}),
-					createVNode(unref(TabsContent), { value: "tab5" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation5_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					}),
-					createVNode(unref(TabsContent), { value: "tab6" }, {
-						default: withCtx(() => [createVNode(TerminalAnimation6_default, { "on-animation-complete": onAnimationComplete })]),
-						_: 1
-					})
-				]),
-				_: 1
-			}, 8, ["modelValue"])) : createCommentVNode("v-if", true)], 2)], 4);
-		};
-	}
-});
-var Terminal_default = _sfc_main;
-
-//#endregion
-export { Terminal_default as default };