react-switch-theme/build/index.js

Switch between your themes easily, uses react hooks. Just provide the colors object for themes and switch it. switch between light or dark theme, or so.

module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(n,o,function(t){return e[t]}.bind(null,o));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=1)}([function(e,t){e.exports=require("react")},function(e,t,r){"use strict";r.r(t);var n=r(0),o=r.n(n);function u(e,t){var r=e;return t&&(r=function(e,t){var r=e;if(localStorage){var n=localStorage.getItem(t);n&&(r=n)}return r}(r,t)),r}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,o=!1,u=void 0;try{for(var i,c=e[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!t||r.length!==t);n=!0);}catch(e){o=!0,u=e}finally{try{n||null==c.return||c.return()}finally{if(o)throw u}}return r}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var c=function(e){var t=e.colors,r=e.activeMode,o=e.offlineStorageKey,c=Object.keys(t);if(-1===c.indexOf(r)){throw Error("[react-switch-theme]: activeMode should be one of the key of colors")}var a=u(r,o),l=i(Object(n.useState)(a),2),f=l[0],d=l[1];return Object(n.useEffect)((function(){for(var e=t[f],r=0,n=Object.entries(e);r<n.length;r++){var o=i(n[r],2),u=o[0],c=o[1];document.documentElement.style.setProperty("--".concat(u),"".concat(c))}}),[f]),[f,function(){var e=c.indexOf(f),t=c[0===e?1:0];!function(e,t){localStorage&&e&&localStorage.setItem(e,t)}(o,t),d(t)}]};function a(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,o=!1,u=void 0;try{for(var i,c=e[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!t||r.length!==t);n=!0);}catch(e){o=!0,u=e}finally{try{n||null==c.return||c.return()}finally{if(o)throw u}}return r}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()}var l=Object(n.createContext)(["light",function(){}]);function f(e){var t=e.colors,r=e.activeMode,n=e.offlineStorageKey,u=a(c({colors:t,activeMode:r,offlineStorageKey:n}),2),i=u[0],f=u[1];return o.a.createElement(l.Provider,{value:[i,f]},o.a.Children.only(e.children))}r.d(t,"Theme",(function(){return l})),r.d(t,"ThemeProvider",(function(){return f}));t.default=c}]);