11import { onBeforeMount , ref , watch } from 'vue'
22
3- const getStoredTheme = ( localStorageItemName :string ) => localStorage . getItem ( localStorageItemName )
3+ const getStoredTheme = ( localStorageItemName :string ) =>
4+ typeof window !== 'undefined' && localStorage . getItem ( localStorageItemName )
45const setStoredTheme = ( localStorageItemName :string , colorMode :string ) =>
56localStorage . setItem ( localStorageItemName , colorMode )
67
78const getPreferredColorScheme = ( localStorageItemName :string ) => {
9+ if ( typeof window === 'undefined' ) {
10+ return
11+ }
12+
813const storedTheme = getStoredTheme ( localStorageItemName )
914
1015if ( storedTheme ) {
@@ -28,23 +33,23 @@ export const useColorModes = (localStorageItemName = 'coreui-vue-color-scheme')
2833const colorMode = ref ( getPreferredColorScheme ( localStorageItemName ) )
2934
3035watch ( colorMode , ( ) => {
31- setStoredTheme ( localStorageItemName , colorMode . value )
32- setTheme ( colorMode . value )
36+ if ( colorMode . value ) {
37+ setStoredTheme ( localStorageItemName , colorMode . value )
38+ setTheme ( colorMode . value )
39+ }
3340} )
3441
3542onBeforeMount ( ( ) => {
36- if ( typeof getStoredTheme ( localStorageItemName ) === 'string' ) {
43+ if ( typeof getStoredTheme ( localStorageItemName ) === 'string' && colorMode . value ) {
3744setTheme ( colorMode . value )
3845}
3946
4047window . matchMedia ( '(prefers-color-scheme: dark)' ) . addEventListener ( 'change' , ( ) => {
4148const storedTheme = getStoredTheme ( localStorageItemName )
42- if ( storedTheme !== 'light' && storedTheme !== 'dark' ) {
49+ if ( storedTheme !== 'light' && storedTheme !== 'dark' && colorMode . value ) {
4350setTheme ( colorMode . value )
4451}
4552} )
46-
47- watch ( colorMode , ( ) => setTheme ( colorMode . value ) )
4853} )
4954
5055return {