@anatoliygatt/use-prefers-color-scheme/dist/esm/usePrefersColorScheme.js

React hook for subscribing to user's color scheme preference.

import { useState, useEffect } from 'react';
export function usePrefersColorScheme(options) {
    if (options === void 0) { options = {}; }
    var _a = options.ssr, ssr = _a === void 0 ? false : _a;
    var _b = useState(ssr ? 'dark' : 'light'), preferredColorScheme = _b[0], setPreferredColorScheme = _b[1];
    useEffect(function () {
        if (!window.matchMedia) {
            setPreferredColorScheme('light');
            return;
        }
        var mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
        setPreferredColorScheme(mediaQuery.matches ? 'dark' : 'light');
        function onChange(event) {
            setPreferredColorScheme(event.matches ? 'dark' : 'light');
        }
        mediaQuery.addEventListener('change', onChange);
        return function () {
            mediaQuery.removeEventListener('change', onChange);
        };
    }, []);
    return preferredColorScheme;
}
//# sourceMappingURL=usePrefersColorScheme.js.map