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

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

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.usePrefersColorScheme = void 0;
var react_1 = require("react");
function usePrefersColorScheme(options) {
    if (options === void 0) { options = {}; }
    var _a = options.ssr, ssr = _a === void 0 ? false : _a;
    var _b = (0, react_1.useState)(ssr ? 'dark' : 'light'), preferredColorScheme = _b[0], setPreferredColorScheme = _b[1];
    (0, react_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;
}
exports.usePrefersColorScheme = usePrefersColorScheme;
//# sourceMappingURL=usePrefersColorScheme.js.map