feat: switch to light mode when print triggered.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitepress",
-  "version": "1.3.0",
+  "version": "1.3.0-patch.4",
   "description": "Vite & Vue powered static site generator",
   "keywords": [
     "vite",

src/client/theme-default/components/VPSwitchAppearance.vue

@@ -1,13 +1,11 @@
 <script lang="ts" setup>
-import { inject, ref, watchPostEffect } from 'vue'
+import { ref, watchPostEffect } from 'vue'
 import { useData } from '../composables/data'
 import VPSwitch from './VPSwitch.vue'
+import { useDark } from '../composables/dark'
 
-const { isDark, theme } = useData()
+const { theme } = useData()
-
+const { isDark, toggleAppearance } = useDark({ triggerPrint: true });
-const toggleAppearance = inject('toggle-appearance', () => {
-  isDark.value = !isDark.value
-})
 
 const switchTitle = ref('')
 

src/client/theme-default/composables/dark.ts

@@ -0,0 +1,38 @@
+import { inject, type Ref } from 'vue'
+import { useData } from './data'
+import { onMounted } from 'vue'
+
+export interface UseDarkOptions {
+  triggerPrint: boolean
+}
+
+export interface UseDark {
+  isDark: Ref<boolean>
+  toggleAppearance: () => void
+}
+
+export function useDark(options?: UseDarkOptions): UseDark {
+  const { isDark } = useData()
+  const toggleAppearance = inject('toggle-appearance', () => {
+    isDark.value = !isDark.value
+  })
+  let previousPreferred = isDark.value
+  let isPrinting = false
+
+  // FIXME it will remain light when preferring dark mode after printing.
+  if (options?.triggerPrint) {
+    onMounted(() => {
+      window.addEventListener('beforeprint', () => {
+        if (isPrinting) return
+        isPrinting = true
+        previousPreferred = isDark.value
+        isDark.value = false
+      })
+      window.addEventListener('afterprint', () => {
+        isPrinting = false
+        isDark.value = previousPreferred
+      })
+    })
+  }
+  return { isDark, toggleAppearance }
+}