// @license © 2019 Google LLC. Licensed under the Apache License, Version 2.0. const e=document;let t={};try{t=localStorage}catch(e){}const i="prefers-color-scheme";const a="media";const s="light";const r="dark";const o=`(${i}:${r})`;const n=`(${i}:${s})`;const l="link[rel=stylesheet]";const h="remember";const c="legend";const d="toggle";const b="switch";const p="appearance";const g="permanent";const m="mode";const u="colorschemechange";const f="permanentcolorscheme";const k="all";const v="not all";const $="dark-mode-toggle";const L="https://googlechromelabs.github.io/dark-mode-toggle/demo/";const y=(e,t,i=t)=>{Object.defineProperty(e,i,{enumerable:true,get(){const e=this.getAttribute(t);return e===null?"":e},set(e){this.setAttribute(t,e)}})};const x=(e,t,i=t)=>{Object.defineProperty(e,i,{enumerable:true,get(){return this.hasAttribute(t)},set(e){if(e){this.setAttribute(t,"")}else{this.removeAttribute(t)}}})};const w=e.createElement("template");w.innerHTML=`
`;export class DarkModeToggle extends HTMLElement{static get observedAttributes(){return[m,p,g,c,s,r,h]}constructor(){super();y(this,m);y(this,p);y(this,c);y(this,s);y(this,r);y(this,h);x(this,g);this.t=null;this.i=null;e.addEventListener(u,(e=>{this.mode=e.detail.colorScheme;this.o();this.l()}));e.addEventListener(f,(e=>{this.permanent=e.detail.permanent;this.h.checked=this.permanent}));this.p()}p(){const t=this.attachShadow({mode:"open"});t.append(w.content.cloneNode(true));this.t=e.querySelectorAll(`${l}[${a}*=${i}][${a}*="${r}"]`);this.i=e.querySelectorAll(`${l}[${a}*=${i}][${a}*="${s}"]`);this.m=t.querySelector("[part=lightRadio]");this.u=t.querySelector("[part=lightLabel]");this.k=t.querySelector("[part=darkRadio]");this.v=t.querySelector("[part=darkLabel]");this.$=t.querySelector("[part=toggleCheckbox]");this.L=t.querySelector("[part=toggleLabel]");this.C=t.querySelector("legend");this.M=t.querySelector("aside");this.h=t.querySelector("[part=permanentCheckbox]");this.R=t.querySelector("[part=permanentLabel]")}connectedCallback(){const e=matchMedia(o).media!==v;if(e){matchMedia(o).addListener((({matches:e})=>{if(this.permanent){return}this.mode=e?r:s;this._(u,{colorScheme:this.mode})}))}let i=false;try{i=t.getItem($)}catch(e){}if(i&&[r,s].includes(i)){this.mode=i;this.h.checked=true;this.permanent=true}else if(e){this.mode=matchMedia(n).matches?s:r}if(!this.mode){this.mode=s}if(this.permanent&&!i){try{t.setItem($,this.mode)}catch(e){}}if(!this.appearance){this.appearance=d}this.A();this.o();this.l();[this.m,this.k].forEach((e=>{e.addEventListener("change",(()=>{this.mode=this.m.checked?s:r;this.l();this._(u,{colorScheme:this.mode})}))}));this.$.addEventListener("change",(()=>{this.mode=this.$.checked?r:s;this.o();this._(u,{colorScheme:this.mode})}));this.h.addEventListener("change",(()=>{this.permanent=this.h.checked;this._(f,{permanent:this.permanent})}));this.S();this._(u,{colorScheme:this.mode});this._(f,{permanent:this.permanent})}attributeChangedCallback(e,i,a){if(e===m){if(![s,r].includes(a)){throw new RangeError(`Allowed values: "${s}" and "${r}".`)}if(matchMedia("(hover:none)").matches&&this.remember){this.T()}if(this.permanent){try{t.setItem($,this.mode)}catch(e){}}this.o();this.l();this.S()}else if(e===p){if(![d,b].includes(a)){throw new RangeError(`Allowed values: "${d}" and "${b}".`)}this.A()}else if(e===g){if(this.permanent){if(this.mode){try{t.setItem($,this.mode)}catch(e){}}}else{try{t.removeItem($)}catch(e){}}this.h.checked=this.permanent}else if(e===c){this.C.textContent=a}else if(e===h){this.R.textContent=a}else if(e===s){this.u.textContent=a;if(this.mode===s){this.L.textContent=a}}else if(e===r){this.v.textContent=a;if(this.mode===r){this.L.textContent=a}}}_(e,t){this.dispatchEvent(new CustomEvent(e,{bubbles:true,composed:true,detail:t}))}A(){const e=this.appearance===d;this.m.hidden=e;this.u.hidden=e;this.k.hidden=e;this.v.hidden=e;this.$.hidden=!e;this.L.hidden=!e}o(){if(this.mode===s){this.m.checked=true}else{this.k.checked=true}}l(){if(this.mode===s){this.L.style.setProperty(`--${$}-checkbox-icon`,`var(--${$}-light-icon,url("${L}moon.png"))`);this.L.textContent=this.light;if(!this.light){this.L.ariaLabel=r}this.$.checked=false}else{this.L.style.setProperty(`--${$}-checkbox-icon`,`var(--${$}-dark-icon,url("${L}sun.png"))`);this.L.textContent=this.dark;if(!this.dark){this.L.ariaLabel=s}this.$.checked=true}}S(){if(this.mode===s){this.i.forEach((e=>{e.media=k;e.disabled=false}));this.t.forEach((e=>{e.media=v;e.disabled=true}))}else{this.t.forEach((e=>{e.media=k;e.disabled=false}));this.i.forEach((e=>{e.media=v;e.disabled=true}))}}T(){this.M.style.visibility="visible";setTimeout((()=>{this.M.style.visibility="hidden"}),3e3)}}customElements.define($,DarkModeToggle);