@anmiles/theme-switcher 1.0.1 → 1.0.2

package/CHANGELOG.md

@@ -5,7 +5,7 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [1.0.1](../../tags/v1.0.1) - 2024-12-15
+## [1.0.2](../../tags/v1.0.2) - 2024-12-15
 ### Changed
 - Update dist files
 

package/README.md

@@ -27,9 +27,9 @@ Theme switcher for websites
 
 ### For static HTML website
 
-1. Clone repository:
+1. Install package:
     ```bash
-    git clone https://github.com/anmiles/theme-switcher.git
+    npm install @anmiles/theme-switcher
     ```
 
 2. Copy all files from `dist` into the target website.
@@ -47,7 +47,7 @@ Theme switcher for websites
     ```html
     <script type="text/javascript" src="https://unpkg.com/react@18.3.1/umd/react.development.js"></script>
     <script type="text/javascript" src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.development.js"></script>
-    <script type="text/javascript" src="./theme-switcher-1.0.1.js"></script>
+    <script type="text/javascript" src="./theme-switcher-1.0.2.js"></script>
     ```
 
     ### Production
@@ -55,7 +55,7 @@ Theme switcher for websites
     ```html
     <script type="text/javascript" src="https://unpkg.com/react@18.3.1/umd/react.production.min.js"></script>
     <script type="text/javascript" src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.production.min.js"></script>
-    <script type="text/javascript" src="./theme-switcher-1.0.1.min.js"></script>
+    <script type="text/javascript" src="./theme-switcher-1.0.2.min.js"></script>
     ```
 
 6. Place theme switcher into container:

package/dev/index.html

@@ -28,7 +28,7 @@
 
 <script type="text/javascript" src="https://dev.anmiles.net/libs/react-18.3.1.js"></script>
 <script type="text/javascript" src="https://dev.anmiles.net/libs/react-dom-18.3.1.js"></script>
-<script type="text/javascript" src="./theme-switcher-1.0.1.js"></script>
+<script type="text/javascript" src="./theme-switcher-1.0.2.js"></script>
 <script type="text/javascript">new ThemeSwitcherElement({ float: 'right' }).render(document.querySelector('.theme'));</script>
 
 </body>

package/dist/{theme-switcher-1.0.0.min.js → theme-switcher-1.0.2.min.js}

@@ -1,2 +1,2 @@
-/*! For license information please see theme-switcher-1.0.0.min.js.LICENSE.txt */
+/*! For license information please see theme-switcher-1.0.2.min.js.LICENSE.txt */
 !function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("React"),require("ReactDOM"));else if("function"==typeof define&&define.amd)define(["React","ReactDOM"],t);else{var r="object"==typeof exports?t(require("React"),require("ReactDOM")):t(e.React,e.ReactDOM);for(var n in r)("object"==typeof exports?exports:e)[n]=r[n]}}(self,((e,t)=>(()=>{"use strict";var r={919:(e,t,r)=>{r.d(t,{A:()=>i});var n=r(601),o=r.n(n),s=r(314),a=r.n(s)()(o());a.push([e.id,'.themeSwitcher {\n\tcursor: pointer;\n\tposition: relative;\n}\n\n.themeSwitcher > svg:hover,\n.themeSwitcher li:hover {\n\tfilter: brightness(1.5);\n}\n\n.themeSwitcher svg {\n\twidth: 2em;\n\theight: 2em;\n\tstroke: currentColor;\n\tdisplay: block;\n}\n\n.themeSwitcher ul {\n\tlist-style-type: none;\n\tposition: absolute;\n\tleft: 0;\n\tmargin: 0.5em 0;\n\tpadding: 0;\n\tgap: 0;\n\toverflow-y: visible;\n\tz-index: 1;\n}\n\n.themeSwitcher li {\n\tpadding: 0.5em 1em;\n}\n\n.themeSwitcher[data-float="right"] ul {\n\tleft: auto;\n\tright: 0;\n}\n\n.themeSwitcher li {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 0.5em;\n}\n\n.themeSwitcher li svg {\n\twidth: 1.5em;\n\theight: 1.5em;\n}\n\n.themeSwitcher svg.checked {\n\twidth: 16px;\n\theight: 13.5px;\n}\n',""]);const i=a},314:e=>{e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var r="",n=void 0!==t[5];return t[4]&&(r+="@supports (".concat(t[4],") {")),t[2]&&(r+="@media ".concat(t[2]," {")),n&&(r+="@layer".concat(t[5].length>0?" ".concat(t[5]):""," {")),r+=e(t),n&&(r+="}"),t[2]&&(r+="}"),t[4]&&(r+="}"),r})).join("")},t.i=function(e,r,n,o,s){"string"==typeof e&&(e=[[null,e,void 0]]);var a={};if(n)for(var i=0;i<this.length;i++){var c=this[i][0];null!=c&&(a[c]=!0)}for(var l=0;l<e.length;l++){var u=[].concat(e[l]);n&&a[u[0]]||(void 0!==s&&(void 0===u[5]||(u[1]="@layer".concat(u[5].length>0?" ".concat(u[5]):""," {").concat(u[1],"}")),u[5]=s),r&&(u[2]?(u[1]="@media ".concat(u[2]," {").concat(u[1],"}"),u[2]=r):u[2]=r),o&&(u[4]?(u[1]="@supports (".concat(u[4],") {").concat(u[1],"}"),u[4]=o):u[4]="".concat(o)),t.push(u))}},t}},601:e=>{e.exports=function(e){return e[1]}},338:(e,t,r)=>{var n=r(845);t.createRoot=n.createRoot,t.hydrateRoot=n.hydrateRoot},20:(e,t,r)=>{var n=r(883),o=Symbol.for("react.element"),s=Symbol.for("react.fragment"),a=Object.prototype.hasOwnProperty,i=n.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,c={key:!0,ref:!0,__self:!0,__source:!0};function l(e,t,r){var n,s={},l=null,u=null;for(n in void 0!==r&&(l=""+r),void 0!==t.key&&(l=""+t.key),void 0!==t.ref&&(u=t.ref),t)a.call(t,n)&&!c.hasOwnProperty(n)&&(s[n]=t[n]);if(e&&e.defaultProps)for(n in t=e.defaultProps)void 0===s[n]&&(s[n]=t[n]);return{$$typeof:o,type:e,key:l,ref:u,props:s,_owner:i.current}}t.Fragment=s,t.jsx=l,t.jsxs=l},848:(e,t,r)=>{e.exports=r(20)},966:(e,t,r)=>{r.r(t),r.d(t,{default:()=>y});var n=r(72),o=r.n(n),s=r(825),a=r.n(s),i=r(659),c=r.n(i),l=r(56),u=r.n(l),d=r(540),f=r.n(d),h=r(113),m=r.n(h),p=r(919),v={};v.styleTagTransform=m(),v.setAttributes=u(),v.insert=c().bind(null,"head"),v.domAPI=a(),v.insertStyleElement=f(),o()(p.A,v);const y=p.A&&p.A.locals?p.A.locals:void 0},72:e=>{var t=[];function r(e){for(var r=-1,n=0;n<t.length;n++)if(t[n].identifier===e){r=n;break}return r}function n(e,n){for(var s={},a=[],i=0;i<e.length;i++){var c=e[i],l=n.base?c[0]+n.base:c[0],u=s[l]||0,d="".concat(l," ").concat(u);s[l]=u+1;var f=r(d),h={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(-1!==f)t[f].references++,t[f].updater(h);else{var m=o(h,n);n.byIndex=i,t.splice(i,0,{identifier:d,updater:m,references:1})}a.push(d)}return a}function o(e,t){var r=t.domAPI(t);return r.update(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap&&t.supports===e.supports&&t.layer===e.layer)return;r.update(e=t)}else r.remove()}}e.exports=function(e,o){var s=n(e=e||[],o=o||{});return function(e){e=e||[];for(var a=0;a<s.length;a++){var i=r(s[a]);t[i].references--}for(var c=n(e,o),l=0;l<s.length;l++){var u=r(s[l]);0===t[u].references&&(t[u].updater(),t.splice(u,1))}s=c}}},659:e=>{var t={};e.exports=function(e,r){var n=function(e){if(void 0===t[e]){var r=document.querySelector(e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}t[e]=r}return t[e]}(e);if(!n)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");n.appendChild(r)}},540:e=>{e.exports=function(e){var t=document.createElement("style");return e.setAttributes(t,e.attributes),e.insert(t,e.options),t}},56:(e,t,r)=>{e.exports=function(e){var t=r.nc;t&&e.setAttribute("nonce",t)}},825:e=>{e.exports=function(e){if("undefined"==typeof document)return{update:function(){},remove:function(){}};var t=e.insertStyleElement(e);return{update:function(r){!function(e,t,r){var n="";r.supports&&(n+="@supports (".concat(r.supports,") {")),r.media&&(n+="@media ".concat(r.media," {"));var o=void 0!==r.layer;o&&(n+="@layer".concat(r.layer.length>0?" ".concat(r.layer):""," {")),n+=r.css,o&&(n+="}"),r.media&&(n+="}"),r.supports&&(n+="}");var s=r.sourceMap;s&&"undefined"!=typeof btoa&&(n+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(s))))," */")),t.styleTagTransform(n,e,t.options)}(t,e,r)},remove:function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(t)}}}},113:e=>{e.exports=function(e,t){if(t.styleSheet)t.styleSheet.cssText=e;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(e))}}},759:function(e,t,r){var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const o=r(848),s=r(883),a=r(12),i=r(6);r(966);const c=n(r(771)),l=n(r(210));t.default=function({float:e}){const t=(0,s.useMemo)((()=>new a.UserProvider),[]),r=(0,s.useMemo)((()=>new i.SystemProvider),[]),[n,u]=(0,s.useState)(t.get()),[d,f]=(0,s.useState)(r.get()),[h,m]=(0,s.useState)(!1),p=n??d;return(0,s.useEffect)((()=>{document.body.setAttribute("data-theme",p),t.on("change",u),r.on("change",f),r.watch()}),[p,t,r]),(0,o.jsxs)("div",{className:"themeSwitcher","data-testid":"theme-switcher","data-float":e,onClick:()=>{m(!h)},children:[(0,o.jsx)(c.default,{theme:p}),h?(0,o.jsx)(l.default,{currentUserTheme:n,onListItemClick:e=>{t.set(e),m(!1)}}):null]})}},771:function(e,t,r){var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const o=r(848),s=n(r(77)),a=n(r(277)),i=n(r(950));t.default=function({theme:e}){switch(e){case"light":return(0,o.jsx)(a.default,{});case"dark":return(0,o.jsx)(s.default,{});default:return(0,o.jsx)(i.default,{})}}},210:function(e,t,r){var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0});const o=r(848),s=r(48),a=n(r(771)),i=n(r(625));t.default=function({currentUserTheme:e,onListItemClick:t}){return(0,o.jsx)("ul",{"data-testid":"theme-selector",children:[...s.themes,void 0].map((r=>{const n=(0,s.getThemeName)(r);return(0,o.jsxs)("li",{"data-testid":`theme-item-${n.toLowerCase()}`,onClick:()=>{t(r)},children:[(0,o.jsx)(a.default,{theme:r}),(0,o.jsx)("span",{children:n}),e===r&&(0,o.jsx)(i.default,{})]},n)}))})}},625:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(848);t.default=function(){return(0,n.jsx)("svg",{viewBox:"0 0 640 540",xmlns:"http://www.w3.org/2000/svg",className:"checked",children:(0,n.jsx)("path",{fill:"currentColor",d:"\n\t\t\t\t\tM 12,370\n\t\t\t\t\t\ta 40,40,0,0,1,56.56,-56.56\n\t\t\t\t\t\tl 130,130\n\t\t\t\t\t\tl 370,-430\n\t\t\t\t\t\ta 40,40,0,0,1,56.56,56.56\n\t\t\t\t\t\tl -398.28,458.28\n\t\t\t\t\t\ta 40,40,0,0,1,-56.56,0\n\t\t\t\t\t\tl -140,-140\n\t\t\t\t\tZ"})})}},77:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(848);t.default=function(){return(0,n.jsxs)("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"dark",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[(0,n.jsx)("circle",{cx:"50",cy:"50",r:"46",strokeDasharray:"180",transform:"rotate(22.5 50 50)"}),(0,n.jsx)("circle",{cx:"75",cy:"25",r:"46",strokeDasharray:"108 200",transform:"rotate(67.5 75 25)"})]})}},277:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(848);t.default=function(){return(0,n.jsxs)("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"light",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[(0,n.jsx)("circle",{cx:"50",cy:"50",r:"20"}),(0,n.jsx)("path",{d:"M 50 86 v 10",transform:"rotate(0 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 10",transform:"rotate(90 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 10",transform:"rotate(180 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 10",transform:"rotate(270 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 15",transform:"rotate(45 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 15",transform:"rotate(135 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 15",transform:"rotate(225 50 50)"}),(0,n.jsx)("path",{d:"M 50 86 v 15",transform:"rotate(315 50 50)"})]})}},950:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0});const n=r(848);t.default=function(){return(0,n.jsxs)("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"system",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[(0,n.jsx)("circle",{cx:"50",cy:"50",r:"46"}),(0,n.jsx)("path",{strokeWidth:"0",fill:"currentColor",d:"\n\t\t\t\t\tM 50,0\n\t\t\t\t\t\ta 50,50,0,1,1,0,100\n\t\t\t\t\tZ"})]})}},443:function(e,t,r){var n=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(t,"__esModule",{value:!0}),t.ThemeSwitcher=t.ThemeSwitcherElement=void 0;const o=r(848),s=r(883),a=r(338),i=n(r(759));t.ThemeSwitcher=i.default,t.ThemeSwitcherElement=class{props;constructor(e){this.props=e}render(e){(0,a.createRoot)(e).render((0,o.jsx)(s.StrictMode,{children:(0,o.jsx)(i.default,{...this.props})}))}}},875:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.EventEmitter=void 0,t.EventEmitter=class{listeners={};on(e,t){(this.listeners[e]??=[]).push(t)}off(e,t){const r=this.listeners[e]??=[];r.splice(r.indexOf(t),1)}emit(e,...t){this.listeners[e]?.forEach((e=>{e(...t)}))}}},48:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.getThemeName=t.isTheme=t.defaultTheme=t.themes=void 0;const r=["light","dark"];t.themes=r,t.defaultTheme="light",t.isTheme=function(e){return"string"==typeof e&&r.includes(e)},t.getThemeName=function(e){switch(e){case"light":return"Light";case"dark":return"Dark";default:return"System"}}},6:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.SystemProvider=void 0;const n=r(875),o=r(48);class s extends n.EventEmitter{get(){if(!("matchMedia"in window))return o.defaultTheme;for(const e of o.themes)if(window.matchMedia(`(prefers-color-scheme: ${e})`).matches)return e;return o.defaultTheme}watch(){if("matchMedia"in window)for(const e of o.themes)window.matchMedia(`(prefers-color-scheme: ${e})`).addEventListener("change",(t=>{t.matches&&this.emit("change",e)}))}}t.SystemProvider=s},12:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.UserProvider=void 0;const n=r(875),o=r(48);class s extends n.EventEmitter{storageKey="theme";get(){const e=localStorage.getItem(this.storageKey);return(0,o.isTheme)(e)?e:void 0}set(e){e?localStorage.setItem(this.storageKey,e):localStorage.removeItem(this.storageKey),this.emit("change",e)}}t.UserProvider=s},883:t=>{t.exports=e},845:e=>{e.exports=t}},n={};function o(e){var t=n[e];if(void 0!==t)return t.exports;var s=n[e]={id:e,exports:{}};return r[e].call(s.exports,s,s.exports,o),s.exports}return o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var r in t)o.o(t,r)&&!o.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.nc=void 0,o(443)})()));

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@anmiles/theme-switcher",
-	"version": "1.0.1",
+	"version": "1.0.2",
 	"description": "Theme switcher for websites",
 	"keywords": [
 		"theme",