use-color-scheme
Version:
React Hook to get users prefered color scheme
2 lines (1 loc) • 1.6 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e=e||self).UseColorScheme={},e.React)}(this,function(e,n){"use strict";function i(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if(!(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)))return;var r=[],n=!0,i=!1,c=void 0;try{for(var o,a=e[Symbol.iterator]();!(n=(o=a.next()).done)&&(r.push(o.value),!t||r.length!==t);n=!0);}catch(e){i=!0,c=e}finally{try{n||null==a.return||a.return()}finally{if(i)throw c}}return r}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}function t(e){return"(prefers-color-scheme: ".concat(e,")")}function r(e){return window.matchMedia(t(e))}function c(e){return e.map(function(e){return{preference:e,matchMedia:r(e)}}).filter(function(e){return e.matchMedia.matches})[0]}function o(t,r){function n(){var e=c(u);r(e.preference),t.matchMedia.removeListener(n),i=o(e,r)}var i;return t.matchMedia.addListener(n),function(){i?i():t.matchMedia.removeListener(n)}}var a={DARK:"dark",LIGHT:"light",NONE:"no-preference"},u=[a.DARK,a.LIGHT,a.NONE],f=c(u);e.PREFERENCES=a,e.attachListener=o,e.getPreference=c,e.makeQuery=t,e.matchPreference=r,e.useColorScheme=function(){if(!("matchMedia"in window))return{scheme:a.NONE};var e=i(n.useState(f?f.preference:a.NONE),2),t=e[0],r=e[1];return n.useEffect(function(){if(f)return o(f,r)},[]),{scheme:t}},e.values=u,Object.defineProperty(e,"__esModule",{value:!0})});