@anmiles/theme-switcher 2.0.3 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +4 -0
- package/dist/{theme-switcher-2.0.3.js → theme-switcher-2.0.4.js} +3 -3
- package/dist/theme-switcher-2.0.4.min.js +14 -0
- package/package.json +34 -34
- package/src/components/ThemeSelector.tsx +1 -1
- package/src/components/__tests__/App.test.tsx +2 -2
- package/src/components/__tests__/__snapshots__/App.test.tsx.snap +1 -1
- package/src/lib/eventEmitter.ts +3 -3
- package/src/providers/__tests__/systemProvider.test.ts +1 -1
- package/dist/theme-switcher-2.0.3.min.js +0 -14
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
|
|
|
5
5
|
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
|
6
6
|
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
7
7
|
|
|
8
|
+
## [2.0.4](../../tags/v2.0.4) - 2026-02-01
|
|
9
|
+
### Changed
|
|
10
|
+
- Fix vulnerable dependencies
|
|
11
|
+
|
|
8
12
|
## [2.0.3](../../tags/v2.0.3) - 2025-11-29
|
|
9
13
|
### Changed
|
|
10
14
|
- Fix vulnerable dependencies
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var ThemeSwitcher = function(exports, require$$0, require$$0$1) {
|
|
1
|
+
var ThemeSwitcher = (function(exports, require$$0, require$$0$1) {
|
|
2
2
|
"use strict";
|
|
3
3
|
var __vite_style__ = document.createElement("style");
|
|
4
4
|
__vite_style__.textContent = '.themeSwitcher {\n cursor: pointer;\n position: relative;\n}\n\n.themeSwitcher > svg:hover,\n.themeSwitcher li:hover {\n filter: brightness(1.5);\n}\n\n.themeSwitcher svg {\n width: 2em;\n height: 2em;\n stroke: currentColor;\n display: block;\n}\n\n.themeSwitcher ul {\n list-style-type: none;\n position: absolute;\n left: 0;\n margin: 0.5em 0;\n padding: 0;\n gap: 0;\n overflow-y: visible;\n z-index: 1;\n}\n\n.themeSwitcher li {\n padding: 0.5em 1em;\n}\n\n.themeSwitcher[data-float="right"] ul {\n left: auto;\n right: 0;\n}\n\n.themeSwitcher li {\n display: flex;\n align-items: center;\n gap: 0.5em;\n}\n\n.themeSwitcher li svg {\n width: 1.5em;\n height: 1.5em;\n}\n\n.themeSwitcher svg.checked {\n width: 16px;\n height: 13.5px;\n}\n/*$vite$:1*/';
|
|
@@ -9,7 +9,7 @@ var ThemeSwitcher = function(exports, require$$0, require$$0$1) {
|
|
|
9
9
|
function requireReactJsxRuntime_production_min() {
|
|
10
10
|
if (hasRequiredReactJsxRuntime_production_min) return reactJsxRuntime_production_min;
|
|
11
11
|
hasRequiredReactJsxRuntime_production_min = 1;
|
|
12
|
-
var f = require$$0, k = Symbol.for("react.element"), l = Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
|
|
12
|
+
var f = require$$0, k = /* @__PURE__ */ Symbol.for("react.element"), l = /* @__PURE__ */ Symbol.for("react.fragment"), m = Object.prototype.hasOwnProperty, n = f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, p = { key: true, ref: true, __self: true, __source: true };
|
|
13
13
|
function q(c, a, g) {
|
|
14
14
|
var b, d = {}, e = null, h = null;
|
|
15
15
|
void 0 !== g && (e = "" + g);
|
|
@@ -292,4 +292,4 @@ var ThemeSwitcher = function(exports, require$$0, require$$0$1) {
|
|
|
292
292
|
exports.ThemeSwitcher = App;
|
|
293
293
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
294
294
|
return exports;
|
|
295
|
-
}({}, React, ReactDOM);
|
|
295
|
+
})({}, React, ReactDOM);
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
var ThemeSwitcher=(function(m,a,T){"use strict";var y=document.createElement("style");y.textContent=`.themeSwitcher{cursor:pointer;position:relative}.themeSwitcher>svg:hover,.themeSwitcher li:hover{filter:brightness(1.5)}.themeSwitcher svg{width:2em;height:2em;stroke:currentColor;display:block}.themeSwitcher ul{list-style-type:none;position:absolute;left:0;margin:.5em 0;padding:0;gap:0;overflow-y:visible;z-index:1}.themeSwitcher li{padding:.5em 1em}.themeSwitcher[data-float=right] ul{left:auto;right:0}.themeSwitcher li{display:flex;align-items:center;gap:.5em}.themeSwitcher li svg{width:1.5em;height:1.5em}.themeSwitcher svg.checked{width:16px;height:13.5px}
|
|
2
|
+
/*$vite$:1*/`,document.head.appendChild(y);var x={exports:{}},l={};var j;function C(){if(j)return l;j=1;var s=a,t=Symbol.for("react.element"),r=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,v=s.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,w={key:!0,ref:!0,__self:!0,__source:!0};function f(c,o,h){var i,p={},g=null,E=null;h!==void 0&&(g=""+h),o.key!==void 0&&(g=""+o.key),o.ref!==void 0&&(E=o.ref);for(i in o)n.call(o,i)&&!w.hasOwnProperty(i)&&(p[i]=o[i]);if(c&&c.defaultProps)for(i in o=c.defaultProps,o)p[i]===void 0&&(p[i]=o[i]);return{$$typeof:t,type:c,key:g,ref:E,props:p,_owner:v.current}}return l.Fragment=r,l.jsx=f,l.jsxs=f,l}var S;function b(){return S||(S=1,x.exports=C()),x.exports}var e=b(),d={},k;function O(){if(k)return d;k=1;var s=T;return d.createRoot=s.createRoot,d.hydrateRoot=s.hydrateRoot,d}var N=O();class _{constructor(){this.listeners={}}on(t,r){(this.listeners[t]??=[]).push(r)}off(t,r){const n=this.listeners[t]??=[];n.splice(n.indexOf(r),1)}emit(t,...r){this.listeners[t]?.forEach(n=>{n(...r)})}}const u=["light","dark"],R="light";function P(s){return typeof s=="string"&&u.map(String).includes(s)}function I(s){switch(s){case"light":return"Light";case"dark":return"Dark";default:return"System"}}class D extends _{get(){if(!("matchMedia"in window))return R;for(const t of u)if(window.matchMedia(`(prefers-color-scheme: ${t})`).matches)return t;return R}watch(){if("matchMedia"in window)for(const t of u)window.matchMedia(`(prefers-color-scheme: ${t})`).addEventListener("change",n=>{n.matches&&this.emit("change",t)})}}class B extends _{constructor(){super(...arguments),this.storageKey="theme"}get(){const t=localStorage.getItem(this.storageKey);return P(t)?t:void 0}set(t){t?localStorage.setItem(this.storageKey,t):localStorage.removeItem(this.storageKey),this.emit("change",t)}}function J(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"dark",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"46",strokeDasharray:"180",transform:"rotate(22.5 50 50)"}),e.jsx("circle",{cx:"75",cy:"25",r:"46",strokeDasharray:"108 200",transform:"rotate(67.5 75 25)"})]})}function U(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"light",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"20"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(0 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(90 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(180 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(270 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(45 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(135 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(225 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(315 50 50)"})]})}function W(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"system",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"46"}),e.jsx("path",{strokeWidth:"0",fill:"currentColor",d:`
|
|
3
|
+
M 50,0
|
|
4
|
+
a 50,50,0,1,1,0,100
|
|
5
|
+
Z`})]})}function M({theme:s}){switch(s){case"light":return e.jsx(U,{});case"dark":return e.jsx(J,{});default:return e.jsx(W,{})}}function K(){return e.jsx("svg",{viewBox:"0 0 640 540",xmlns:"http://www.w3.org/2000/svg",className:"checked",children:e.jsx("path",{fill:"currentColor",d:`
|
|
6
|
+
M 12,370
|
|
7
|
+
a 40,40,0,0,1,56.56,-56.56
|
|
8
|
+
l 130,130
|
|
9
|
+
l 370,-430
|
|
10
|
+
a 40,40,0,0,1,56.56,56.56
|
|
11
|
+
l -398.28,458.28
|
|
12
|
+
a 40,40,0,0,1,-56.56,0
|
|
13
|
+
l -140,-140
|
|
14
|
+
Z`})})}function Q({currentUserTheme:s,onListItemClick:t}){return e.jsx("ul",{"data-testid":"theme-selector",children:[...u,void 0].map(r=>{const n=I(r);return e.jsxs("li",{"data-testid":`theme-item-${n.toLowerCase()}`,onClick:()=>{t(r)},children:[e.jsx(M,{theme:r}),e.jsx("span",{children:n}),s===r&&e.jsx(K,{})]},n)})})}function L({float:s}){const t=a.useMemo(()=>new B,[]),r=a.useMemo(()=>new D,[]),[n,v]=a.useState(t.get()),[w,f]=a.useState(r.get()),[c,o]=a.useState(!1),h=n??w;return a.useEffect(()=>{document.body.setAttribute("data-theme",h),t.on("change",v),r.on("change",f),r.watch()},[h,t,r]),e.jsxs("div",{className:"themeSwitcher","data-testid":"theme-switcher","data-float":s,onClick:()=>{o(!c)},children:[e.jsx(M,{theme:h}),c?e.jsx(Q,{currentUserTheme:n,onListItemClick:i=>{t.set(i),o(!1)}}):null]})}class A{constructor(t){this.props=t}render(t){N.createRoot(t).render(e.jsx(a.StrictMode,{children:e.jsx(L,{...this.props})}))}}return m.Element=A,m.ThemeSwitcher=L,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"}),m})({},React,ReactDOM);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@anmiles/theme-switcher",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.4",
|
|
4
4
|
"description": "Theme switcher for websites",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"theme",
|
|
@@ -35,57 +35,57 @@
|
|
|
35
35
|
"start:prod": "npm start production"
|
|
36
36
|
},
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@anmiles/express-tools": "^2.0.
|
|
39
|
-
"@anmiles/logger": "^8.0.
|
|
40
|
-
"express": "^5.1
|
|
38
|
+
"@anmiles/express-tools": "^2.0.5",
|
|
39
|
+
"@anmiles/logger": "^8.0.3",
|
|
40
|
+
"express": "^5.2.1",
|
|
41
41
|
"npm-run-all": "^4.1.5",
|
|
42
42
|
"react": "^18.3.1",
|
|
43
43
|
"react-dom": "^18.3.1"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
|
-
"@anmiles/eslint-config": "^
|
|
47
|
-
"@anmiles/tsconfig": "^4.0.
|
|
48
|
-
"@eslint/compat": "^
|
|
49
|
-
"@eslint/css": "^0.
|
|
50
|
-
"@eslint/js": "^9.
|
|
51
|
-
"@eslint/json": "^0.
|
|
52
|
-
"@eslint/markdown": "^7.1
|
|
53
|
-
"@stylistic/eslint-plugin": "^5.
|
|
54
|
-
"@testing-library/dom": "^10.4.
|
|
55
|
-
"@testing-library/jest-dom": "^6.
|
|
56
|
-
"@testing-library/react": "^16.3.
|
|
46
|
+
"@anmiles/eslint-config": "^10.0.3",
|
|
47
|
+
"@anmiles/tsconfig": "^4.0.1",
|
|
48
|
+
"@eslint/compat": "^2.0.2",
|
|
49
|
+
"@eslint/css": "^0.14.1",
|
|
50
|
+
"@eslint/js": "^9.39.2",
|
|
51
|
+
"@eslint/json": "^1.0.0",
|
|
52
|
+
"@eslint/markdown": "^7.5.1",
|
|
53
|
+
"@stylistic/eslint-plugin": "^5.7.1",
|
|
54
|
+
"@testing-library/dom": "^10.4.1",
|
|
55
|
+
"@testing-library/jest-dom": "^6.9.1",
|
|
56
|
+
"@testing-library/react": "^16.3.2",
|
|
57
57
|
"@types/jest": "^30.0.0",
|
|
58
58
|
"@types/react": "^18.3.20",
|
|
59
59
|
"@types/react-dom": "^18.3.6",
|
|
60
|
-
"@typescript-eslint/eslint-plugin": "^8.
|
|
61
|
-
"@typescript-eslint/parser": "^8.
|
|
62
|
-
"@vitejs/plugin-react": "^
|
|
63
|
-
"cspell": "^9.2
|
|
64
|
-
"css-loader": "^7.1.
|
|
65
|
-
"eslint": "^9.
|
|
60
|
+
"@typescript-eslint/eslint-plugin": "^8.54.0",
|
|
61
|
+
"@typescript-eslint/parser": "^8.54.0",
|
|
62
|
+
"@vitejs/plugin-react": "^5.1.2",
|
|
63
|
+
"cspell": "^9.6.2",
|
|
64
|
+
"css-loader": "^7.1.3",
|
|
65
|
+
"eslint": "^9.39.2",
|
|
66
66
|
"eslint-import-resolver-typescript": "^4.4.4",
|
|
67
67
|
"eslint-plugin-align-assignments": "^1.1.2",
|
|
68
68
|
"eslint-plugin-i18next": "^6.1.3",
|
|
69
69
|
"eslint-plugin-import": "^2.32.0",
|
|
70
|
-
"eslint-plugin-jest": "^29.
|
|
71
|
-
"eslint-plugin-n": "^17.
|
|
70
|
+
"eslint-plugin-jest": "^29.12.1",
|
|
71
|
+
"eslint-plugin-n": "^17.23.2",
|
|
72
72
|
"eslint-plugin-promise": "^7.2.1",
|
|
73
73
|
"eslint-plugin-react": "^7.37.5",
|
|
74
|
-
"eslint-plugin-react-hooks": "^
|
|
74
|
+
"eslint-plugin-react-hooks": "^7.0.1",
|
|
75
75
|
"eslint-plugin-react-redux": "^4.2.2",
|
|
76
76
|
"eslint-plugin-react-refresh": "^0.4.20",
|
|
77
|
-
"jest": "^30.0
|
|
78
|
-
"jest-environment-jsdom": "^30.0
|
|
79
|
-
"jiti": "^2.
|
|
77
|
+
"jest": "^30.2.0",
|
|
78
|
+
"jest-environment-jsdom": "^30.2.0",
|
|
79
|
+
"jiti": "^2.6.1",
|
|
80
80
|
"nyc": "^17.1.0",
|
|
81
|
-
"react-refresh": "^0.
|
|
82
|
-
"react-refresh-typescript": "^2.0.
|
|
83
|
-
"rimraf": "^6.
|
|
81
|
+
"react-refresh": "^0.18.0",
|
|
82
|
+
"react-refresh-typescript": "^2.0.11",
|
|
83
|
+
"rimraf": "^6.1.2",
|
|
84
84
|
"style-loader": "^4.0.0",
|
|
85
|
-
"ts-jest": "^29.4.
|
|
86
|
-
"ts-loader": "^9.5.
|
|
87
|
-
"typescript": "^5.
|
|
88
|
-
"vite": "^7.
|
|
85
|
+
"ts-jest": "^29.4.6",
|
|
86
|
+
"ts-loader": "^9.5.4",
|
|
87
|
+
"typescript": "^5.9.3",
|
|
88
|
+
"vite": "^7.3.1",
|
|
89
89
|
"vite-plugin-lib-inject-css": "^2.2.2"
|
|
90
90
|
}
|
|
91
91
|
}
|
|
@@ -6,7 +6,7 @@ import Checked from './icons/Checked';
|
|
|
6
6
|
|
|
7
7
|
interface ThemeSelectorProps {
|
|
8
8
|
readonly currentUserTheme: Theme | undefined;
|
|
9
|
-
readonly onListItemClick: (theme: Theme | undefined)=> void;
|
|
9
|
+
readonly onListItemClick: (theme: Theme | undefined) => void;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
12
|
export default function ThemeSelector({ currentUserTheme, onListItemClick }: ThemeSelectorProps) {
|
|
@@ -56,9 +56,9 @@ jest.mocked(Light).mockReturnValue(<div data-testid="mock-icon-light" />);
|
|
|
56
56
|
jest.mocked(System).mockReturnValue(<div data-testid="mock-icon-system" />);
|
|
57
57
|
|
|
58
58
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion
|
|
59
|
-
jest.mocked(UserProvider).
|
|
59
|
+
jest.mocked(UserProvider).mockReturnValue(userProvider as UserProvider);
|
|
60
60
|
// eslint-disable-next-line @typescript-eslint/no-unsafe-type-assertion
|
|
61
|
-
jest.mocked(SystemProvider).
|
|
61
|
+
jest.mocked(SystemProvider).mockReturnValue(systemProvider as SystemProvider);
|
|
62
62
|
|
|
63
63
|
afterEach(() => {
|
|
64
64
|
document.body.removeAttribute('data-theme');
|
package/src/lib/eventEmitter.ts
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
export class EventEmitter<TEventMap extends Record<string, Array<unknown>>> {
|
|
2
2
|
private readonly listeners: {
|
|
3
|
-
[TEvent in keyof TEventMap]?: Array<(...data: TEventMap[TEvent])=> void>
|
|
3
|
+
[TEvent in keyof TEventMap]?: Array<(...data: TEventMap[TEvent]) => void>
|
|
4
4
|
} = {};
|
|
5
5
|
|
|
6
6
|
public on<TEvent extends keyof TEventMap>(
|
|
7
7
|
event: TEvent,
|
|
8
|
-
listener: (...data: TEventMap[TEvent])=> void,
|
|
8
|
+
listener: (...data: TEventMap[TEvent]) => void,
|
|
9
9
|
): void {
|
|
10
10
|
const listeners = this.listeners[event] ??= [];
|
|
11
11
|
listeners.push(listener);
|
|
@@ -13,7 +13,7 @@ export class EventEmitter<TEventMap extends Record<string, Array<unknown>>> {
|
|
|
13
13
|
|
|
14
14
|
public off<TEvent extends keyof TEventMap>(
|
|
15
15
|
event: TEvent,
|
|
16
|
-
listener: (...data: TEventMap[TEvent])=> void,
|
|
16
|
+
listener: (...data: TEventMap[TEvent]) => void,
|
|
17
17
|
): void {
|
|
18
18
|
const listeners = this.listeners[event] ??= [];
|
|
19
19
|
listeners.splice(listeners.indexOf(listener), 1);
|
|
@@ -28,7 +28,7 @@ beforeEach(() => {
|
|
|
28
28
|
matches : parsedTheme === systemPreference,
|
|
29
29
|
addEventListener: (
|
|
30
30
|
event: keyof MediaQueryListEventMap,
|
|
31
|
-
listener: (ev: Partial<MediaQueryListEvent>)=> void,
|
|
31
|
+
listener: (ev: Partial<MediaQueryListEvent>) => void,
|
|
32
32
|
) => {
|
|
33
33
|
mediaQueryListEvents[parsedTheme].on(event, listener);
|
|
34
34
|
},
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
var ThemeSwitcher=function(m,a,T){"use strict";var y=document.createElement("style");y.textContent=`.themeSwitcher{cursor:pointer;position:relative}.themeSwitcher>svg:hover,.themeSwitcher li:hover{filter:brightness(1.5)}.themeSwitcher svg{width:2em;height:2em;stroke:currentColor;display:block}.themeSwitcher ul{list-style-type:none;position:absolute;left:0;margin:.5em 0;padding:0;gap:0;overflow-y:visible;z-index:1}.themeSwitcher li{padding:.5em 1em}.themeSwitcher[data-float=right] ul{left:auto;right:0}.themeSwitcher li{display:flex;align-items:center;gap:.5em}.themeSwitcher li svg{width:1.5em;height:1.5em}.themeSwitcher svg.checked{width:16px;height:13.5px}
|
|
2
|
-
/*$vite$:1*/`,document.head.appendChild(y);var x={exports:{}},l={};var j;function C(){if(j)return l;j=1;var s=a,t=Symbol.for("react.element"),r=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,v=s.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,w={key:!0,ref:!0,__self:!0,__source:!0};function f(c,o,h){var i,p={},g=null,E=null;h!==void 0&&(g=""+h),o.key!==void 0&&(g=""+o.key),o.ref!==void 0&&(E=o.ref);for(i in o)n.call(o,i)&&!w.hasOwnProperty(i)&&(p[i]=o[i]);if(c&&c.defaultProps)for(i in o=c.defaultProps,o)p[i]===void 0&&(p[i]=o[i]);return{$$typeof:t,type:c,key:g,ref:E,props:p,_owner:v.current}}return l.Fragment=r,l.jsx=f,l.jsxs=f,l}var S;function b(){return S||(S=1,x.exports=C()),x.exports}var e=b(),d={},k;function O(){if(k)return d;k=1;var s=T;return d.createRoot=s.createRoot,d.hydrateRoot=s.hydrateRoot,d}var N=O();class _{constructor(){this.listeners={}}on(t,r){(this.listeners[t]??=[]).push(r)}off(t,r){const n=this.listeners[t]??=[];n.splice(n.indexOf(r),1)}emit(t,...r){this.listeners[t]?.forEach(n=>{n(...r)})}}const u=["light","dark"],R="light";function P(s){return typeof s=="string"&&u.map(String).includes(s)}function I(s){switch(s){case"light":return"Light";case"dark":return"Dark";case void 0:default:return"System"}}class D extends _{get(){if(!("matchMedia"in window))return R;for(const t of u)if(window.matchMedia(`(prefers-color-scheme: ${t})`).matches)return t;return R}watch(){if("matchMedia"in window)for(const t of u)window.matchMedia(`(prefers-color-scheme: ${t})`).addEventListener("change",n=>{n.matches&&this.emit("change",t)})}}class B extends _{constructor(){super(...arguments),this.storageKey="theme"}get(){const t=localStorage.getItem(this.storageKey);return P(t)?t:void 0}set(t){t?localStorage.setItem(this.storageKey,t):localStorage.removeItem(this.storageKey),this.emit("change",t)}}function J(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"dark",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"46",strokeDasharray:"180",transform:"rotate(22.5 50 50)"}),e.jsx("circle",{cx:"75",cy:"25",r:"46",strokeDasharray:"108 200",transform:"rotate(67.5 75 25)"})]})}function U(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"light",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"20"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(0 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(90 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(180 50 50)"}),e.jsx("path",{d:"M 50 86 v 10",transform:"rotate(270 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(45 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(135 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(225 50 50)"}),e.jsx("path",{d:"M 50 86 v 15",transform:"rotate(315 50 50)"})]})}function W(){return e.jsxs("svg",{viewBox:"0 0 100 100",xmlns:"http://www.w3.org/2000/svg",className:"system",strokeWidth:"8",strokeLinecap:"round",fill:"none",children:[e.jsx("circle",{cx:"50",cy:"50",r:"46"}),e.jsx("path",{strokeWidth:"0",fill:"currentColor",d:`
|
|
3
|
-
M 50,0
|
|
4
|
-
a 50,50,0,1,1,0,100
|
|
5
|
-
Z`})]})}function M({theme:s}){switch(s){case"light":return e.jsx(U,{});case"dark":return e.jsx(J,{});case void 0:default:return e.jsx(W,{})}}function K(){return e.jsx("svg",{viewBox:"0 0 640 540",xmlns:"http://www.w3.org/2000/svg",className:"checked",children:e.jsx("path",{fill:"currentColor",d:`
|
|
6
|
-
M 12,370
|
|
7
|
-
a 40,40,0,0,1,56.56,-56.56
|
|
8
|
-
l 130,130
|
|
9
|
-
l 370,-430
|
|
10
|
-
a 40,40,0,0,1,56.56,56.56
|
|
11
|
-
l -398.28,458.28
|
|
12
|
-
a 40,40,0,0,1,-56.56,0
|
|
13
|
-
l -140,-140
|
|
14
|
-
Z`})})}function Q({currentUserTheme:s,onListItemClick:t}){return e.jsx("ul",{"data-testid":"theme-selector",children:[...u,void 0].map(r=>{const n=I(r);return e.jsxs("li",{"data-testid":`theme-item-${n.toLowerCase()}`,onClick:()=>{t(r)},children:[e.jsx(M,{theme:r}),e.jsx("span",{children:n}),s===r&&e.jsx(K,{})]},n)})})}function L({float:s}){const t=a.useMemo(()=>new B,[]),r=a.useMemo(()=>new D,[]),[n,v]=a.useState(t.get()),[w,f]=a.useState(r.get()),[c,o]=a.useState(!1),h=n??w;return a.useEffect(()=>{document.body.setAttribute("data-theme",h),t.on("change",v),r.on("change",f),r.watch()},[h,t,r]),e.jsxs("div",{className:"themeSwitcher","data-testid":"theme-switcher","data-float":s,onClick:()=>{o(!c)},children:[e.jsx(M,{theme:h}),c?e.jsx(Q,{currentUserTheme:n,onListItemClick:i=>{t.set(i),o(!1)}}):null]})}class A{constructor(t){this.props=t}render(t){N.createRoot(t).render(e.jsx(a.StrictMode,{children:e.jsx(L,{...this.props})}))}}return m.Element=A,m.ThemeSwitcher=L,Object.defineProperty(m,Symbol.toStringTag,{value:"Module"}),m}({},React,ReactDOM);
|