@nextcloud/vue/dist/Composables/useIsDarkTheme.mjs

Nextcloud vue components

import { ref, watch, readonly } from "vue";
import { createSharedComposable, usePreferredDark, useMutationObserver } from "@vueuse/core";
import { checkIfDarkTheme } from "../Functions/isDarkTheme.mjs";
function useIsDarkThemeElement(el = document.body) {
  const isDarkTheme = ref(checkIfDarkTheme(el));
  const isDarkSystemTheme = usePreferredDark();
  function updateIsDarkTheme() {
    isDarkTheme.value = checkIfDarkTheme(el);
  }
  useMutationObserver(el, updateIsDarkTheme, { attributes: true });
  watch(isDarkSystemTheme, updateIsDarkTheme, { immediate: true });
  return readonly(isDarkTheme);
}
const useIsDarkTheme = createSharedComposable(() => useIsDarkThemeElement());
export {
  useIsDarkTheme,
  useIsDarkThemeElement
};