@m00rl0ck/a11y-widget 0.1.0 → 0.3.0

package/dist/index.js

@@ -1,4 +1,4 @@
-var b=Object.defineProperty;var g=(o,t,e)=>t in o?b(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e;var d=(o,t,e)=>g(o,typeof t!="symbol"?t+"":t,e);var n={uk:{panelTitle:"\u041B\u044E\u0434\u044F\u043C \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443",panelSubtitle:"\u041D\u0430\u043B\u0430\u0448\u0442\u0443\u0439\u0442\u0435 \u0440\u043E\u0437\u043C\u0456\u0440 \u0442\u0435\u043A\u0441\u0442\u0443, \u043A\u043E\u043D\u0442\u0440\u0430\u0441\u0442 \u0456 \u0447\u0438\u0442\u0430\u0431\u0435\u043B\u044C\u043D\u0456\u0441\u0442\u044C \u0441\u0430\u0439\u0442\u0443.",closeLabel:"\u0417\u0430\u043A\u0440\u0438\u0442\u0438 \u043F\u0430\u043D\u0435\u043B\u044C",fontSizeLabel:"\u0420\u043E\u0437\u043C\u0456\u0440 \u0448\u0440\u0438\u0444\u0442\u0443:",themeLabel:"\u041A\u043E\u043B\u0456\u0440 \u0441\u0430\u0439\u0442\u0443:",extraLabel:"\u0414\u043E\u0434\u0430\u0442\u043A\u043E\u0432\u043E:",readableFont:"\u041F\u0440\u043E\u0441\u0442\u0438\u0439 \u0448\u0440\u0438\u0444\u0442",letterSpacing:"\u0411\u0456\u043B\u044C\u0448\u0456 \u0456\u043D\u0442\u0435\u0440\u0432\u0430\u043B\u0438",reset:"\u0417\u0432\u0438\u0447\u0430\u0439\u043D\u0430 \u0432\u0435\u0440\u0441\u0456\u044F \u0441\u0430\u0439\u0442\u0443",toggleLabel:"\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u0430\u043B\u0430\u0448\u0442\u0443\u0432\u0430\u043D\u043D\u044F \u0434\u043B\u044F \u043B\u044E\u0434\u0435\u0439 \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443",toggleText:"\u041B\u044E\u0434\u044F\u043C \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443"},en:{panelTitle:"Vision Accessibility",panelSubtitle:"Adjust text size, contrast, and readability of the site.",closeLabel:"Close panel",fontSizeLabel:"Font size:",themeLabel:"Color scheme:",extraLabel:"Additional:",readableFont:"Readable font",letterSpacing:"Letter spacing",reset:"Default view",toggleLabel:"Open vision accessibility settings",toggleText:"Vision accessibility"},de:{panelTitle:"Barrierefreiheit",panelSubtitle:"Passen Sie Schriftgr\xF6\xDFe, Kontrast und Lesbarkeit der Seite an.",closeLabel:"Schlie\xDFen",fontSizeLabel:"Schriftgr\xF6\xDFe:",themeLabel:"Farbschema:",extraLabel:"Zus\xE4tzlich:",readableFont:"Lesbare Schrift",letterSpacing:"Buchstabenabstand",reset:"Standardansicht",toggleLabel:"Barrierefreiheit-Einstellungen \xF6ffnen",toggleText:"Barrierefreiheit"}};function h(){let t=(document.documentElement.lang||navigator.language||"en").slice(0,2).toLowerCase();return t in n?t:"en"}var r="vision-a11y-settings",p="vision-a11y-global-styles",c={fontSize:"normal",theme:"default",letterSpacing:!1,readableFont:!1},l=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this._state={...c,open:!1}}get lang(){return this.getAttribute("lang")||h()}t(t){let e=n[this.lang]||n.en;return this._getLabelOverrides()[t]||e[t]||t}_getLabelOverrides(){let t={"label-title":"panelTitle","label-subtitle":"panelSubtitle","label-reset":"reset"},e={};for(let[a,s]of Object.entries(t)){let i=this.getAttribute(a);i&&(e[s]=i)}return e}connectedCallback(){this._loadState(),this._render(),this._applySettings()}attributeChangedCallback(){this.shadowRoot.innerHTML&&this._render()}_loadState(){try{let t=JSON.parse(localStorage.getItem(r));t&&(this._state={...c,...t,open:!1})}catch{}}_saveState(){let{open:t,...e}=this._state;localStorage.setItem(r,JSON.stringify(e))}_setState(t){this._state={...this._state,...t},this._saveState(),this._render(),this._applySettings()}_reset(){localStorage.removeItem(r),this._state={...c,open:!1},this._render(),this._applySettings()}_applySettings(){let t=document.documentElement;t.classList.remove("va-font-normal","va-font-large","va-font-xlarge","va-theme-default","va-theme-contrast","va-theme-light","va-readable-font","va-letter-spacing"),t.classList.add(`va-font-${this._state.fontSize}`),t.classList.add(`va-theme-${this._state.theme}`),this._state.readableFont&&t.classList.add("va-readable-font"),this._state.letterSpacing&&t.classList.add("va-letter-spacing"),this._ensureGlobalStyles()}_ensureGlobalStyles(){if(document.getElementById(p))return;let t=document.createElement("style");t.id=p,t.textContent=`
+var L=Object.defineProperty;var k=(o,t,e)=>t in o?L(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e;var d=(o,t,e)=>k(o,typeof t!="symbol"?t+"":t,e);var p={uk:{panelTitle:"\u041B\u044E\u0434\u044F\u043C \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443",panelSubtitle:"\u041D\u0430\u043B\u0430\u0448\u0442\u0443\u0439\u0442\u0435 \u0440\u043E\u0437\u043C\u0456\u0440 \u0442\u0435\u043A\u0441\u0442\u0443, \u043A\u043E\u043D\u0442\u0440\u0430\u0441\u0442 \u0456 \u0447\u0438\u0442\u0430\u0431\u0435\u043B\u044C\u043D\u0456\u0441\u0442\u044C \u0441\u0430\u0439\u0442\u0443.",closeLabel:"\u0417\u0430\u043A\u0440\u0438\u0442\u0438 \u043F\u0430\u043D\u0435\u043B\u044C",fontSizeLabel:"\u0420\u043E\u0437\u043C\u0456\u0440 \u0448\u0440\u0438\u0444\u0442\u0443:",themeLabel:"\u041A\u043E\u043B\u0456\u0440 \u0441\u0430\u0439\u0442\u0443:",extraLabel:"\u0414\u043E\u0434\u0430\u0442\u043A\u043E\u0432\u043E:",readableFont:"\u041F\u0440\u043E\u0441\u0442\u0438\u0439 \u0448\u0440\u0438\u0444\u0442",letterSpacing:"\u0411\u0456\u043B\u044C\u0448\u0456 \u0456\u043D\u0442\u0435\u0440\u0432\u0430\u043B\u0438",reset:"\u0417\u0432\u0438\u0447\u0430\u0439\u043D\u0430 \u0432\u0435\u0440\u0441\u0456\u044F \u0441\u0430\u0439\u0442\u0443",toggleLabel:"\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u0430\u043B\u0430\u0448\u0442\u0443\u0432\u0430\u043D\u043D\u044F \u0434\u043B\u044F \u043B\u044E\u0434\u0435\u0439 \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443",toggleText:"\u041B\u044E\u0434\u044F\u043C \u0456\u0437 \u043F\u043E\u0440\u0443\u0448\u0435\u043D\u043D\u044F\u043C \u0437\u043E\u0440\u0443"},en:{panelTitle:"Vision Accessibility",panelSubtitle:"Adjust text size, contrast, and readability of the site.",closeLabel:"Close panel",fontSizeLabel:"Font size:",themeLabel:"Color scheme:",extraLabel:"Additional:",readableFont:"Readable font",letterSpacing:"Letter spacing",reset:"Default view",toggleLabel:"Open vision accessibility settings",toggleText:"Vision accessibility"},de:{panelTitle:"Barrierefreiheit",panelSubtitle:"Passen Sie Schriftgr\xF6\xDFe, Kontrast und Lesbarkeit der Seite an.",closeLabel:"Schlie\xDFen",fontSizeLabel:"Schriftgr\xF6\xDFe:",themeLabel:"Farbschema:",extraLabel:"Zus\xE4tzlich:",readableFont:"Lesbare Schrift",letterSpacing:"Buchstabenabstand",reset:"Standardansicht",toggleLabel:"Barrierefreiheit-Einstellungen \xF6ffnen",toggleText:"Barrierefreiheit"}};function x(){let t=(document.documentElement.lang||navigator.language||"en").slice(0,2).toLowerCase();return t in p?t:"en"}var f="vision-a11y-settings",y="vision-a11y-global-styles",g={fontSize:"normal",theme:"default",letterSpacing:!1,readableFont:!1},r=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this._state={...g,open:!1}}get lang(){return this.getAttribute("lang")||x()}t(t){let e=p[this.lang]||p.en;return this._getLabelOverrides()[t]||e[t]||t}_getLabelOverrides(){let t={"label-title":"panelTitle","label-subtitle":"panelSubtitle","label-reset":"reset"},e={};for(let[a,i]of Object.entries(t)){let s=this.getAttribute(a);s&&(e[i]=s)}return e}connectedCallback(){this._loadState(),this._render(),this._applySettings()}attributeChangedCallback(){this.shadowRoot.innerHTML&&this._render()}_loadState(){try{let t=JSON.parse(localStorage.getItem(f));t&&(this._state={...g,...t,open:!1})}catch{}}_saveState(){let{open:t,...e}=this._state;localStorage.setItem(f,JSON.stringify(e))}_setState(t){this._state={...this._state,...t},this._saveState(),this._render(),this._applySettings()}_reset(){localStorage.removeItem(f),this._state={...g,open:!1},this._render(),this._applySettings()}_applySettings(){let t=document.documentElement;t.classList.remove("va-font-normal","va-font-large","va-font-xlarge","va-theme-default","va-theme-contrast","va-theme-light","va-readable-font","va-letter-spacing"),t.classList.add(`va-font-${this._state.fontSize}`),t.classList.add(`va-theme-${this._state.theme}`),this._state.readableFont&&t.classList.add("va-readable-font"),this._state.letterSpacing&&t.classList.add("va-letter-spacing"),this._ensureGlobalStyles()}_ensureGlobalStyles(){if(document.getElementById(y))return;let t=document.createElement("style");t.id=y,t.textContent=`
       html.va-font-large { font-size: 112.5%; }
       html.va-font-xlarge { font-size: 125%; }
 
@@ -243,5 +243,477 @@ var b=Object.defineProperty;var g=(o,t,e)=>t in o?b(o,t,{enumerable:!0,configura
           <span>${this.t("toggleText")}</span>
         </button>
       </div>
-    `,this.shadowRoot.querySelector(".toggle").addEventListener("click",()=>{this._setState({open:!this._state.open})}),this.shadowRoot.querySelector(".close").addEventListener("click",()=>{this._setState({open:!1})}),this.shadowRoot.querySelectorAll("[data-font]").forEach(a=>{a.addEventListener("click",()=>this._setState({fontSize:a.dataset.font}))}),this.shadowRoot.querySelectorAll("[data-theme]").forEach(a=>{a.addEventListener("click",()=>this._setState({theme:a.dataset.theme}))}),this.shadowRoot.querySelectorAll("[data-toggle]").forEach(a=>{a.addEventListener("click",()=>this._setState({[a.dataset.toggle]:!this._state[a.dataset.toggle]}))}),this.shadowRoot.querySelector(".reset").addEventListener("click",()=>this._reset())}_getPositionStyles(){let t=this.getAttribute("position")||"right-bottom",[e,a]=t.split("-"),s={};return e==="right"?s.right="20px":s.left="20px",a==="bottom"?s.bottom="20px":s.top="20px",Object.entries(s).map(([i,f])=>`${i}: ${f};`).join(" ")}};d(l,"observedAttributes",["lang","position","label-title","label-subtitle","label-reset"]);var m=l;customElements.get("vision-accessibility-widget")||customElements.define("vision-accessibility-widget",l);export{m as VisionA11y,l as VisionAccessibilityWidget};
+    `,this.shadowRoot.querySelector(".toggle").addEventListener("click",()=>{this._setState({open:!this._state.open})}),this.shadowRoot.querySelector(".close").addEventListener("click",()=>{this._setState({open:!1})}),this.shadowRoot.querySelectorAll("[data-font]").forEach(a=>{a.addEventListener("click",()=>this._setState({fontSize:a.dataset.font}))}),this.shadowRoot.querySelectorAll("[data-theme]").forEach(a=>{a.addEventListener("click",()=>this._setState({theme:a.dataset.theme}))}),this.shadowRoot.querySelectorAll("[data-toggle]").forEach(a=>{a.addEventListener("click",()=>this._setState({[a.dataset.toggle]:!this._state[a.dataset.toggle]}))}),this.shadowRoot.querySelector(".reset").addEventListener("click",()=>this._reset())}_getPositionStyles(){let t=this.getAttribute("position")||"right-bottom",[e,a]=t.split("-"),i={};return e==="right"?i.right="20px":i.left="20px",a==="bottom"?i.bottom="20px":i.top="20px",Object.entries(i).map(([s,n])=>`${s}: ${n};`).join(" ")}};d(r,"observedAttributes",["lang","position","label-title","label-subtitle","label-reset"]);var q=r;customElements.get("vision-accessibility-widget")||customElements.define("vision-accessibility-widget",r);var h={uk:{toggleText:"\u0414\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C",toggleLabel:"\u041D\u0430\u043B\u0430\u0448\u0442\u0443\u0432\u0430\u0442\u0438 \u0441\u0430\u0439\u0442 \u0434\u043B\u044F \u043B\u044E\u0434\u0435\u0439 \u0456\u0437 \u0434\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C\u043E\u043C",closeLabel:"\u0417\u0430\u043A\u0440\u0438\u0442\u0438 \u043F\u0430\u043D\u0435\u043B\u044C",panelTitle:"\u041D\u0430\u043B\u0430\u0448\u0442\u0443\u0432\u0430\u043D\u043D\u044F \u0434\u043B\u044F \u0434\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C\u0443",panelSubtitle:"\u041F\u0440\u043E\u0439\u0434\u0456\u0442\u044C \u0448\u0432\u0438\u0434\u043A\u0438\u0439 \u0442\u0435\u0441\u0442 \u0430\u0431\u043E \u043E\u0431\u0435\u0440\u0456\u0442\u044C \u0441\u0432\u0456\u0439 \u0442\u0438\u043F \u0437\u043E\u0440\u0443.",testTab:"\u0422\u0435\u0441\u0442",manualTab:"\u0412\u0440\u0443\u0447\u043D\u0443",startTest:"\u0420\u043E\u0437\u043F\u043E\u0447\u0430\u0442\u0438 \u0442\u0435\u0441\u0442",nextQuestion:"\u0414\u0430\u043B\u0456",question1:"\u042F\u043A\u0438\u0439 \u043A\u043E\u043B\u0456\u0440 \u0432\u0438 \u0431\u0430\u0447\u0438\u0442\u0435 \u0432 \u0446\u0435\u043D\u0442\u0440\u0456?",question2:"\u042F\u043A\u0435 \u0447\u0438\u0441\u043B\u043E \u0431\u0430\u0447\u0438\u0442\u0435?",question3:"\u042F\u043A\u0438\u0439 \u043A\u0432\u0430\u0434\u0440\u0430\u0442 \u044F\u0441\u043A\u0440\u0430\u0432\u0456\u0448\u0438\u0439?",optRedGreen:"\u0427\u0435\u0440\u0432\u043E\u043D\u0438\u0439 / \u0417\u0435\u043B\u0435\u043D\u0438\u0439",optBlueYellow:"\u0421\u0438\u043D\u0456\u0439 / \u0416\u043E\u0432\u0442\u0438\u0439",optNone:"\u041D\u0435 \u0431\u0430\u0447\u0443 \u0440\u0456\u0437\u043D\u0438\u0446\u0456",optNumber74:"74",optNumber21:"21",optNoNumber:"\u041D\u0435 \u0431\u0430\u0447\u0443 \u0447\u0438\u0441\u043B\u0430",optLeft:"\u041B\u0456\u0432\u0438\u0439",optRight:"\u041F\u0440\u0430\u0432\u0438\u0439",optSame:"\u041E\u0434\u043D\u0430\u043A\u043E\u0432\u0456",resultTitle:"\u0420\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442 \u0442\u0435\u0441\u0442\u0443",resultDesc:"\u0421\u0445\u043E\u0436\u0435, \u0443 \u0432\u0430\u0441 {type}. \u0421\u0430\u0439\u0442 \u043F\u0456\u0434\u043B\u0430\u0448\u0442\u043E\u0432\u0430\u043D\u043E.",typeNormal:"\u043D\u043E\u0440\u043C\u0430\u043B\u044C\u043D\u0438\u0439 \u0437\u0456\u0440",typeDeuteranopia:"\u0434\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C \u043D\u0430 \u0437\u0435\u043B\u0435\u043D\u0438\u0439 (deuteranopia)",typeProtanopia:"\u0434\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C \u043D\u0430 \u0447\u0435\u0440\u0432\u043E\u043D\u0438\u0439 (protanopia)",typeTritanopia:"\u0434\u0430\u043B\u044C\u0442\u043E\u043D\u0456\u0437\u043C \u043D\u0430 \u0441\u0438\u043D\u0456\u0439 (tritanopia)",typeMonochromacy:"\u043F\u043E\u0432\u043D\u0430 \u0432\u0456\u0434\u0441\u0443\u0442\u043D\u0456\u0441\u0442\u044C \u043A\u043E\u043B\u044C\u043E\u0440\u043E\u0432\u043E\u0433\u043E \u0437\u043E\u0440\u0443 (monochromacy)",selectType:"\u041E\u0431\u0435\u0440\u0456\u0442\u044C \u0432\u0430\u0448 \u0442\u0438\u043F \u0437\u043E\u0440\u0443:",deuteranopia:"\u041D\u0435 \u0440\u043E\u0437\u0440\u0456\u0437\u043D\u044F\u044E \u0437\u0435\u043B\u0435\u043D\u0438\u0439",protanopia:"\u041D\u0435 \u0440\u043E\u0437\u0440\u0456\u0437\u043D\u044F\u044E \u0447\u0435\u0440\u0432\u043E\u043D\u0438\u0439",tritanopia:"\u041D\u0435 \u0440\u043E\u0437\u0440\u0456\u0437\u043D\u044F\u044E \u0441\u0438\u043D\u0456\u0439",monochromacy:"\u0427\u043E\u0440\u043D\u043E-\u0431\u0456\u043B\u0438\u0439 \u0437\u0456\u0440",apply:"\u0417\u0430\u0441\u0442\u043E\u0441\u0443\u0432\u0430\u0442\u0438",reset:"\u0421\u043A\u0438\u043D\u0443\u0442\u0438 \u043D\u0430\u043B\u0430\u0448\u0442\u0443\u0432\u0430\u043D\u043D\u044F",severity:"\u0421\u0442\u0443\u043F\u0456\u043D\u044C:",mild:"\u041B\u0435\u0433\u043A\u0430",moderate:"\u041F\u043E\u043C\u0456\u0440\u043D\u0430",severe:"\u0421\u0438\u043B\u044C\u043D\u0430"},en:{toggleText:"Colorblind",toggleLabel:"Adapt website for colorblind users",closeLabel:"Close panel",panelTitle:"Colorblind Settings",panelSubtitle:"Take a quick test or select your vision type.",testTab:"Test",manualTab:"Manual",startTest:"Start test",nextQuestion:"Next",question1:"What color do you see in the center?",question2:"What number do you see?",question3:"Which square is brighter?",optRedGreen:"Red / Green",optBlueYellow:"Blue / Yellow",optNone:"No difference",optNumber74:"74",optNumber21:"21",optNoNumber:"No number",optLeft:"Left",optRight:"Right",optSame:"Same",resultTitle:"Test result",resultDesc:"It appears you have {type}. The site has been adapted.",typeNormal:"normal vision",typeDeuteranopia:"green-blindness (deuteranopia)",typeProtanopia:"red-blindness (protanopia)",typeTritanopia:"blue-blindness (tritanopia)",typeMonochromacy:"complete color blindness (monochromacy)",selectType:"Select your vision type:",deuteranopia:"Cannot distinguish green",protanopia:"Cannot distinguish red",tritanopia:"Cannot distinguish blue",monochromacy:"Black and white vision",apply:"Apply",reset:"Reset settings",severity:"Severity:",mild:"Mild",moderate:"Moderate",severe:"Severe"},de:{toggleText:"Farbenblindheit",toggleLabel:"Website f\xFCr Farbenblinde anpassen",closeLabel:"Schlie\xDFen",panelTitle:"Farbenblind-Einstellungen",panelSubtitle:"Machen Sie einen schnellen Test oder w\xE4hlen Sie Ihren Sehtyp.",testTab:"Test",manualTab:"Manuell",startTest:"Test starten",nextQuestion:"Weiter",question1:"Welche Farbe sehen Sie in der Mitte?",question2:"Welche Zahl sehen Sie?",question3:"Welches Quadrat ist heller?",optRedGreen:"Rot / Gr\xFCn",optBlueYellow:"Blau / Gelb",optNone:"Kein Unterschied",optNumber74:"74",optNumber21:"21",optNoNumber:"Keine Zahl",optLeft:"Links",optRight:"Rechts",optSame:"Gleich",resultTitle:"Testergebnis",resultDesc:"Sie haben wahrscheinlich {type}. Die Website wurde angepasst.",typeNormal:"normales Sehen",typeDeuteranopia:"Gr\xFCnblindheit (Deuteranopie)",typeProtanopia:"Rotblindheit (Protanopie)",typeTritanopia:"Blaublindheit (Tritanopie)",typeMonochromacy:"vollst\xE4ndige Farbenblindheit (Monochromasie)",selectType:"W\xE4hlen Sie Ihren Sehtyp:",deuteranopia:"Kann Gr\xFCn nicht unterscheiden",protanopia:"Kann Rot nicht unterscheiden",tritanopia:"Kann Blau nicht unterscheiden",monochromacy:"Schwarz-Wei\xDF-Sehen",apply:"Anwenden",reset:"Zur\xFCcksetzen",severity:"St\xE4rke:",mild:"Leicht",moderate:"M\xE4\xDFig",severe:"Stark"}};function _(){let t=(document.documentElement.lang||navigator.language||"en").slice(0,2).toLowerCase();return t in h?t:"en"}var c=[{id:"q1",promptKey:"question1",options:[{labelKey:"optRedGreen",value:"red-green"},{labelKey:"optBlueYellow",value:"blue-yellow"},{labelKey:"optNone",value:"none"}]},{id:"q2",promptKey:"question2",options:[{labelKey:"optNumber74",value:"number"},{labelKey:"optNumber21",value:"number"},{labelKey:"optNoNumber",value:"none"}]},{id:"q3",promptKey:"question3",options:[{labelKey:"optLeft",value:"left"},{labelKey:"optRight",value:"right"},{labelKey:"optSame",value:"same"}]}];function S(o){let t=0,e=0,a=0,i=0;o.q1==="red-green"?(e+=3,t+=3):o.q1==="none"&&(i+=2),o.q2==="none"&&(t+=3,e+=2,i+=2),o.q3==="same"&&(i+=3,t+=1,e+=1);let s=[{type:"monochromacy",score:i},{type:"deuteranopia",score:t},{type:"protanopia",score:e},{type:"tritanopia",score:a}];if(s.sort(($,z)=>z.score-$.score),s[0].score===0)return{type:"normal",severity:"none"};let n=s[0].score,v=s[1].score,M=v>0?n/v:99,m="mild";return n>=7?m="severe":n>=4&&(m="moderate"),{type:s[0].type,severity:m}}var w="colorblind-adapt-styles";function T(o,t){if(b(),o==="normal"||!o)return;let e=document.createElement("style");e.id=w,e.textContent=R(o,t||"moderate"),document.head.appendChild(e)}function b(){document.getElementById(w)?.remove()}function R(o,t){return[A(o,t==="severe"?1:t==="moderate"?.6:.3)].join(`
+`)}function A(o,t){switch(o){case"deuteranopia":return E(t);case"protanopia":return C(t);case"tritanopia":return N(t);case"monochromacy":return K(t);default:return""}}function E(o){return`
+    html[data-cba-active] * {
+      --cba-green: hsl(140, ${30*o}%, 50%);
+      --cba-red: hsl(0, 100%, 40%);
+      --cba-bg: hsl(220, ${5*o}%, 97%);
+    }
+    html[data-cba-active] a,
+    html[data-cba-active] a:visited {
+      text-decoration: underline;
+      text-decoration-thickness: 2px;
+    }
+    html[data-cba-active] .success,
+    html[data-cba-active] [class*="success"],
+    html[data-cba-active] [class*="valid"],
+    html[data-cba-active] [class*="positive"] {
+      color: #0055aa !important;
+      border-color: #0055aa !important;
+    }
+    html[data-cba-active] .error,
+    html[data-cba-active] [class*="error"],
+    html[data-cba-active] [class*="invalid"],
+    html[data-cba-active] [class*="danger"],
+    html[data-cba-active] [class*="negative"] {
+      color: #cc4400 !important;
+      border-color: #cc4400 !important;
+    }
+    html[data-cba-active] button:not([class*="active"]):not([class*="selected"]):not([class*="primary"]) {
+      border: 2px solid currentColor;
+    }
+  `}function C(o){return`
+    html[data-cba-active] * {
+      --cba-red: hsl(10, ${80*o}%, 40%);
+      --cba-green: hsl(140, ${60*o}%, 40%);
+      --cba-bg: hsl(220, ${5*o}%, 97%);
+    }
+    html[data-cba-active] a,
+    html[data-cba-active] a:visited {
+      text-decoration: underline;
+      text-decoration-thickness: 2px;
+    }
+    html[data-cba-active] .success,
+    html[data-cba-active] [class*="success"],
+    html[data-cba-active] [class*="valid"],
+    html[data-cba-active] [class*="positive"] {
+      color: #007744 !important;
+      border-color: #007744 !important;
+    }
+    html[data-cba-active] .error,
+    html[data-cba-active] [class*="error"],
+    html[data-cba-active] [class*="invalid"],
+    html[data-cba-active] [class*="danger"],
+    html[data-cba-active] [class*="negative"] {
+      color: #cc0033 !important;
+      border-color: #cc0033 !important;
+    }
+    html[data-cba-active] button:not([class*="active"]):not([class*="selected"]):not([class*="primary"]) {
+      border: 2px solid currentColor;
+    }
+  `}function N(o){return`
+    html[data-cba-active] * {
+      --cba-blue: hsl(200, ${80*o}%, 45%);
+      --cba-yellow: hsl(40, ${80*o}%, 50%);
+      --cba-bg: hsl(220, ${5*o}%, 97%);
+    }
+    html[data-cba-active] a,
+    html[data-cba-active] a:visited {
+      text-decoration: underline;
+      text-decoration-style: dotted;
+      text-decoration-thickness: 2px;
+    }
+    html[data-cba-active] [class*="blue"],
+    html[data-cba-active] [class*="info"],
+    html[data-cba-active] [class*="primary"] {
+      color: #0066aa !important;
+      border-color: #0066aa !important;
+    }
+    html[data-cba-active] [class*="yellow"],
+    html[data-cba-active] [class*="warning"] {
+      color: #885500 !important;
+      border-color: #885500 !important;
+    }
+    html[data-cba-active] button:not([class*="active"]):not([class*="selected"]):not([class*="primary"]) {
+      border: 2px solid currentColor;
+    }
+  `}function K(o){return`
+    html[data-cba-active] {
+      filter: grayscale(${o});
+    }
+    html[data-cba-active] img,
+    html[data-cba-active] video,
+    html[data-cba-active] canvas {
+      filter: grayscale(${o});
+    }
+    html[data-cba-active] a {
+      text-decoration: underline;
+      text-decoration-thickness: 2px;
+      font-weight: 700;
+    }
+    html[data-cba-active] [class*="error"],
+    html[data-cba-active] [class*="danger"],
+    html[data-cba-active] [class*="negative"],
+    html[data-cba-active] [class*="invalid"] {
+      border-left: 4px solid #666 !important;
+      padding-left: 8px !important;
+    }
+    html[data-cba-active] [class*="success"],
+    html[data-cba-active] [class*="valid"],
+    html[data-cba-active] [class*="positive"] {
+      border-left: 4px solid #999 !important;
+      padding-left: 8px !important;
+    }
+    html[data-cba-active] button,
+    html[data-cba-active] .btn,
+    html[data-cba-active] [role="button"] {
+      border: 2px solid currentColor;
+    }
+    html[data-cba-active] button:hover,
+    html[data-cba-active] .btn:hover {
+      outline: 3px solid #ffcc00;
+      outline-offset: 2px;
+    }
+  `}var u="colorblind-adapt-settings",l=class extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this._open=!1,this._tab="test",this._quizAnswers={},this._quizStep=0,this._quizDone=!1,this._quizResult=null,this._activeType=null,this._activeSeverity="moderate"}get lang(){return this.getAttribute("lang")||_()}t(t){return(h[this.lang]||h.en)[t]||t}connectedCallback(){this._loadState(),this._render(),this._applyAdaptation()}attributeChangedCallback(){this.shadowRoot.innerHTML&&this._render()}_loadState(){try{let t=JSON.parse(localStorage.getItem(u));t&&t.type&&(this._activeType=t.type,this._activeSeverity=t.severity||"moderate")}catch{}}_saveState(){this._activeType?localStorage.setItem(u,JSON.stringify({type:this._activeType,severity:this._activeSeverity})):localStorage.removeItem(u)}_setOpen(t){this._open=t,this._render()}_switchTab(t){this._tab=t,t==="test"&&(this._quizAnswers={},this._quizStep=0,this._quizDone=!1,this._quizResult=null),this._render()}_answerQuestion(t){let e=c[this._quizStep];e&&(this._quizAnswers[e.id]=t,this._quizStep<c.length-1?(this._quizStep++,this._render()):(this._quizResult=S(this._quizAnswers),this._quizDone=!0,this._activeType=this._quizResult.type,this._activeSeverity=this._quizResult.severity,this._saveState(),this._applyAdaptation(),this._render()))}_selectType(t){this._activeType=t,this._saveState(),this._applyAdaptation(),this._render()}_setSeverity(t){this._activeSeverity=t,this._activeType&&(this._saveState(),this._applyAdaptation()),this._render()}_reset(){this._activeType=null,this._activeSeverity="moderate",this._quizAnswers={},this._quizStep=0,this._quizDone=!1,this._quizResult=null,this._tab="test",localStorage.removeItem(u),b(),document.documentElement.removeAttribute("data-cba-active"),this._render()}_applyAdaptation(){document.documentElement.removeAttribute("data-cba-active"),b(),this._activeType&&this._activeType!=="normal"&&(document.documentElement.setAttribute("data-cba-active",this._activeType),T(this._activeType,this._activeSeverity))}_render(){let t=a=>this.t(a);this.shadowRoot.innerHTML=`
+      <style>
+        :host {
+          position: fixed;
+          right: 20px;
+          bottom: 80px;
+          z-index: 99999;
+          font-family: Arial, Helvetica, sans-serif;
+        }
+        * { box-sizing: border-box; }
+        .widget {
+          display: flex;
+          flex-direction: column;
+          align-items: flex-end;
+          gap: 10px;
+        }
+        .toggle {
+          display: inline-flex;
+          align-items: center;
+          gap: 8px;
+          border: 2px solid #111;
+          border-radius: 999px;
+          padding: 12px 16px;
+          background: #fff;
+          color: #111;
+          font-size: 15px;
+          font-weight: 700;
+          cursor: pointer;
+          box-shadow: 0 10px 30px rgba(0,0,0,.18);
+          transition: transform 160ms ease, box-shadow 160ms ease;
+        }
+        .toggle:hover {
+          transform: translateY(-1px);
+          box-shadow: 0 14px 34px rgba(0,0,0,.22);
+        }
+        .toggle:focus-visible,
+        .control:focus-visible,
+        .tab:focus-visible {
+          outline: 3px solid #ffcc00;
+          outline-offset: 3px;
+        }
+        .panel {
+          width: min(360px, calc(100vw - 32px));
+          padding: 18px;
+          border: 2px solid #111;
+          border-radius: 18px;
+          background: #fff;
+          color: #111;
+          box-shadow: 0 18px 50px rgba(0,0,0,.25);
+        }
+        .panel[hidden] { display: none; }
+        .header {
+          display: flex;
+          align-items: flex-start;
+          justify-content: space-between;
+          gap: 12px;
+          margin-bottom: 14px;
+        }
+        .title {
+          margin: 0;
+          font-size: 18px;
+          line-height: 1.25;
+          font-weight: 800;
+        }
+        .subtitle {
+          margin: 4px 0 0;
+          font-size: 13px;
+          line-height: 1.4;
+          color: #555;
+        }
+        .close {
+          width: 32px; height: 32px;
+          border: 1px solid #ddd;
+          border-radius: 50%;
+          background: #f7f7f7;
+          cursor: pointer;
+          font-size: 20px;
+          line-height: 1;
+        }
+        .tabs {
+          display: flex;
+          gap: 4px;
+          margin-bottom: 14px;
+          background: #f0f0f0;
+          border-radius: 10px;
+          padding: 3px;
+        }
+        .tab {
+          flex: 1;
+          padding: 8px;
+          border: none;
+          border-radius: 8px;
+          background: transparent;
+          color: #555;
+          font-size: 13px;
+          font-weight: 700;
+          cursor: pointer;
+          transition: background 140ms, color 140ms;
+        }
+        .tab.active {
+          background: #fff;
+          color: #111;
+          box-shadow: 0 1px 3px rgba(0,0,0,.1);
+        }
+        .option-grid {
+          display: flex;
+          flex-direction: column;
+          gap: 8px;
+        }
+        .option {
+          display: block;
+          width: 100%;
+          padding: 12px 14px;
+          border: 2px solid #d6d6d6;
+          border-radius: 12px;
+          background: #fafafa;
+          color: #111;
+          font-size: 14px;
+          font-weight: 700;
+          cursor: pointer;
+          text-align: left;
+          transition: border-color 140ms ease, background 140ms ease;
+        }
+        .option:hover {
+          border-color: #111;
+          background: #f0f0f0;
+        }
+        .option.active {
+          border-color: #111;
+          background: #111;
+          color: #fff;
+        }
+        .step-indicator {
+          font-size: 12px;
+          color: #888;
+          margin-bottom: 12px;
+        }
+        .result-card {
+          padding: 16px;
+          border: 2px solid #111;
+          border-radius: 12px;
+          background: #fafafa;
+          margin-bottom: 12px;
+        }
+        .result-title {
+          font-weight: 800;
+          font-size: 16px;
+          margin-bottom: 6px;
+        }
+        .result-desc {
+          font-size: 13px;
+          line-height: 1.5;
+          color: #333;
+        }
+        .result-type {
+          display: inline-block;
+          padding: 3px 10px;
+          border-radius: 999px;
+          background: #111;
+          color: #fff;
+          font-size: 12px;
+          font-weight: 700;
+          margin-top: 8px;
+        }
+        .select-group {
+          margin-bottom: 12px;
+        }
+        .select-label {
+          display: block;
+          font-weight: 700;
+          font-size: 13px;
+          margin-bottom: 6px;
+          color: #333;
+        }
+        .select-input {
+          width: 100%;
+          padding: 10px 12px;
+          border: 2px solid #d6d6d6;
+          border-radius: 10px;
+          font-size: 14px;
+          font-weight: 600;
+          background: #fafafa;
+          color: #111;
+          cursor: pointer;
+        }
+        .select-input:focus {
+          border-color: #111;
+          outline: none;
+        }
+        .severity-group {
+          display: flex;
+          gap: 6px;
+          margin-top: 8px;
+        }
+        .severity-btn {
+          flex: 1;
+          padding: 8px;
+          border: 2px solid #d6d6d6;
+          border-radius: 8px;
+          background: #fafafa;
+          color: #555;
+          font-size: 12px;
+          font-weight: 700;
+          cursor: pointer;
+          text-align: center;
+          transition: all 140ms;
+        }
+        .severity-btn.active {
+          border-color: #111;
+          background: #111;
+          color: #fff;
+        }
+        .action-row {
+          display: flex;
+          gap: 8px;
+          margin-top: 14px;
+        }
+        .btn-primary {
+          flex: 1;
+          padding: 10px;
+          border: 2px solid #111;
+          border-radius: 10px;
+          background: #111;
+          color: #fff;
+          font-weight: 700;
+          font-size: 13px;
+          cursor: pointer;
+        }
+        .btn-reset {
+          flex: 1;
+          padding: 10px;
+          border: 2px solid #f0b4b4;
+          border-radius: 10px;
+          background: #fff4f4;
+          color: #8a0000;
+          font-weight: 700;
+          font-size: 13px;
+          cursor: pointer;
+        }
+        .btn-reset:hover {
+          background: #ffe0e0;
+        }
+        .tag {
+          display: inline-block;
+          padding: 2px 8px;
+          border-radius: 6px;
+          font-size: 11px;
+          font-weight: 700;
+          margin-left: 8px;
+        }
+        .tag-active {
+          background: #111;
+          color: #fff;
+        }
+        @media (max-width: 520px) {
+          :host {
+            right: 12px !important;
+            bottom: 70px !important;
+          }
+          .toggle { padding: 11px 14px; font-size: 14px; }
+        }
+      </style>
+
+      <div class="widget">
+        <section class="panel" ${this._open?"":"hidden"} aria-label="${t("panelTitle")}">
+          <div class="header">
+            <div>
+              <h2 class="title">
+                ${t("panelTitle")}
+                ${this._activeType&&this._activeType!=="normal"?`<span class="tag tag-active">${this._activeType}</span>`:""}
+              </h2>
+              <p class="subtitle">${t("panelSubtitle")}</p>
+            </div>
+            <button class="close" type="button" aria-label="${t("closeLabel")}">\xD7</button>
+          </div>
+
+          ${this._renderBody()}
+
+          ${this._activeType&&this._activeType!=="normal"?`
+            <div class="action-row">
+              <button class="btn-reset" type="button">${t("reset")}</button>
+            </div>
+          `:""}
+        </section>
+
+        <button
+          class="toggle"
+          type="button"
+          aria-expanded="${this._open?"true":"false"}"
+          aria-label="${t("toggleLabel")}"
+        >
+          <span class="icon" aria-hidden="true">\u{1F535}</span>
+          <span>${t("toggleText")}</span>
+          ${this._activeType&&this._activeType!=="normal"?" \u2713":""}
+        </button>
+      </div>
+    `,this.shadowRoot.querySelector(".toggle").addEventListener("click",()=>this._setOpen(!this._open)),this.shadowRoot.querySelector(".close").addEventListener("click",()=>this._setOpen(!1));let e=this.shadowRoot.querySelector(".panel");if(e&&e.querySelectorAll("button[data-answer]").forEach(a=>{a.addEventListener("click",()=>this._answerQuestion(a.dataset.answer))}),this._open&&this._tab==="test"&&!this._quizDone&&this.shadowRoot.querySelectorAll(".tab").forEach(a=>{a.addEventListener("click",()=>this._switchTab(a.dataset.tab))}),this._open&&this._tab==="manual"){let a=this.shadowRoot.querySelector("#cba-type-select");a&&(a.addEventListener("change",()=>this._selectType(a.value)),this.shadowRoot.querySelectorAll("[data-severity]").forEach(n=>{n.addEventListener("click",()=>this._setSeverity(n.dataset.severity))}));let i=this.shadowRoot.querySelector(".btn-reset");i&&i.addEventListener("click",()=>this._reset())}if(this._open&&this._quizDone){let a=this.shadowRoot.querySelector(".btn-reset");a&&a.addEventListener("click",()=>this._reset())}}_renderBody(){let t=e=>this.t(e);return this._activeType&&this._activeType!=="normal"?this._renderActiveState(t):this._quizDone?this._renderResult(t):`
+      <div class="tabs">
+        <button class="tab ${this._tab==="test"?"active":""}" data-tab="test" type="button">${t("testTab")}</button>
+        <button class="tab ${this._tab==="manual"?"active":""}" data-tab="manual" type="button">${t("manualTab")}</button>
+      </div>
+      ${this._tab==="test"?this._renderQuiz(t):this._renderManual(t)}
+    `}_renderQuiz(t){let e=c[this._quizStep];return e?`
+      <div class="step-indicator">${t("question"+(this._quizStep+1))} (${this._quizStep+1}/${c.length})</div>
+      <p style="font-weight:700;font-size:15px;margin:0 0 12px">${t(e.promptKey)}</p>
+      <div class="option-grid">
+        ${e.options.map((a,i)=>`
+          <button class="option" data-answer="${a.value}" type="button">
+            ${t(a.labelKey)}
+          </button>
+        `).join("")}
+      </div>
+    `:""}_renderManual(t){let e=["deuteranopia","protanopia","tritanopia","monochromacy"],a=["mild","moderate","severe"];return`
+      <div class="select-group">
+        <label class="select-label" for="cba-type-select">${t("selectType")}</label>
+        <select class="select-input" id="cba-type-select">
+          <option value="">\u2014 ${t("selectType")} \u2014</option>
+          ${e.map(i=>`
+            <option value="${i}" ${this._activeType===i?"selected":""}>
+              ${t(i)}
+            </option>
+          `).join("")}
+        </select>
+      </div>
+      ${this._activeType?`
+        <div class="select-group">
+          <label class="select-label">${t("severity")}</label>
+          <div class="severity-group">
+            ${a.map(i=>`
+              <button class="severity-btn ${this._activeSeverity===i?"active":""}" data-severity="${i}" type="button">
+                ${t(i)}
+              </button>
+            `).join("")}
+          </div>
+        </div>
+      `:""}
+    `}_renderResult(t){let e=this._quizResult;if(!e)return"";let a="type"+e.type.charAt(0).toUpperCase()+e.type.slice(1);return`
+      <div class="result-card">
+        <div class="result-title">${t("resultTitle")}</div>
+        <div class="result-desc">
+          ${t("resultDesc").replace("{type}",t(a))}
+        </div>
+        <span class="result-type">${t(e.severity)} \xB7 ${t(a)}</span>
+      </div>
+      <button class="btn-reset" type="button">${t("reset")}</button>
+    `}_renderActiveState(t){let e=this._quizResult;return`
+      <div class="result-card">
+        <div class="result-title">${t("resultTitle")}</div>
+        <span class="result-type">${this._activeType} \xB7 ${t(this._activeSeverity)}</span>
+      </div>
+    `}};d(l,"observedAttributes",["lang"]);var B=l;customElements.get("colorblind-adapt-widget")||customElements.define("colorblind-adapt-widget",l);export{B as ColorblindAdapt,l as ColorblindAdaptWidget,q as VisionA11y,r as VisionAccessibilityWidget};
 //# sourceMappingURL=index.js.map