@voidzero-dev/vitepress-theme 0.0.12 → 0.0.14

package/components/terminal-animations/TerminalAnimation1.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+  const Typewriter = await useTypewriter()
   const target = document.getElementById('terminal-code');
   typewriter = new Typewriter(target, {
     loop: false,

package/components/terminal-animations/TerminalAnimation2.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+  const Typewriter = await useTypewriter()
   // Get current time for easter egg
   const now = new Date()
   let hours = now.getHours()

package/components/terminal-animations/TerminalAnimation3.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+    const Typewriter = await useTypewriter()
     const target = document.getElementById('terminal-code');
   typewriter = new Typewriter(target, {
     loop: false,

package/components/terminal-animations/TerminalAnimation4.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+    const Typewriter = await useTypewriter()
     const target = document.getElementById('terminal-code');
   typewriter = new Typewriter(target, {
     loop: false,

package/components/terminal-animations/TerminalAnimation5.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+    const Typewriter = await useTypewriter()
     const target = document.getElementById('terminal-code');
   typewriter = new Typewriter(target, {
     loop: false,

package/components/terminal-animations/TerminalAnimation6.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import Typewriter from 'typewriter-effect/dist/core'
+import {useTypewriter} from '../../composables/useTypewriter'
 import {onMounted, onUnmounted} from "vue";
 
 const props = defineProps<{
@@ -8,7 +8,8 @@ const props = defineProps<{
 
 let typewriter;
 
-onMounted(() => {
+onMounted(async () => {
+    const Typewriter = await useTypewriter()
     const target = document.getElementById('terminal-code');
   typewriter = new Typewriter(target, {
     loop: false,

package/composables/useTypewriter.ts

@@ -0,0 +1,43 @@
+// Dynamically load Typewriter from CDN
+let TypewriterClass: any = null
+let loadingPromise: Promise<any> | null = null
+
+export async function useTypewriter() {
+  // Return cached class if already loaded
+  if (TypewriterClass) {
+    return TypewriterClass
+  }
+
+  // Return existing loading promise if already loading
+  if (loadingPromise) {
+    return loadingPromise
+  }
+
+  // Start loading from CDN
+  loadingPromise = new Promise((resolve, reject) => {
+    // Check if already loaded globally
+    if ((window as any).Typewriter) {
+      TypewriterClass = (window as any).Typewriter
+      resolve(TypewriterClass)
+      return
+    }
+
+    // Create script tag to load from CDN
+    const script = document.createElement('script')
+    script.src = 'https://unpkg.com/typewriter-effect@2.22.0/dist/core.js'
+    script.async = true
+
+    script.onload = () => {
+      TypewriterClass = (window as any).Typewriter
+      resolve(TypewriterClass)
+    }
+
+    script.onerror = () => {
+      reject(new Error('Failed to load Typewriter from CDN'))
+    }
+
+    document.head.appendChild(script)
+  })
+
+  return loadingPromise
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@voidzero-dev/vitepress-theme",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "description": "Shared VitePress theme for VoidZero projects",
   "type": "module",
   "main": "./index.ts",
@@ -15,7 +15,8 @@
     "style.css",
     "fonts",
     "assets",
-    "components"
+    "components",
+    "composables"
   ],
   "peerDependencies": {
     "vitepress": "^2.0.0-alpha.12",
@@ -26,8 +27,7 @@
     "@tailwindcss/typography": "^0.5.19",
     "@tailwindcss/vite": "^4.1.13",
     "tailwindcss": "^4.1.13",
-    "reka-ui": "^2.5.1",
-    "typewriter-effect": "^2.22.0"
+    "reka-ui": "^2.5.1"
   },
   "keywords": [
     "vitepress",