feat: rename logics to logic

src/components/Footer.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
-import { isDark, toggleDark } from '~/logics'
+import { isDark, toggleDark } from '~/logic'
 
 const { t, availableLocales, locale } = useI18n()
 

src/logic/dark.ts

@@ -1,3 +1,4 @@
-import { useDark } from '@vueuse/core'
+import { useDark, useToggle } from '@vueuse/core'
 
 export const isDark = useDark()
+export const toggleDark = useToggle(isDark)

src/logics/dark.ts

@@ -1,25 +0,0 @@
-import { watch, computed } from 'vue'
-import { usePreferredDark, useToggle } from '@vueuse/core'
-import { colorSchema } from './store'
-
-const preferredDark = usePreferredDark()
-
-export const isDark = computed({
-  get() {
-    return colorSchema.value === 'auto' ? preferredDark.value : colorSchema.value === 'dark'
-  },
-  set(v: boolean) {
-    if (v === preferredDark.value)
-      colorSchema.value = 'auto'
-    else
-      colorSchema.value = v ? 'dark' : 'light'
-  },
-})
-
-export const toggleDark = useToggle(isDark)
-
-watch(
-  isDark,
-  v => typeof document !== 'undefined' && document.documentElement.classList.toggle('dark', v),
-  { immediate: true },
-)

src/logics/store.ts

@@ -1,4 +0,0 @@
-import { Ref } from 'vue'
-import { useStorage } from '@vueuse/core'
-
-export const colorSchema = useStorage('color-schema', 'auto') as Ref<'auto' | 'dark' | 'light'>

src/pages/README.md

@@ -10,11 +10,11 @@ Check out [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) f
 For example, instead of having
 
 ```ts
-import { isDark } from '../../../../logics'
+import { isDark } from '../../../../logic'
 ```
 
 now, you can use
 
 ```ts
-import { isDark } from '~/logics'
+import { isDark } from '~/logic'
 ```