@3r1s_s/erisui 1.0.15 → 1.0.17

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.
Files changed (3) hide show
  1. package/dist/erisui.js +115 -20
  2. package/dist/erisui.mjs +304 -176
  3. package/package.json +1 -1
package/dist/erisui.js CHANGED
@@ -43,7 +43,7 @@
43
43
  <slot></slot>
44
44
  <span id="initials"></span>
45
45
  </div>
46
- `}connectedCallback(){this.avatar=this.shadowRoot.querySelector(".avatar"),this.initials=this.shadowRoot.querySelector("#initials");const t=this.shadowRoot.querySelector("slot"),e=t&&t.assignedNodes().length>0;if(e){const i=t.assignedNodes()[0];i&&i.tagName==="IMG"&&(this.initials.style.display="none",this.avatar.style.backgroundColor="transparent")}else this.hasAttribute("color")&&(this.avatar.style.backgroundColor=this.getAttribute("color"));if(this.hasAttribute("color")&&(this.avatar.style.backgroundColor=this.getAttribute("color")),this.hasAttribute("size")){const i=this.getAttribute("size");this.avatar.style.width=i+"px",this.avatar.style.height=i+"px",this.initials.style.fontSize=i/2+"px"}if(this.hasAttribute("border-radius")&&(this.avatar.style.borderRadius=this.getAttribute("border-radius")+"px"),this.hasAttribute("name")&&(this.avatar.title=this.getAttribute("name")),!e&&this.hasAttribute("name")){const a=this.getAttribute("name").trim().split(/\s+/);let n="";a.length===1?n=a[0][0]||"":n=(a[0][0]||"")+(a[a.length-1][0]||""),this.initials.textContent=n.toUpperCase()}}}customElements.define("eui-avatar",m);const u=(()=>{let o={};return{register(t,e){o[t]=e},get(t){return o[t]||""}}})();u.register("menu",'<svg width="24" height="24" viewBox="0 0 24 24" focusable="false"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" fill="currentColor"></path></svg>'),u.register("home",'<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.5258 0.204649C11.2291 -0.0682165 10.7709 -0.0682161 10.4742 0.204649L0.249923 9.68588C-0.266994 10.1612 0.0714693 11.0197 0.775759 11.0197L3.48971 11.0197V18.6923C3.48971 19.542 4.18295 20.2308 5.03811 20.2308H16.9619C17.8171 20.2308 18.5103 19.542 18.5103 18.6923V11.0197L21.2242 11.0197C21.9285 11.0197 22.267 10.1612 21.7501 9.68588L11.5258 0.204649Z" fill="currentColor"/></svg>'),u.register("kit",'<svg width="26" height="28" viewBox="0 0 26 28" xmlns="http://www.w3.org/2000/svg"><path d="m13.118 14.831c0.433 0 1.257-0.024 1.795-0.344l9.151-4.057c0.869-0.59 1.051-1.255 1.067-1.773 0.02-0.662-0.313-1.634-1.181-2.15l-8.515-3.921c-0.537-0.309-2.096-0.552-2.529-0.552-0.444 0-1.958 0.42-2.496 0.73l-8.643 4.034c-0.85 0.602-1.022 1.284-0.951 1.942 0.098 0.887 0.206 0.857 0.889 1.503l9.577 4.212c0.537 0.32 1.391 0.376 1.836 0.376zm-0.12 5.467c0.403 0 1.443-0.068 1.928-0.345l8.858-3.991c0.497-0.3 1.448-1.117 1.382-1.952-0.091-1.138-0.598-1.7-0.948-1.906l-9.22 3.888c-0.454 0.261-1.417 0.478-1.916 0.478-0.542 0-1.539-0.228-1.766-0.362l-9.395-4.012c-0.462 0.022-1.174 0.911-1.201 1.642-0.03 0.761 0.7 1.62 1.135 1.839l9.408 4.384c0.485 0.278 1.322 0.337 1.735 0.337zm0.09 5.344c0.403 0 1.296-0.053 1.781-0.342l9.147-4.299c0.485-0.289 1.129-0.789 1.053-1.879-0.056-0.794-0.071-1.123-0.918-1.765l-9.203 4.113c-0.228 0.134-0.948 0.39-1.853 0.39-0.939 0-1.603-0.224-1.831-0.359l-9.451-4.017c-0.979 0.247-1.005 1.45-1.005 1.947 0 0.455 0.403 1.279 0.9 1.568l9.465 4.262c0.486 0.29 1.502 0.381 1.915 0.381z" fill="currentColor"></path></svg>'),u.register("settings",'<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.644169 15.2044C0.751639 15.4175 0.866389 15.627 0.988219 15.8323C1.34503 16.445 1.76284 17.0223 2.23048 17.545C2.3967 17.7307 2.65856 17.7968 2.89375 17.7126L5.25826 16.8621C5.96645 16.608 6.74841 17.07 6.87902 17.8018L7.32018 20.2764C7.36418 20.5227 7.55119 20.7167 7.79454 20.7688C8.86201 20.9976 9.95753 21.057 11.0418 20.9452C11.427 20.9061 11.8095 20.8457 12.1863 20.7643C12.375 20.7232 12.5303 20.5969 12.6121 20.4275C12.6441 20.37 12.6671 20.3068 12.6794 20.2397L13.132 17.7739C13.1978 17.4162 13.4191 17.1252 13.7102 16.9498C13.7478 16.9275 13.7867 16.9072 13.8264 16.8889C14.1041 16.7654 14.426 16.7408 14.7301 16.8496L17.0889 17.6938C17.2068 17.7362 17.3318 17.7406 17.4482 17.7107C17.5805 17.6872 17.7044 17.6208 17.7983 17.5172C18.2857 16.9783 18.7189 16.3833 19.0875 15.7497C19.4503 15.1137 19.748 14.4403 19.9703 13.7471C20.0128 13.6142 20.0083 13.4742 19.9629 13.3481C19.9307 13.2315 19.8646 13.1245 19.7685 13.043L17.8596 11.4179C17.6114 11.2067 17.4714 10.912 17.4409 10.6065C17.4371 10.563 17.4355 10.5194 17.4361 10.4758C17.444 10.1379 17.5847 9.80337 17.8591 9.56905L19.7638 7.94348C19.8146 7.90007 19.857 7.84958 19.8904 7.7944C19.9978 7.63842 20.0299 7.43844 19.9706 7.25291C19.8534 6.88733 19.7151 6.52704 19.5572 6.17466C19.1114 5.17572 18.5115 4.2528 17.7787 3.43934C17.612 3.25429 17.3509 3.18886 17.1161 3.27382L14.7569 4.12827C14.0592 4.38082 13.2679 3.93321 13.1344 3.19155L12.6871 0.714256C12.6423 0.468053 12.4542 0.273849 12.2106 0.22246C11.5182 0.0764882 10.803 0.00250031 10.088 0.000608251C9.88769 -0.0015584 9.68739 0.002064 9.48735 0.0114648C8.92415 0.0369819 8.36389 0.107332 7.81778 0.222459C7.78135 0.230146 7.74615 0.241028 7.71249 0.2548C7.5098 0.328781 7.35888 0.505679 7.31996 0.723547L6.8788 3.19817C6.81394 3.56157 6.58834 3.85866 6.29097 4.03446C5.98991 4.2061 5.61923 4.25412 5.27153 4.12827L2.91237 3.27382C2.70694 3.1995 2.48138 3.24016 2.31657 3.37545C2.2857 3.39886 2.25676 3.42543 2.23026 3.45505C1.81793 3.91588 1.44433 4.4192 1.11714 4.95183C1.05788 5.04799 1.00019 5.14513 0.944072 5.24319C0.878302 5.35619 0.814661 5.4704 0.753186 5.58577C0.464267 6.12611 0.222113 6.69081 0.0338354 7.26739C0.0213426 7.30567 0.0127871 7.34455 0.00802709 7.38352C-0.0257478 7.59364 0.0518458 7.809 0.218337 7.94974L2.13633 9.56992C2.41146 9.80242 2.55518 10.1364 2.56469 10.4743C2.56917 10.8294 2.42529 11.1857 2.13611 11.4301L0.218115 13.0503C0.0484589 13.1937 -0.0289685 13.4145 0.00982709 13.6284C0.0147983 13.6634 0.0228404 13.6982 0.0340542 13.7326C0.198098 14.235 0.403035 14.7283 0.644169 15.2044ZM10 14.5C12.2091 14.5 14 12.7091 14 10.5C14 8.29086 12.2091 6.5 10 6.5C7.79086 6.5 6 8.29086 6 10.5C6 12.7091 7.79086 14.5 10 14.5Z" fill="currentColor"></path></svg>'),u.register("home",'<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.5258 0.204649C11.2291 -0.0682165 10.7709 -0.0682161 10.4742 0.204649L0.249923 9.68588C-0.266994 10.1612 0.0714693 11.0197 0.775759 11.0197L3.48971 11.0197V18.6923C3.48971 19.542 4.18295 20.2308 5.03811 20.2308H16.9619C17.8171 20.2308 18.5103 19.542 18.5103 18.6923V11.0197L21.2242 11.0197C21.9285 11.0197 22.267 10.1612 21.7501 9.68588L11.5258 0.204649Z" fill="currentColor"/></svg>'),u.register("copy",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M2 11C2 11.7956 2.31607 12.5587 2.87868 13.1213C3.44129 13.6839 4.20435 14 5 14H11C11.7956 14 12.5587 13.6839 13.1213 13.1213C13.6839 12.5587 14 11.7956 14 11V8H11.75C10.7554 8 9.80161 7.60491 9.09835 6.90165C8.39509 6.19839 8 5.24456 8 4.25V2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V11Z" fill="currentColor"/><path d="M13.7975 6.49965C13.6881 6.25457 13.5357 6.03105 13.3475 5.83965L10.16 2.65965C9.96921 2.4688 9.74565 2.31384 9.5 2.20215V4.24965C9.5 4.54512 9.5582 4.8377 9.67127 5.11069C9.78434 5.38367 9.95008 5.63171 10.159 5.84064C10.3679 6.04957 10.616 6.2153 10.889 6.32838C11.1619 6.44145 11.4545 6.49965 11.75 6.49965H13.7975Z" fill="currentColor"/></svg>'),u.register("arrow",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M9.3 5.3a1 1 0 0 0 0 1.4l5.29 5.3-5.3 5.3a1 1 0 1 0 1.42 1.4l6-6a1 1 0 0 0 0-1.4l-6-6a1 1 0 0 0-1.42 0Z"></path></svg>'),u.register("back",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" style="transform: rotate(180deg)"><path d="M9.3 5.3a1 1 0 0 0 0 1.4l5.29 5.3-5.3 5.3a1 1 0 1 0 1.42 1.4l6-6a1 1 0 0 0 0-1.4l-6-6a1 1 0 0 0-1.42 0Z"></path></svg>'),u.register("check",'<svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.86368 9.12226C3.82463 9.16131 3.76131 9.16131 3.72226 9.12226L0.146522 5.54652C-0.0487403 5.35126 -0.0487401 5.03468 0.146522 4.83942L0.839416 4.14652C1.03468 3.95126 1.35126 3.95126 1.54652 4.14652L3.72226 6.32226C3.76131 6.36131 3.82463 6.36131 3.86368 6.32226L10.0394 0.146522C10.2347 -0.0487398 10.5513 -0.0487399 10.7465 0.146522L11.4394 0.839416C11.6347 1.03468 11.6347 1.35126 11.4394 1.54652L3.86368 9.12226Z" fill="currentColor"/></svg>');class A extends HTMLElement{static get observedAttributes(){return["name","width","height"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(){this.render()}render(){const t=this.getAttribute("name"),e=u.get(t);if(!e){this.shadowRoot.innerHTML='<span style="color:red;">?</span>';return}const i=document.createElement("template");i.innerHTML=e.trim();const a=i.content.cloneNode(!0),n=a.firstElementChild;if(n&&n.style){const r=this.getAttribute("width"),l=this.getAttribute("height");r&&n.setAttribute("width",r),l&&n.setAttribute("height",l),n.style.display="block"}this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(a)}}customElements.define("eui-icon",A);class L extends HTMLElement{static get observedAttributes(){return["label","value","id","type","filled"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
46
+ `}connectedCallback(){this.avatar=this.shadowRoot.querySelector(".avatar"),this.initials=this.shadowRoot.querySelector("#initials");const t=this.shadowRoot.querySelector("slot"),i=t&&t.assignedNodes().length>0;if(i){const e=t.assignedNodes()[0];e&&e.tagName==="IMG"&&(this.initials.style.display="none",this.avatar.style.backgroundColor="transparent")}else this.hasAttribute("color")&&(this.avatar.style.backgroundColor=this.getAttribute("color"));if(this.hasAttribute("color")&&(this.avatar.style.backgroundColor=this.getAttribute("color")),this.hasAttribute("size")){const e=this.getAttribute("size");this.avatar.style.width=e+"px",this.avatar.style.height=e+"px",this.initials.style.fontSize=e/2+"px"}if(this.hasAttribute("border-radius")&&(this.avatar.style.borderRadius=this.getAttribute("border-radius")+"px"),this.hasAttribute("name")&&(this.avatar.title=this.getAttribute("name")),!i&&this.hasAttribute("name")){const a=this.getAttribute("name").trim().split(/\s+/);let o="";a.length===1?o=a[0][0]||"":o=(a[0][0]||"")+(a[a.length-1][0]||""),this.initials.textContent=o.toUpperCase()}}}customElements.define("eui-avatar",m);const u=(()=>{let s={};return{register(t,i){s[t]=i},get(t){return s[t]||""}}})();u.register("menu",'<svg width="24" height="24" viewBox="0 0 24 24" focusable="false"><path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" fill="currentColor"></path></svg>'),u.register("home",'<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.5258 0.204649C11.2291 -0.0682165 10.7709 -0.0682161 10.4742 0.204649L0.249923 9.68588C-0.266994 10.1612 0.0714693 11.0197 0.775759 11.0197L3.48971 11.0197V18.6923C3.48971 19.542 4.18295 20.2308 5.03811 20.2308H16.9619C17.8171 20.2308 18.5103 19.542 18.5103 18.6923V11.0197L21.2242 11.0197C21.9285 11.0197 22.267 10.1612 21.7501 9.68588L11.5258 0.204649Z" fill="currentColor"/></svg>'),u.register("kit",'<svg width="26" height="28" viewBox="0 0 26 28" xmlns="http://www.w3.org/2000/svg"><path d="m13.118 14.831c0.433 0 1.257-0.024 1.795-0.344l9.151-4.057c0.869-0.59 1.051-1.255 1.067-1.773 0.02-0.662-0.313-1.634-1.181-2.15l-8.515-3.921c-0.537-0.309-2.096-0.552-2.529-0.552-0.444 0-1.958 0.42-2.496 0.73l-8.643 4.034c-0.85 0.602-1.022 1.284-0.951 1.942 0.098 0.887 0.206 0.857 0.889 1.503l9.577 4.212c0.537 0.32 1.391 0.376 1.836 0.376zm-0.12 5.467c0.403 0 1.443-0.068 1.928-0.345l8.858-3.991c0.497-0.3 1.448-1.117 1.382-1.952-0.091-1.138-0.598-1.7-0.948-1.906l-9.22 3.888c-0.454 0.261-1.417 0.478-1.916 0.478-0.542 0-1.539-0.228-1.766-0.362l-9.395-4.012c-0.462 0.022-1.174 0.911-1.201 1.642-0.03 0.761 0.7 1.62 1.135 1.839l9.408 4.384c0.485 0.278 1.322 0.337 1.735 0.337zm0.09 5.344c0.403 0 1.296-0.053 1.781-0.342l9.147-4.299c0.485-0.289 1.129-0.789 1.053-1.879-0.056-0.794-0.071-1.123-0.918-1.765l-9.203 4.113c-0.228 0.134-0.948 0.39-1.853 0.39-0.939 0-1.603-0.224-1.831-0.359l-9.451-4.017c-0.979 0.247-1.005 1.45-1.005 1.947 0 0.455 0.403 1.279 0.9 1.568l9.465 4.262c0.486 0.29 1.502 0.381 1.915 0.381z" fill="currentColor"></path></svg>'),u.register("settings",'<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M0.644169 15.2044C0.751639 15.4175 0.866389 15.627 0.988219 15.8323C1.34503 16.445 1.76284 17.0223 2.23048 17.545C2.3967 17.7307 2.65856 17.7968 2.89375 17.7126L5.25826 16.8621C5.96645 16.608 6.74841 17.07 6.87902 17.8018L7.32018 20.2764C7.36418 20.5227 7.55119 20.7167 7.79454 20.7688C8.86201 20.9976 9.95753 21.057 11.0418 20.9452C11.427 20.9061 11.8095 20.8457 12.1863 20.7643C12.375 20.7232 12.5303 20.5969 12.6121 20.4275C12.6441 20.37 12.6671 20.3068 12.6794 20.2397L13.132 17.7739C13.1978 17.4162 13.4191 17.1252 13.7102 16.9498C13.7478 16.9275 13.7867 16.9072 13.8264 16.8889C14.1041 16.7654 14.426 16.7408 14.7301 16.8496L17.0889 17.6938C17.2068 17.7362 17.3318 17.7406 17.4482 17.7107C17.5805 17.6872 17.7044 17.6208 17.7983 17.5172C18.2857 16.9783 18.7189 16.3833 19.0875 15.7497C19.4503 15.1137 19.748 14.4403 19.9703 13.7471C20.0128 13.6142 20.0083 13.4742 19.9629 13.3481C19.9307 13.2315 19.8646 13.1245 19.7685 13.043L17.8596 11.4179C17.6114 11.2067 17.4714 10.912 17.4409 10.6065C17.4371 10.563 17.4355 10.5194 17.4361 10.4758C17.444 10.1379 17.5847 9.80337 17.8591 9.56905L19.7638 7.94348C19.8146 7.90007 19.857 7.84958 19.8904 7.7944C19.9978 7.63842 20.0299 7.43844 19.9706 7.25291C19.8534 6.88733 19.7151 6.52704 19.5572 6.17466C19.1114 5.17572 18.5115 4.2528 17.7787 3.43934C17.612 3.25429 17.3509 3.18886 17.1161 3.27382L14.7569 4.12827C14.0592 4.38082 13.2679 3.93321 13.1344 3.19155L12.6871 0.714256C12.6423 0.468053 12.4542 0.273849 12.2106 0.22246C11.5182 0.0764882 10.803 0.00250031 10.088 0.000608251C9.88769 -0.0015584 9.68739 0.002064 9.48735 0.0114648C8.92415 0.0369819 8.36389 0.107332 7.81778 0.222459C7.78135 0.230146 7.74615 0.241028 7.71249 0.2548C7.5098 0.328781 7.35888 0.505679 7.31996 0.723547L6.8788 3.19817C6.81394 3.56157 6.58834 3.85866 6.29097 4.03446C5.98991 4.2061 5.61923 4.25412 5.27153 4.12827L2.91237 3.27382C2.70694 3.1995 2.48138 3.24016 2.31657 3.37545C2.2857 3.39886 2.25676 3.42543 2.23026 3.45505C1.81793 3.91588 1.44433 4.4192 1.11714 4.95183C1.05788 5.04799 1.00019 5.14513 0.944072 5.24319C0.878302 5.35619 0.814661 5.4704 0.753186 5.58577C0.464267 6.12611 0.222113 6.69081 0.0338354 7.26739C0.0213426 7.30567 0.0127871 7.34455 0.00802709 7.38352C-0.0257478 7.59364 0.0518458 7.809 0.218337 7.94974L2.13633 9.56992C2.41146 9.80242 2.55518 10.1364 2.56469 10.4743C2.56917 10.8294 2.42529 11.1857 2.13611 11.4301L0.218115 13.0503C0.0484589 13.1937 -0.0289685 13.4145 0.00982709 13.6284C0.0147983 13.6634 0.0228404 13.6982 0.0340542 13.7326C0.198098 14.235 0.403035 14.7283 0.644169 15.2044ZM10 14.5C12.2091 14.5 14 12.7091 14 10.5C14 8.29086 12.2091 6.5 10 6.5C7.79086 6.5 6 8.29086 6 10.5C6 12.7091 7.79086 14.5 10 14.5Z" fill="currentColor"></path></svg>'),u.register("home",'<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.5258 0.204649C11.2291 -0.0682165 10.7709 -0.0682161 10.4742 0.204649L0.249923 9.68588C-0.266994 10.1612 0.0714693 11.0197 0.775759 11.0197L3.48971 11.0197V18.6923C3.48971 19.542 4.18295 20.2308 5.03811 20.2308H16.9619C17.8171 20.2308 18.5103 19.542 18.5103 18.6923V11.0197L21.2242 11.0197C21.9285 11.0197 22.267 10.1612 21.7501 9.68588L11.5258 0.204649Z" fill="currentColor"/></svg>'),u.register("copy",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M2 11C2 11.7956 2.31607 12.5587 2.87868 13.1213C3.44129 13.6839 4.20435 14 5 14H11C11.7956 14 12.5587 13.6839 13.1213 13.1213C13.6839 12.5587 14 11.7956 14 11V8H11.75C10.7554 8 9.80161 7.60491 9.09835 6.90165C8.39509 6.19839 8 5.24456 8 4.25V2H5C4.20435 2 3.44129 2.31607 2.87868 2.87868C2.31607 3.44129 2 4.20435 2 5V11Z" fill="currentColor"/><path d="M13.7975 6.49965C13.6881 6.25457 13.5357 6.03105 13.3475 5.83965L10.16 2.65965C9.96921 2.4688 9.74565 2.31384 9.5 2.20215V4.24965C9.5 4.54512 9.5582 4.8377 9.67127 5.11069C9.78434 5.38367 9.95008 5.63171 10.159 5.84064C10.3679 6.04957 10.616 6.2153 10.889 6.32838C11.1619 6.44145 11.4545 6.49965 11.75 6.49965H13.7975Z" fill="currentColor"/></svg>'),u.register("arrow",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M9.3 5.3a1 1 0 0 0 0 1.4l5.29 5.3-5.3 5.3a1 1 0 1 0 1.42 1.4l6-6a1 1 0 0 0 0-1.4l-6-6a1 1 0 0 0-1.42 0Z"></path></svg>'),u.register("back",'<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2" style="transform: rotate(180deg)"><path d="M9.3 5.3a1 1 0 0 0 0 1.4l5.29 5.3-5.3 5.3a1 1 0 1 0 1.42 1.4l6-6a1 1 0 0 0 0-1.4l-6-6a1 1 0 0 0-1.42 0Z"></path></svg>'),u.register("check",'<svg width="12" height="10" viewBox="0 0 12 10" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3.86368 9.12226C3.82463 9.16131 3.76131 9.16131 3.72226 9.12226L0.146522 5.54652C-0.0487403 5.35126 -0.0487401 5.03468 0.146522 4.83942L0.839416 4.14652C1.03468 3.95126 1.35126 3.95126 1.54652 4.14652L3.72226 6.32226C3.76131 6.36131 3.82463 6.36131 3.86368 6.32226L10.0394 0.146522C10.2347 -0.0487398 10.5513 -0.0487399 10.7465 0.146522L11.4394 0.839416C11.6347 1.03468 11.6347 1.35126 11.4394 1.54652L3.86368 9.12226Z" fill="currentColor"/></svg>');class A extends HTMLElement{static get observedAttributes(){return["name","width","height"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}attributeChangedCallback(){this.render()}render(){const t=this.getAttribute("name"),i=u.get(t);if(!i){this.shadowRoot.innerHTML='<span style="color:red;">?</span>';return}const e=document.createElement("template");e.innerHTML=i.trim();const a=e.content.cloneNode(!0),o=a.firstElementChild;if(o&&o.style){const r=this.getAttribute("width"),l=this.getAttribute("height");r&&o.setAttribute("width",r),l&&o.setAttribute("height",l),o.style.display="block"}this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(a)}}customElements.define("eui-icon",A);class L extends HTMLElement{static get observedAttributes(){return["label","value","id","type","filled"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
47
47
  <style>
48
48
  .form {
49
49
  display: flex;
@@ -143,7 +143,7 @@
143
143
  <input class="form-input" placeholder=" ">
144
144
  <label></label>
145
145
  </div>
146
- `}connectedCallback(){this.form=this.shadowRoot.querySelector(".form"),this.inputEl=this.shadowRoot.querySelector(".form-input"),this.labelEl=this.shadowRoot.querySelector("label"),this.hasAttribute("value")&&(this.inputEl.value=this.getAttribute("value")),this.hasAttribute("id")&&(this.inputEl.id=this.getAttribute("id")),this.hasAttribute("label")&&(this.labelEl.textContent=this.getAttribute("label")),this.hasAttribute("type")&&(this.inputEl.type=this.getAttribute("type")),this.hasAttribute("filled")&&this.form.classList.add("filled"),this.inputEl.addEventListener("input",t=>{this.setAttribute("value",this.inputEl.value),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("change",t=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))})}attributeChangedCallback(t,e,i){if(!(!this.inputEl||!this.labelEl))switch(t){case"value":this.inputEl.value!==i&&(this.inputEl.value=i);break;case"id":this.inputEl.id=i;break;case"label":this.labelEl.textContent=i;break}}get value(){return this.inputEl.value}set value(t){this.setAttribute("value",t)}}customElements.define("eui-input",L);class S extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
146
+ `}connectedCallback(){this.form=this.shadowRoot.querySelector(".form"),this.inputEl=this.shadowRoot.querySelector(".form-input"),this.labelEl=this.shadowRoot.querySelector("label"),this.hasAttribute("value")&&(this.inputEl.value=this.getAttribute("value")),this.hasAttribute("id")&&(this.inputEl.id=this.getAttribute("id")),this.hasAttribute("label")&&(this.labelEl.textContent=this.getAttribute("label")),this.hasAttribute("type")&&(this.inputEl.type=this.getAttribute("type")),this.hasAttribute("filled")&&this.form.classList.add("filled"),this.inputEl.addEventListener("input",t=>{this.setAttribute("value",this.inputEl.value),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("change",t=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))})}attributeChangedCallback(t,i,e){if(!(!this.inputEl||!this.labelEl))switch(t){case"value":this.inputEl.value!==e&&(this.inputEl.value=e);break;case"id":this.inputEl.id=e;break;case"label":this.labelEl.textContent=e;break}}get value(){return this.inputEl.value}set value(t){this.setAttribute("value",t)}}customElements.define("eui-input",L);class S extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
147
147
  <style>
148
148
  .loader {
149
149
  width: 24px;
@@ -188,7 +188,7 @@
188
188
  <span class="loader animate">
189
189
  <svg viewBox="0 0 16 16"><circle class="loader-icon" cx="8px" cy="8px" r="7px"></circle></svg>
190
190
  </span>
191
- `}}customElements.define("eui-loader",S);class M extends HTMLElement{static get observedAttributes(){return["value","intermediate","id"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
191
+ `}}customElements.define("eui-loader",S);class T extends HTMLElement{static get observedAttributes(){return["value","intermediate","id"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
192
192
  <style>
193
193
  .progressbar {
194
194
  width: 100%;
@@ -232,7 +232,7 @@
232
232
  <div class="progressbar">
233
233
  <span class="progress"></span>
234
234
  </div>
235
- `}set value(t){this.setAttribute("value",t)}attributeChangedCallback(){this.connectedCallback()}connectedCallback(){const t=this.shadowRoot.querySelector(".progress");this.hasAttribute("id")&&(this.progress.id=this.getAttribute("id")),this.hasAttribute("intermediate")&&t.classList.add("intermediate"),this.hasAttribute("value")&&(t.style.width=this.getAttribute("value")+"%")}}customElements.define("eui-progressbar",M);const v={is:{iPhone:/iPhone/.test(navigator.userAgent),iPad:/iPad/.test(navigator.userAgent),iOS:/iPhone|iPad|iPod/.test(navigator.userAgent),android:/Android/.test(navigator.userAgent),mobile:/Mobi|Android/i.test(navigator.userAgent)},prefers:{language:navigator.language||navigator.userLanguage,reducedMotion:window.matchMedia("(prefers-reduced-motion: reduce)").matches,reducedTransparency:window.matchMedia("(prefers-reduced-transparency: reduce)").matches},supports:{share:typeof navigator.share=="function",directDownload:"download"in document.createElement("a"),haptics:"vibrate"in navigator||"Vibrate"in window||typeof window.navigator.vibrate=="function"},userAgent:navigator.userAgent},z=Object.freeze(Object.defineProperty({__proto__:null,device:v},Symbol.toStringTag,{value:"Module"}));function T(){try{const o=document.createElement("label");o.ariaHidden="true",o.style.display="none";const t=document.createElement("input");t.type="checkbox",t.setAttribute("switch",""),o.appendChild(t),document.head.appendChild(o),o.click(),document.head.removeChild(o)}catch{}}function x(o){v.supports.haptics?navigator.vibrate(o||50):v.is.iPhone&&T()}const $=Object.freeze(Object.defineProperty({__proto__:null,haptic:x},Symbol.toStringTag,{value:"Module"})),C=(()=>{let o={},t;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(e){console.error(e)}return{get(e){return o[e]},set(e,i){o[e]=i,localStorage.setItem(t,JSON.stringify(o))},delete(e){delete o[e],localStorage.setItem(t,JSON.stringify(o))},all(){return o},clear(){o={},localStorage.setItem(t,JSON.stringify(o))},name(e){t=e;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(i){console.error(i)}},settings:{get(e){return o&&o.settings&&o.settings[e]},set(e,i){o.settings||(o.settings={}),o.settings[e]=i,localStorage.setItem(t,JSON.stringify(o))},delete(e){o.settings&&(delete o.settings[e],localStorage.setItem(t,JSON.stringify(o)))},all(){return o.settings||{}},clear(){o.settings&&(o.settings={},localStorage.setItem(t,JSON.stringify(o)))}}}})(),R=C.settings,H=Object.freeze(Object.defineProperty({__proto__:null,settings:R,storage:C},Symbol.toStringTag,{value:"Module"}));class _ extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
235
+ `}set value(t){this.setAttribute("value",t)}attributeChangedCallback(){this.connectedCallback()}connectedCallback(){const t=this.shadowRoot.querySelector(".progress");this.hasAttribute("id")&&(this.progress.id=this.getAttribute("id")),this.hasAttribute("intermediate")&&t.classList.add("intermediate"),this.hasAttribute("value")&&(t.style.width=this.getAttribute("value")+"%")}}customElements.define("eui-progressbar",T);const v={is:{iPhone:/iPhone/.test(navigator.userAgent),iPad:/iPad/.test(navigator.userAgent),iOS:/iPhone|iPad|iPod/.test(navigator.userAgent),android:/Android/.test(navigator.userAgent),mobile:/Mobi|Android/i.test(navigator.userAgent)},prefers:{language:navigator.language||navigator.userLanguage,reducedMotion:window.matchMedia("(prefers-reduced-motion: reduce)").matches,reducedTransparency:window.matchMedia("(prefers-reduced-transparency: reduce)").matches},supports:{share:typeof navigator.share=="function",directDownload:"download"in document.createElement("a"),haptics:"vibrate"in navigator||"Vibrate"in window||typeof window.navigator.vibrate=="function"},userAgent:navigator.userAgent},z=Object.freeze(Object.defineProperty({__proto__:null,device:v},Symbol.toStringTag,{value:"Module"}));function M(){try{const s=document.createElement("label");s.ariaHidden="true",s.style.display="none";const t=document.createElement("input");t.type="checkbox",t.setAttribute("switch",""),s.appendChild(t),document.head.appendChild(s),s.click(),document.head.removeChild(s)}catch{}}function x(s){v.supports.haptics?navigator.vibrate(s||50):v.is.iPhone&&M()}const $=Object.freeze(Object.defineProperty({__proto__:null,haptic:x},Symbol.toStringTag,{value:"Module"})),C=(()=>{let s={},t;try{s=JSON.parse(localStorage.getItem(t)||"{}")}catch(i){console.error(i)}return{get(i){return s[i]},set(i,e){s[i]=e,localStorage.setItem(t,JSON.stringify(s))},delete(i){delete s[i],localStorage.setItem(t,JSON.stringify(s))},all(){return s},clear(){s={},localStorage.setItem(t,JSON.stringify(s))},name(i){t=i;try{s=JSON.parse(localStorage.getItem(t)||"{}")}catch(e){console.error(e)}},settings:{get(i){return s&&s.settings&&s.settings[i]},set(i,e){s.settings||(s.settings={}),s.settings[i]=e,localStorage.setItem(t,JSON.stringify(s))},delete(i){s.settings&&(delete s.settings[i],localStorage.setItem(t,JSON.stringify(s)))},all(){return s.settings||{}},clear(){s.settings&&(s.settings={},localStorage.setItem(t,JSON.stringify(s)))}}}})(),R=C.settings,H=Object.freeze(Object.defineProperty({__proto__:null,settings:R,storage:C},Symbol.toStringTag,{value:"Module"}));class _ extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
236
236
  <style>
237
237
  .switch {
238
238
  background-color: var(--app-200);
@@ -301,7 +301,7 @@
301
301
  <input type="checkbox" role="switch">
302
302
  <span class="handle"></span>
303
303
  </div>
304
- `}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.switchEl=this.shadowRoot.querySelector(".switch"),this.updateFromAttribute(),this.switchEl.addEventListener("click",()=>this.toggle())}toggle(){this.selected=!this.selected,x(),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}updateFromAttribute(){const t=this.hasAttribute("selected");this.inputEl.checked=t,this.switchEl.classList.toggle("selected",t)}attributeChangedCallback(t,e,i){t==="selected"&&this.inputEl&&this.updateFromAttribute()}get selected(){return this.hasAttribute("selected")}set selected(t){t?this.setAttribute("selected",""):this.removeAttribute("selected")}}customElements.define("eui-switch",_);class F extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.shadowRoot.innerHTML=`
304
+ `}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.switchEl=this.shadowRoot.querySelector(".switch"),this.updateFromAttribute(),this.switchEl.addEventListener("click",()=>this.toggle())}toggle(){this.selected=!this.selected,x(),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}updateFromAttribute(){const t=this.hasAttribute("selected");this.inputEl.checked=t,this.switchEl.classList.toggle("selected",t)}attributeChangedCallback(t,i,e){t==="selected"&&this.inputEl&&this.updateFromAttribute()}get selected(){return this.hasAttribute("selected")}set selected(t){t?this.setAttribute("selected",""):this.removeAttribute("selected")}}customElements.define("eui-switch",_);class F extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.shadowRoot.innerHTML=`
305
305
  <style>
306
306
  :host {
307
307
  display: inline-flex;
@@ -346,7 +346,7 @@
346
346
  }
347
347
  </style>
348
348
  <slot></slot>
349
- `,this.addEventListener("pointerdown",t=>{const e=document.createElement("span"),i=t.currentTarget,a=Math.max(i.offsetWidth,i.offsetHeight);e.classList.add("ripple"),e.style.left=t.clientX-i.getBoundingClientRect().left-a/2+"px",e.style.top=t.clientY-i.getBoundingClientRect().top-a/2+"px",e.style.width=a+"px",e.style.height=a+"px",this.shadowRoot.appendChild(e),setTimeout(()=>{e.remove()},600)})}}customElements.define("eui-chip",F);const f="",w=(()=>{const o=[];function t(s,d){const h=[],b=s.replace(/:([^/]+)/g,(y,k)=>(h.push(k),"([^/]+)")).replace(/\//g,"\\/"),g=new RegExp(`^${f}${b}$`);o.push({regex:g,paramNames:h,renderFn:d})}function e(s){for(const{regex:d,paramNames:h,renderFn:b}of o){const g=s.match(d);if(g){const y={};return h.forEach((k,K)=>{y[k]=decodeURIComponent(g[K+1])}),{renderFn:b,params:y}}}return null}function i(s,d=!0){s.startsWith(f)||(s=f+(s.startsWith("/")?"":"/")+s);const h=s.split(/[?#]/)[0];if(h===window.location.pathname&&s.includes("#")){d&&history.pushState({},"",s);const g="#"+s.split("#")[1];a(g);return}const b=e(h);if(b)if(d&&history.pushState({},"",s),b.renderFn(b.params),window.dispatchEvent(new CustomEvent("route-changed",{detail:{path:s}})),s.includes("#")){const g="#"+s.split("#")[1];setTimeout(()=>a(g),100)}else{const g=document.getElementById("main");g&&g.scrollTo(0,0)}else n?(d&&history.pushState({},"",s),n()):console.warn(`No route found for ${h}`)}function a(s){if(s)try{const d=document.querySelector(s);d&&d.scrollIntoView({behavior:"smooth"})}catch{console.warn("Invalid hash:",s)}}let n=null;function r(s){n=s}function l(){history.back()}function c(){return window.location.pathname.replace(f,"")||"/"}return window.addEventListener("popstate",()=>{const s=window.location.pathname+window.location.search+window.location.hash;i(s,!1)}),window.addEventListener("click",s=>{if(s.button!==0||s.metaKey||s.altKey||s.ctrlKey||s.shiftKey)return;const d=s.target.closest("a");if(!d||d.hasAttribute("download")||d.getAttribute("target")==="_blank")return;const h=d.getAttribute("href");if(!(!h||h.startsWith("http")&&!h.startsWith(window.location.origin))){if(s.preventDefault(),h.startsWith("#")){history.pushState({},"",h),a(h);return}i(h)}}),{add:t,navigate:i,back:l,location:c,setNotFound:r}})();async function I(o){try{const t=document.getElementById("main");t.classList.add("fade-out"),await new Promise(i=>setTimeout(i,200));const e=await fetch(`/src/pages/${o}.html`).then(i=>i.text());t.innerHTML=e,t.classList.remove("fade-out"),t.classList.add("fade-in"),window.location.hash?setTimeout(()=>{try{const i=document.querySelector(window.location.hash);i&&i.scrollIntoView({behavior:"smooth"})}catch{}},100):t&&t.scrollTo(0,0),setTimeout(()=>{t.classList.remove("fade-in")},200)}catch(t){console.error("Page load failed:",t)}}class j extends HTMLElement{static get observedAttributes(){return["path","icon","label","badge","active","avatar-src","avatar-name"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasRendered||(this.render(),this.setupEventListeners(),this.hasRendered=!0),this.updateContent(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}attributeChangedCallback(t,e,i){if(e!==i&&this.hasRendered){if(t==="active")return;this.updateContent()}}handleClick=()=>{const t=this.getAttribute("path");t&&w.navigate(t)};setupEventListeners(){this.addEventListener("pointerdown",t=>{const e=document.createElement("span"),i=t.currentTarget,a=i.getBoundingClientRect(),n=Math.max(i.offsetWidth,i.offsetHeight),r=n/2;e.classList.add("ripple"),e.style.width=`${n}px`,e.style.height=`${n}px`,e.style.left=`${t.clientX-a.left-r}px`,e.style.top=`${t.clientY-a.top-r}px`,this.shadowRoot.appendChild(e),e.addEventListener("animationend",()=>{e.remove()})})}updateContent(){const t=this.getAttribute("icon"),e=this.getAttribute("avatar-src"),i=this.getAttribute("avatar-name"),a=this.getAttribute("label")||"",n=this.getAttribute("badge"),r=this.shadowRoot.querySelector(".badge");if(n)if(r)r.textContent=n;else{const s=document.createElement("span");s.className="badge",s.textContent=n,this.shadowRoot.appendChild(s)}else r&&r.remove();const l=this.shadowRoot.querySelector("slot[name='icon']");if(l)if(e||i){let s='<eui-avatar size="24"';i&&(s+=` name="${i}"`),s+=">",e&&(s+=`<img src="${e}" alt="${i||"Avatar"}" />`),s+="</eui-avatar>",l.innerHTML=s}else{const s=l.querySelector("eui-icon");t&&s?s.getAttribute("name")!==t&&s.setAttribute("name",t):t?l.innerHTML=`<eui-icon width="24" height="24" name="${t}"></eui-icon>`:l.innerHTML=""}const c=this.shadowRoot.querySelector(".label");c&&(c.textContent=a)}render(){this.shadowRoot.innerHTML=`
349
+ `,this.addEventListener("pointerdown",t=>{const i=document.createElement("span"),e=t.currentTarget,a=Math.max(e.offsetWidth,e.offsetHeight);i.classList.add("ripple"),i.style.left=t.clientX-e.getBoundingClientRect().left-a/2+"px",i.style.top=t.clientY-e.getBoundingClientRect().top-a/2+"px",i.style.width=a+"px",i.style.height=a+"px",this.shadowRoot.appendChild(i),setTimeout(()=>{i.remove()},600)})}}customElements.define("eui-chip",F);const f="",w=(()=>{const s=[];function t(n,d){const h=[],b=n.replace(/:([^/]+)/g,(y,k)=>(h.push(k),"([^/]+)")).replace(/\//g,"\\/"),g=new RegExp(`^${f}${b}$`);s.push({regex:g,paramNames:h,renderFn:d})}function i(n){for(const{regex:d,paramNames:h,renderFn:b}of s){const g=n.match(d);if(g){const y={};return h.forEach((k,Y)=>{y[k]=decodeURIComponent(g[Y+1])}),{renderFn:b,params:y}}}return null}function e(n,d=!0){n.startsWith(f)||(n=f+(n.startsWith("/")?"":"/")+n);const h=n.split(/[?#]/)[0];if(h===window.location.pathname&&n.includes("#")){d&&history.pushState({},"",n);const g="#"+n.split("#")[1];a(g);return}const b=i(h);if(b)if(d&&history.pushState({},"",n),b.renderFn(b.params),window.dispatchEvent(new CustomEvent("route-changed",{detail:{path:n}})),n.includes("#")){const g="#"+n.split("#")[1];setTimeout(()=>a(g),100)}else{const g=document.getElementById("main");g&&g.scrollTo(0,0)}else o?(d&&history.pushState({},"",n),o()):console.warn(`No route found for ${h}`)}function a(n){if(n)try{const d=document.querySelector(n);d&&d.scrollIntoView({behavior:"smooth"})}catch{console.warn("Invalid hash:",n)}}let o=null;function r(n){o=n}function l(){history.back()}function c(){return window.location.pathname.replace(f,"")||"/"}return window.addEventListener("popstate",()=>{const n=window.location.pathname+window.location.search+window.location.hash;e(n,!1)}),window.addEventListener("click",n=>{if(n.button!==0||n.metaKey||n.altKey||n.ctrlKey||n.shiftKey)return;const d=n.target.closest("a");if(!d||d.hasAttribute("download")||d.getAttribute("target")==="_blank")return;const h=d.getAttribute("href");if(!(!h||h.startsWith("http")&&!h.startsWith(window.location.origin))){if(n.preventDefault(),h.startsWith("#")){history.pushState({},"",h),a(h);return}e(h)}}),{add:t,navigate:e,back:l,location:c,setNotFound:r}})();async function I(s){try{const t=document.getElementById("main");t.classList.add("fade-out"),await new Promise(e=>setTimeout(e,200));const i=await fetch(`/src/pages/${s}.html`).then(e=>e.text());t.innerHTML=i,t.classList.remove("fade-out"),t.classList.add("fade-in"),window.location.hash?setTimeout(()=>{try{const e=document.querySelector(window.location.hash);e&&e.scrollIntoView({behavior:"smooth"})}catch{}},100):t&&t.scrollTo(0,0),setTimeout(()=>{t.classList.remove("fade-in")},200)}catch(t){console.error("Page load failed:",t)}}class j extends HTMLElement{static get observedAttributes(){return["path","icon","label","badge","active","avatar-src","avatar-name"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasRendered||(this.render(),this.setupEventListeners(),this.hasRendered=!0),this.updateContent(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}attributeChangedCallback(t,i,e){if(i!==e&&this.hasRendered){if(t==="active")return;this.updateContent()}}handleClick=()=>{const t=this.getAttribute("path");t&&w.navigate(t)};setupEventListeners(){this.addEventListener("pointerdown",t=>{const i=document.createElement("span"),e=t.currentTarget,a=e.getBoundingClientRect(),o=Math.max(e.offsetWidth,e.offsetHeight),r=o/2;i.classList.add("ripple"),i.style.width=`${o}px`,i.style.height=`${o}px`,i.style.left=`${t.clientX-a.left-r}px`,i.style.top=`${t.clientY-a.top-r}px`,this.shadowRoot.appendChild(i),i.addEventListener("animationend",()=>{i.remove()})})}updateContent(){const t=this.getAttribute("icon"),i=this.getAttribute("avatar-src"),e=this.getAttribute("avatar-name"),a=this.getAttribute("label")||"",o=this.getAttribute("badge"),r=this.shadowRoot.querySelector(".badge");if(o)if(r)r.textContent=o;else{const n=document.createElement("span");n.className="badge",n.textContent=o,this.shadowRoot.appendChild(n)}else r&&r.remove();const l=this.shadowRoot.querySelector("slot[name='icon']");if(l)if(i||e){let n='<eui-avatar size="24"';e&&(n+=` name="${e}"`),n+=">",i&&(n+=`<img src="${i}" alt="${e||"Avatar"}" />`),n+="</eui-avatar>",l.innerHTML=n}else{const n=l.querySelector("eui-icon");t&&n?n.getAttribute("name")!==t&&n.setAttribute("name",t):t?l.innerHTML=`<eui-icon width="24" height="24" name="${t}"></eui-icon>`:l.innerHTML=""}const c=this.shadowRoot.querySelector(".label");c&&(c.textContent=a)}render(){this.shadowRoot.innerHTML=`
350
350
  <style>
351
351
  :host {
352
352
  position: relative;
@@ -451,7 +451,7 @@
451
451
  </slot>
452
452
  </div>
453
453
  <span class="label"></span>
454
- `}}customElements.define("eui-nav-item",j);class B extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.updateActiveState(),window.addEventListener("popstate",()=>this.updateActiveState()),window.addEventListener("route-changed",()=>this.updateActiveState()),window.addEventListener("toggle-nav",()=>this.classList.toggle("expanded"))}render(){this.shadowRoot.innerHTML=`
454
+ `}}customElements.define("eui-nav-item",j);class q extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.updateActiveState(),window.addEventListener("popstate",()=>this.updateActiveState()),window.addEventListener("route-changed",()=>this.updateActiveState()),window.addEventListener("toggle-nav",()=>this.classList.toggle("expanded"))}render(){this.shadowRoot.innerHTML=`
455
455
  <style>
456
456
  :host {
457
457
  position: fixed;
@@ -551,10 +551,10 @@
551
551
  <div class="app-nav-container">
552
552
  <a href="#content" id="skip_navigation_link">Skip To Content</a>
553
553
  <div class="nav-items">
554
- ${this.navItems.map(t=>{if(t.type==="divider")return'<div style="height: 1px; background: var(--app-300); margin: 0.5rem 0;"></div>';const e=t.avatar?.src||"",i=t.avatar?.name||"";return`<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${e}" avatar-name="${i}" label="${t.label}"></eui-nav-item>`}).join("")}
554
+ ${this.navItems.map(t=>{if(t.type==="divider")return'<div style="height: 1px; background: var(--app-300); margin: 0.5rem 0;"></div>';const i=t.avatar?.src||"",e=t.avatar?.name||"";return`<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${i}" avatar-name="${e}" label="${t.label}"></eui-nav-item>`}).join("")}
555
555
  </div>
556
556
  </div>
557
- `}set navItems(t){this._navItems=t,this.render(),this.updateActiveState()}get navItems(){return this._navItems||[]}updateActiveState(t){t||(t=w.location()),t.startsWith("/")||(t="/"+t),this.shadowRoot.querySelectorAll("eui-nav-item").forEach(i=>{i.getAttribute("path")===t?i.setAttribute("active",""):i.removeAttribute("active")})}}customElements.define("eui-app-nav",B);class q extends HTMLElement{static get observedAttributes(){return["type","title","subtitle","img"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
557
+ `}set navItems(t){this._navItems=t,this.render(),this.updateActiveState()}get navItems(){return this._navItems||[]}updateActiveState(t){t||(t=w.location()),t.startsWith("/")||(t="/"+t),this.shadowRoot.querySelectorAll("eui-nav-item").forEach(e=>{e.getAttribute("path")===t?e.setAttribute("active",""):e.removeAttribute("active")})}}customElements.define("eui-app-nav",q);class B extends HTMLElement{static get observedAttributes(){return["type","title","subtitle","img"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
558
558
  <style>
559
559
  :host {
560
560
  border-radius: 24px;
@@ -640,7 +640,7 @@
640
640
  <p></p>
641
641
  </div>
642
642
  </div>
643
- `}connectedCallback(){this.hd=this.shadowRoot.querySelector(".header"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}attributeChangedCallback(t,e,i){const a=this.shadowRoot.querySelector("h1"),n=this.shadowRoot.querySelector("p"),r=this.shadowRoot.querySelector(".img");t==="title"&&(a.textContent=i),t==="subtitle"&&(n.textContent=i),t==="img"&&(r.style.backgroundImage=i?`url(${i})`:"")}}customElements.define("eui-header",q);class N extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
643
+ `}connectedCallback(){this.hd=this.shadowRoot.querySelector(".header"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}attributeChangedCallback(t,i,e){const a=this.shadowRoot.querySelector("h1"),o=this.shadowRoot.querySelector("p"),r=this.shadowRoot.querySelector(".img");t==="title"&&(a.textContent=e),t==="subtitle"&&(o.textContent=e),t==="img"&&(r.style.backgroundImage=e?`url(${e})`:"")}}customElements.define("eui-header",B);class N extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
644
644
  <style>
645
645
  :host {
646
646
  display: inline-block;
@@ -724,7 +724,7 @@
724
724
  <rect class="mark long"></rect>
725
725
  </svg>
726
726
  </div>
727
- `}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.checkEl=this.shadowRoot.querySelector(".checkbox"),this.updateFromAttribute(),this.checkEl.addEventListener("click",()=>this.toggle())}toggle(){this.selected=!this.selected,x(),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}updateFromAttribute(){const t=this.hasAttribute("selected");this.inputEl.checked=t,this.checkEl.classList.toggle("selected",t)}attributeChangedCallback(t,e,i){t==="selected"&&this.inputEl&&this.updateFromAttribute()}get selected(){return this.hasAttribute("selected")}set selected(t){t?this.setAttribute("selected",""):this.removeAttribute("selected")}}customElements.define("eui-checkbox",N);class O extends HTMLElement{static observedAttributes=["type","width","height","border-radius","icon","link","href"];constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){const t=this.getAttribute("href"),e=t?"a":"button";this.shadowRoot.innerHTML=`
727
+ `}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.checkEl=this.shadowRoot.querySelector(".checkbox"),this.updateFromAttribute(),this.checkEl.addEventListener("click",()=>this.toggle())}toggle(){this.selected=!this.selected,x(),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}updateFromAttribute(){const t=this.hasAttribute("selected");this.inputEl.checked=t,this.checkEl.classList.toggle("selected",t)}attributeChangedCallback(t,i,e){t==="selected"&&this.inputEl&&this.updateFromAttribute()}get selected(){return this.hasAttribute("selected")}set selected(t){t?this.setAttribute("selected",""):this.removeAttribute("selected")}}customElements.define("eui-checkbox",N);class O extends HTMLElement{static observedAttributes=["type","width","height","border-radius","icon","link","href"];constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){const t=this.getAttribute("href"),i=t?"a":"button";this.shadowRoot.innerHTML=`
728
728
  <style>
729
729
  button, a {
730
730
  display: flex;
@@ -827,10 +827,10 @@
827
827
  }
828
828
 
829
829
  </style>
830
- <${e}>
830
+ <${i}>
831
831
  <slot></slot>
832
- </${e}>
833
- `;const i=this.shadowRoot.querySelector(e);t&&i.setAttribute("href",t),this.hasAttribute("type")&&i.classList.add(this.getAttribute("type")),this.hasAttribute("icon")&&i.classList.add("icon"),this.hasAttribute("width")&&(i.style.width=this.getAttribute("width")+"px"),this.hasAttribute("height")&&(i.style.height=this.getAttribute("height")+"px"),this.hasAttribute("border-radius")&&(i.style.borderRadius=this.getAttribute("border-radius")+"px"),i.addEventListener("pointerdown",a=>{const n=document.createElement("span"),r=a.currentTarget,l=r.getBoundingClientRect(),c=Math.max(r.offsetWidth,r.offsetHeight),s=c/2;n.classList.add("ripple"),n.style.width=`${c}px`,n.style.height=`${c}px`,n.style.left=`${a.clientX-l.left-s}px`,n.style.top=`${a.clientY-l.top-s}px`,i.appendChild(n),n.addEventListener("animationend",()=>{n.remove()})})}}customElements.define("eui-button",O);class P extends HTMLElement{static get observedAttributes(){return["type","anchor"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render(),this.hd=this.shadowRoot.querySelector(".hd"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}render(){this.shadowRoot.innerHTML=`
832
+ </${i}>
833
+ `;const e=this.shadowRoot.querySelector(i);t&&e.setAttribute("href",t),this.hasAttribute("type")&&e.classList.add(this.getAttribute("type")),this.hasAttribute("icon")&&e.classList.add("icon"),this.hasAttribute("width")&&(e.style.width=this.getAttribute("width")+"px"),this.hasAttribute("height")&&(e.style.height=this.getAttribute("height")+"px"),this.hasAttribute("border-radius")&&(e.style.borderRadius=this.getAttribute("border-radius")+"px"),e.addEventListener("pointerdown",a=>{const o=document.createElement("span"),r=a.currentTarget,l=r.getBoundingClientRect(),c=Math.max(r.offsetWidth,r.offsetHeight),n=c/2;o.classList.add("ripple"),o.style.width=`${c}px`,o.style.height=`${c}px`,o.style.left=`${a.clientX-l.left-n}px`,o.style.top=`${a.clientY-l.top-n}px`,e.appendChild(o),o.addEventListener("animationend",()=>{o.remove()})})}}customElements.define("eui-button",O);class U extends HTMLElement{static get observedAttributes(){return["type","anchor"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render(),this.hd=this.shadowRoot.querySelector(".hd"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}render(){this.shadowRoot.innerHTML=`
834
834
  <style>
835
835
  :host {
836
836
  display: block;
@@ -888,7 +888,7 @@
888
888
  <span class="anchor-hash">#</span>
889
889
  </a>
890
890
  `:""}
891
- `}}customElements.define("eui-heading",P);function V(o){const i=Date.now()-o,a=Math.floor(i/1e3),n=Math.floor(a/60),r=Math.floor(n/60),l=Math.floor(r/24),c=Math.floor(l/30),s=Math.floor(c/12);return s>0?`${s}y`:c>0?`${c}mo`:l>0?`${l}d`:r>0?`${r}h`:n>0?`${n}m`:`${a}s`}function D(o){const i=Date.now()-o,a=Math.floor(i/1e3),n=Math.floor(a/60),r=Math.floor(n/60),l=Math.floor(r/24),c=Math.floor(l/30),s=Math.floor(c/12);return s>0?`${s} year${s>1?"s":""} ago`:c>0?`${c} month${c>1?"s":""} ago`:l>0?`${l} day${l>1?"s":""} ago`:r>0?`${r} hour${r>1?"s":""} ago`:n>0?`${n} minute${n>1?"s":""} ago`:`${a} second${a>1?"s":""} ago`}function U(o){return o.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;").replace(/`/g,"&#96;").replace(/'/g,"&#39;")}function E(o){const t=document.createElement("input");t.value=o,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}const Z=Object.freeze(Object.defineProperty({__proto__:null,copystr:E,joinedAgo:D,sanitize:U,timeAgo:V},Symbol.toStringTag,{value:"Module"}));class X extends HTMLElement{static get observedAttributes(){return["copy","id","type","language"]}constructor(){super(),this.attachShadow({mode:"open"}),this._boundCopy=this._onCopy.bind(this),this._isRendered=!1}connectedCallback(){this._isRendered||(this.render(),this._isRendered=!0)}attributeChangedCallback(t,e,i){this._isRendered&&e!==i&&this.render()}render(){const t=this.hasAttribute("copy"),e=this.getAttribute("language")||"text";this.shadowRoot.innerHTML=`
891
+ `}}customElements.define("eui-heading",U);function P(s){const e=Date.now()-s,a=Math.floor(e/1e3),o=Math.floor(a/60),r=Math.floor(o/60),l=Math.floor(r/24),c=Math.floor(l/30),n=Math.floor(c/12);return n>0?`${n}y`:c>0?`${c}mo`:l>0?`${l}d`:r>0?`${r}h`:o>0?`${o}m`:`${a}s`}function V(s){const e=Date.now()-s,a=Math.floor(e/1e3),o=Math.floor(a/60),r=Math.floor(o/60),l=Math.floor(r/24),c=Math.floor(l/30),n=Math.floor(c/12);return n>0?`${n} year${n>1?"s":""} ago`:c>0?`${c} month${c>1?"s":""} ago`:l>0?`${l} day${l>1?"s":""} ago`:r>0?`${r} hour${r>1?"s":""} ago`:o>0?`${o} minute${o>1?"s":""} ago`:`${a} second${a>1?"s":""} ago`}function D(s){return s.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;").replace(/`/g,"&#96;").replace(/'/g,"&#39;")}function E(s){const t=document.createElement("input");t.value=s,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}const Z=Object.freeze(Object.defineProperty({__proto__:null,copystr:E,joinedAgo:V,sanitize:D,timeAgo:P},Symbol.toStringTag,{value:"Module"}));class X extends HTMLElement{static get observedAttributes(){return["copy","id","type","language"]}constructor(){super(),this.attachShadow({mode:"open"}),this._boundCopy=this._onCopy.bind(this),this._isRendered=!1}connectedCallback(){this._isRendered||(this.render(),this._isRendered=!0)}attributeChangedCallback(t,i,e){this._isRendered&&i!==e&&this.render()}render(){const t=this.hasAttribute("copy"),i=this.getAttribute("language")||"text";this.shadowRoot.innerHTML=`
892
892
  <style>
893
893
  :host {
894
894
  position: relative;
@@ -940,9 +940,9 @@
940
940
  </eui-button>
941
941
 
942
942
  <pre class="${t?"g":""}"><code></code></pre>
943
- `,this.copyBtn=this.shadowRoot.querySelector(".copy"),this.codeEl=this.shadowRoot.querySelector("code");const i=this._getFormattedText();this.codeEl.innerHTML=this._highlight(i,e),t?this.copyBtn.addEventListener("click",this._boundCopy):this.copyBtn.style.display="none"}_getFormattedText(){let e=(this.querySelector("code")||this).innerHTML||"";e=this._unescapeHtml(e),e=e.replace(/^\s*\n/,"").replace(/\n\s*$/,"");const i=e.split(`
944
- `),a=i.filter(r=>r.trim()).map(r=>r.match(/^\s*/)[0].length),n=a.length?Math.min(...a):0;return i.map(r=>r.slice(n)).join(`
945
- `)}_unescapeHtml(t){const e=document.createElement("textarea");return e.innerHTML=t,e.value}_highlight(t,e){t=t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const i={};let a=0;function n(r,l){const c=`__TOKEN_${l}_${a++}__`;return i[c]=`<span class="token ${l}">${r}</span>`,c}return["javascript","js","json","bash","sh","css"].includes(e)?(t=t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g,r=>n(r,"string")),e==="bash"||e==="sh"?t=t.replace(/(#.*$)/gm,r=>n(r,"comment")):e==="css"?t=t.replace(/(\/\*[\s\S]*?\*\/)/g,r=>n(r,"comment")):t=t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm,r=>n(r,"comment"))):["html","xml"].includes(e)&&(t=t.replace(/(&lt;!--[\s\S]*?--&gt;)/g,r=>n(r,"comment")),t=t.replace(/(&lt;\/?[a-z0-9:-]+)/gi,r=>n(r,"tag"))),e==="javascript"||e==="js"||e==="json"?(t=t.replace(/\b(const|let|var|if|else|for|while|return|function|class|import|export|from|default|switch|case|break|continue|new|this|async|await)\b/g,'<span class="token keyword">$1</span>'),t=t.replace(/\b(true|false|null|undefined)\b/g,'<span class="token boolean">$1</span>'),t=t.replace(/\b([a-zA-Z0-9_]+)\s*(?=\()/g,'<span class="token function">$1</span>')):e==="bash"||e==="sh"?(t=t.replace(/\b(npm|npx|node|git|cd|ls|mkdir|rm|mv|cp|echo|cat|sudo|docker|brew|grep|curl|wget|chmod|chown|touch)\b/g,'<span class="token keyword">$1</span>'),t=t.replace(/\b(install|run|build|start|test|dev|init|clone|pull|push|commit|add|checkout|branch|merge)\b/g,'<span class="token function">$1</span>'),t=t.replace(/(\s-+[a-zA-Z0-9-]+)/g,'<span class="token attr-name">$1</span>'),t=t.replace(/(\$[A-Z0-9_]+)/g,'<span class="token number">$1</span>')):e==="html"||e==="xml"?(t=t.replace(/\s([a-z0-9:-]+)=/gi,(r,l)=>" "+n(l,"attr-name")+"="),t=t.replace(/(".*?")/g,r=>n(r,"attr-value")),t=t.replace(/&gt;/g,'<span class="token tag">&gt;</span>')):e==="css"&&(t=t.replace(/([a-z-]+)(?=:)/g,'<span class="token keyword">$1</span>')),Object.keys(i).reverse().forEach(r=>{t=t.replace(r,i[r])}),t}_onCopy(){E(this._getFormattedText());const t=this.copyBtn.querySelector("eui-icon");if(t){const e=t.getAttribute("name");t.setAttribute("name","check"),setTimeout(()=>t.setAttribute("name",e),2e3)}}disconnectedCallback(){this.copyBtn&&this.copyBtn.removeEventListener("click",this._boundCopy)}}customElements.define("eui-code",X);class W extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render(),this.setupEventListeners()}static get observedAttributes(){return["name"]}attributeChangedCallback(t,e,i){t==="name"&&(this.render(),this.setupEventListeners())}setupEventListeners(){const t=this.shadowRoot.querySelector("#nav-toggle");t&&t.addEventListener("click",()=>{window.dispatchEvent(new CustomEvent("toggle-nav"))})}render(){const t=this.getAttribute("name")||"Title";this.shadowRoot.innerHTML=`
943
+ `,this.copyBtn=this.shadowRoot.querySelector(".copy"),this.codeEl=this.shadowRoot.querySelector("code");const e=this._getFormattedText();this.codeEl.innerHTML=this._highlight(e,i),t?this.copyBtn.addEventListener("click",this._boundCopy):this.copyBtn.style.display="none"}_getFormattedText(){let i=(this.querySelector("code")||this).innerHTML||"";i=this._unescapeHtml(i),i=i.replace(/^\s*\n/,"").replace(/\n\s*$/,"");const e=i.split(`
944
+ `),a=e.filter(r=>r.trim()).map(r=>r.match(/^\s*/)[0].length),o=a.length?Math.min(...a):0;return e.map(r=>r.slice(o)).join(`
945
+ `)}_unescapeHtml(t){const i=document.createElement("textarea");return i.innerHTML=t,i.value}_highlight(t,i){t=t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");const e={};let a=0;function o(r,l){const c=`__TOKEN_${l}_${a++}__`;return e[c]=`<span class="token ${l}">${r}</span>`,c}return["javascript","js","json","bash","sh","css"].includes(i)?(t=t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g,r=>o(r,"string")),i==="bash"||i==="sh"?t=t.replace(/(#.*$)/gm,r=>o(r,"comment")):i==="css"?t=t.replace(/(\/\*[\s\S]*?\*\/)/g,r=>o(r,"comment")):t=t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm,r=>o(r,"comment"))):["html","xml"].includes(i)&&(t=t.replace(/(&lt;!--[\s\S]*?--&gt;)/g,r=>o(r,"comment")),t=t.replace(/(&lt;\/?[a-z0-9:-]+)/gi,r=>o(r,"tag"))),i==="javascript"||i==="js"||i==="json"?(t=t.replace(/\b(const|let|var|if|else|for|while|return|function|class|import|export|from|default|switch|case|break|continue|new|this|async|await)\b/g,'<span class="token keyword">$1</span>'),t=t.replace(/\b(true|false|null|undefined)\b/g,'<span class="token boolean">$1</span>'),t=t.replace(/\b([a-zA-Z0-9_]+)\s*(?=\()/g,'<span class="token function">$1</span>')):i==="bash"||i==="sh"?(t=t.replace(/\b(npm|npx|node|git|cd|ls|mkdir|rm|mv|cp|echo|cat|sudo|docker|brew|grep|curl|wget|chmod|chown|touch)\b/g,'<span class="token keyword">$1</span>'),t=t.replace(/\b(install|run|build|start|test|dev|init|clone|pull|push|commit|add|checkout|branch|merge)\b/g,'<span class="token function">$1</span>'),t=t.replace(/(\s-+[a-zA-Z0-9-]+)/g,'<span class="token attr-name">$1</span>'),t=t.replace(/(\$[A-Z0-9_]+)/g,'<span class="token number">$1</span>')):i==="html"||i==="xml"?(t=t.replace(/\s([a-z0-9:-]+)=/gi,(r,l)=>" "+o(l,"attr-name")+"="),t=t.replace(/(".*?")/g,r=>o(r,"attr-value")),t=t.replace(/&gt;/g,'<span class="token tag">&gt;</span>')):i==="css"&&(t=t.replace(/([a-z-]+)(?=:)/g,'<span class="token keyword">$1</span>')),Object.keys(e).reverse().forEach(r=>{t=t.replace(r,e[r])}),t}_onCopy(){E(this._getFormattedText());const t=this.copyBtn.querySelector("eui-icon");if(t){const i=t.getAttribute("name");t.setAttribute("name","check"),setTimeout(()=>t.setAttribute("name",i),2e3)}}disconnectedCallback(){this.copyBtn&&this.copyBtn.removeEventListener("click",this._boundCopy)}}customElements.define("eui-code",X);class W extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render(),this.setupEventListeners()}static get observedAttributes(){return["name"]}attributeChangedCallback(t,i,e){t==="name"&&(this.render(),this.setupEventListeners())}setupEventListeners(){const t=this.shadowRoot.querySelector("#nav-toggle");t&&t.addEventListener("click",()=>{window.dispatchEvent(new CustomEvent("toggle-nav"))})}render(){const t=this.getAttribute("name")||"Title";this.shadowRoot.innerHTML=`
946
946
  <style>
947
947
  :host {
948
948
  display: block;
@@ -1034,7 +1034,7 @@
1034
1034
  <slot></slot>
1035
1035
  </div>
1036
1036
  </div>
1037
- `}}customElements.define("eui-app-titlebar",W);class J extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this._handleMouseDown=this._addRipple.bind(this)}connectedCallback(){this.render(),this.setupEventListeners()}static get observedAttributes(){return["elevated","interactive","ripple"]}attributeChangedCallback(t,e,i){e!==i&&t==="ripple"&&this.setupEventListeners()}setupEventListeners(){this.removeEventListener("mousedown",this._handleMouseDown),this.hasAttribute("ripple")&&this.addEventListener("mousedown",this._handleMouseDown)}_addRipple(t){const e=this.getBoundingClientRect(),i=document.createElement("span"),a=Math.max(e.width,e.height),n=a/2;i.style.width=i.style.height=`${a}px`,i.style.left=`${t.clientX-e.left-n}px`,i.style.top=`${t.clientY-e.top-n}px`,i.classList.add("ripple"),this.shadowRoot.querySelector(".surface").appendChild(i),i.addEventListener("animationend",()=>{i.remove()})}render(){this.shadowRoot.innerHTML=`
1037
+ `}}customElements.define("eui-app-titlebar",W);class J extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"}),this._handleMouseDown=this._addRipple.bind(this)}connectedCallback(){this.render(),this.setupEventListeners()}static get observedAttributes(){return["elevated","interactive","ripple"]}attributeChangedCallback(t,i,e){i!==e&&t==="ripple"&&this.setupEventListeners()}setupEventListeners(){this.removeEventListener("mousedown",this._handleMouseDown),this.hasAttribute("ripple")&&this.addEventListener("mousedown",this._handleMouseDown)}_addRipple(t){const i=this.getBoundingClientRect(),e=document.createElement("span"),a=Math.max(i.width,i.height),o=a/2;e.style.width=e.style.height=`${a}px`,e.style.left=`${t.clientX-i.left-o}px`,e.style.top=`${t.clientY-i.top-o}px`,e.classList.add("ripple"),this.shadowRoot.querySelector(".surface").appendChild(e),e.addEventListener("animationend",()=>{e.remove()})}render(){this.shadowRoot.innerHTML=`
1038
1038
  <style>
1039
1039
  :host {
1040
1040
  display: block;
@@ -1095,4 +1095,99 @@
1095
1095
  <div class="surface">
1096
1096
  <slot></slot>
1097
1097
  </div>
1098
- `}}customElements.define("eui-surface",J),typeof window<"u"&&console.log("ErisUI loaded successfully"),p.device=z,p.haptics=$,p.icons=u,p.loadPage=I,p.router=w,p.storage=H,p.utils=Z,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
1098
+ `}}customElements.define("eui-surface",J);class K extends HTMLElement{static get observedAttributes(){return["value","min","max","step","label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
1099
+ <style>
1100
+ :host {
1101
+ display: flex;
1102
+ flex-direction: column;
1103
+ gap: 8px;
1104
+ width: 100%;
1105
+ max-width: 300px;
1106
+ margin: 0.75rem 0;
1107
+ user-select: none;
1108
+ }
1109
+
1110
+ .header {
1111
+ display: flex;
1112
+ justify-content: space-between;
1113
+ align-items: center;
1114
+ font-size: 0.85rem;
1115
+ font-weight: 500;
1116
+ padding: 0 4px;
1117
+ }
1118
+
1119
+ .slider-container {
1120
+ position: relative;
1121
+ height: 32px;
1122
+ display: flex;
1123
+ align-items: center;
1124
+ }
1125
+
1126
+ input[type="range"] {
1127
+ -webkit-appearance: none;
1128
+ appearance: none;
1129
+ opacity: 0;
1130
+ width: 100%;
1131
+ height: 4px;
1132
+ background: var(--app-300, #333);
1133
+ border-radius: 3px;
1134
+ outline: none;
1135
+ margin: 0;
1136
+ cursor: pointer;
1137
+ position: relative;
1138
+ z-index: 1;
1139
+ }
1140
+
1141
+ .track {
1142
+ position: absolute;
1143
+ height: 4px;
1144
+ width: 100%;
1145
+ background: var(--app-200, #333);
1146
+ border-radius: 3px;
1147
+ overflow: hidden;
1148
+ pointer-events: none;
1149
+ z-index: 0;
1150
+ }
1151
+
1152
+ .track-fill {
1153
+ position: absolute;
1154
+ height: 4px;
1155
+ background: var(--app-accent, #6366f1);
1156
+ pointer-events: none;
1157
+ z-index: 0;
1158
+ left: 0;
1159
+ }
1160
+
1161
+ .slider-thumb {
1162
+ position: absolute;
1163
+ width: 20px;
1164
+ height: 20px;
1165
+ background: var(--app-accent, #6366f1);
1166
+ box-shadow: inset 0 0 0 1px var(--app-500, #131318), inset 0 0 0 4px var(--app-200, #131318);
1167
+ border-radius: 50%;
1168
+ pointer-events: none;
1169
+ z-index: 0;
1170
+ left: 0;
1171
+ }
1172
+
1173
+ .slider-thumb.active {
1174
+ background: var(--app-accent-50, #7376ff);
1175
+ }
1176
+
1177
+ .value-badge {
1178
+ color: var(--app-text);
1179
+ font-weight: 600;
1180
+ }
1181
+ </style>
1182
+ <div class="header">
1183
+ <span class="label"></span>
1184
+ <span class="value-badge"></span>
1185
+ </div>
1186
+ <div class="slider-container">
1187
+ <div class="track">
1188
+ <div class="track-fill"></div>
1189
+ </div>
1190
+ <div class="slider-thumb"></div>
1191
+ <input type="range">
1192
+ </div>
1193
+ `}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.labelEl=this.shadowRoot.querySelector(".label"),this.valueEl=this.shadowRoot.querySelector(".value-badge"),this.trackFillEl=this.shadowRoot.querySelector(".track-fill"),this.sliderThumbEl=this.shadowRoot.querySelector(".slider-thumb"),this.inputEl.min=this.getAttribute("min")||0,this.inputEl.max=this.getAttribute("max")||100,this.inputEl.step=this.getAttribute("step")||1,this.inputEl.value=this.getAttribute("value")||50,this.hasAttribute("label")&&(this.labelEl.textContent=this.getAttribute("label")),this.updateUI(),this.inputEl.addEventListener("input",()=>{this.updateValue(this.inputEl.value),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("change",()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("mousedown",()=>this.sliderThumbEl.classList.add("active")),this.inputEl.addEventListener("touchstart",()=>this.sliderThumbEl.classList.add("active"),{passive:!0}),window.addEventListener("mouseup",()=>this.sliderThumbEl.classList.remove("active")),window.addEventListener("touchend",()=>this.sliderThumbEl.classList.remove("active"))}updateValue(t){this.setAttribute("value",t),this.updateUI()}updateUI(){if(!this.inputEl)return;const t=parseFloat(this.inputEl.min),i=parseFloat(this.inputEl.max),e=parseFloat(this.inputEl.value),a=(e-t)/(i-t)*100;this.trackFillEl.style.width=`${a}%`,this.sliderThumbEl.style.left=`calc(${a}% - ${a/100*20}px)`,this.valueEl.textContent=e}attributeChangedCallback(t,i,e){this.inputEl&&(t==="value"&&e!==this.inputEl.value?(this.inputEl.value=e,this.updateUI()):["min","max","step"].includes(t)?(this.inputEl[t]=e,this.updateUI()):t==="label"&&(this.labelEl.textContent=e))}get value(){return parseFloat(this.inputEl.value)}set value(t){this.setAttribute("value",t)}}customElements.define("eui-slider",K),typeof window<"u"&&console.log("ErisUI loaded successfully"),p.device=z,p.haptics=$,p.icons=u,p.loadPage=I,p.router=w,p.storage=H,p.utils=Z,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
package/dist/erisui.mjs CHANGED
@@ -52,17 +52,17 @@ class E extends HTMLElement {
52
52
  }
53
53
  connectedCallback() {
54
54
  this.avatar = this.shadowRoot.querySelector(".avatar"), this.initials = this.shadowRoot.querySelector("#initials");
55
- const t = this.shadowRoot.querySelector("slot"), e = t && t.assignedNodes().length > 0;
56
- if (e) {
57
- const i = t.assignedNodes()[0];
58
- i && i.tagName === "IMG" && (this.initials.style.display = "none", this.avatar.style.backgroundColor = "transparent");
55
+ const t = this.shadowRoot.querySelector("slot"), i = t && t.assignedNodes().length > 0;
56
+ if (i) {
57
+ const e = t.assignedNodes()[0];
58
+ e && e.tagName === "IMG" && (this.initials.style.display = "none", this.avatar.style.backgroundColor = "transparent");
59
59
  } else
60
60
  this.hasAttribute("color") && (this.avatar.style.backgroundColor = this.getAttribute("color"));
61
61
  if (this.hasAttribute("color") && (this.avatar.style.backgroundColor = this.getAttribute("color")), this.hasAttribute("size")) {
62
- const i = this.getAttribute("size");
63
- this.avatar.style.width = i + "px", this.avatar.style.height = i + "px", this.initials.style.fontSize = i / 2 + "px";
62
+ const e = this.getAttribute("size");
63
+ this.avatar.style.width = e + "px", this.avatar.style.height = e + "px", this.initials.style.fontSize = e / 2 + "px";
64
64
  }
65
- if (this.hasAttribute("border-radius") && (this.avatar.style.borderRadius = this.getAttribute("border-radius") + "px"), this.hasAttribute("name") && (this.avatar.title = this.getAttribute("name")), !e && this.hasAttribute("name")) {
65
+ if (this.hasAttribute("border-radius") && (this.avatar.style.borderRadius = this.getAttribute("border-radius") + "px"), this.hasAttribute("name") && (this.avatar.title = this.getAttribute("name")), !i && this.hasAttribute("name")) {
66
66
  const a = this.getAttribute("name").trim().split(/\s+/);
67
67
  let n = "";
68
68
  a.length === 1 ? n = a[0][0] || "" : n = (a[0][0] || "") + (a[a.length - 1][0] || ""), this.initials.textContent = n.toUpperCase();
@@ -71,13 +71,13 @@ class E extends HTMLElement {
71
71
  }
72
72
  customElements.define("eui-avatar", E);
73
73
  const u = /* @__PURE__ */ (() => {
74
- let o = {};
74
+ let s = {};
75
75
  return {
76
- register(t, e) {
77
- o[t] = e;
76
+ register(t, i) {
77
+ s[t] = i;
78
78
  },
79
79
  get(t) {
80
- return o[t] || "";
80
+ return s[t] || "";
81
81
  }
82
82
  };
83
83
  })();
@@ -104,14 +104,14 @@ class A extends HTMLElement {
104
104
  this.render();
105
105
  }
106
106
  render() {
107
- const t = this.getAttribute("name"), e = u.get(t);
108
- if (!e) {
107
+ const t = this.getAttribute("name"), i = u.get(t);
108
+ if (!i) {
109
109
  this.shadowRoot.innerHTML = '<span style="color:red;">?</span>';
110
110
  return;
111
111
  }
112
- const i = document.createElement("template");
113
- i.innerHTML = e.trim();
114
- const a = i.content.cloneNode(!0), n = a.firstElementChild;
112
+ const e = document.createElement("template");
113
+ e.innerHTML = i.trim();
114
+ const a = e.content.cloneNode(!0), n = a.firstElementChild;
115
115
  if (n && n.style) {
116
116
  const r = this.getAttribute("width"), l = this.getAttribute("height");
117
117
  r && n.setAttribute("width", r), l && n.setAttribute("height", l), n.style.display = "block";
@@ -234,17 +234,17 @@ class L extends HTMLElement {
234
234
  this.dispatchEvent(new Event("change", { bubbles: !0, composed: !0 }));
235
235
  });
236
236
  }
237
- attributeChangedCallback(t, e, i) {
237
+ attributeChangedCallback(t, i, e) {
238
238
  if (!(!this.inputEl || !this.labelEl))
239
239
  switch (t) {
240
240
  case "value":
241
- this.inputEl.value !== i && (this.inputEl.value = i);
241
+ this.inputEl.value !== e && (this.inputEl.value = e);
242
242
  break;
243
243
  case "id":
244
- this.inputEl.id = i;
244
+ this.inputEl.id = e;
245
245
  break;
246
246
  case "label":
247
- this.labelEl.textContent = i;
247
+ this.labelEl.textContent = e;
248
248
  break;
249
249
  }
250
250
  }
@@ -390,77 +390,77 @@ const v = {
390
390
  haptics: "vibrate" in navigator || "Vibrate" in window || typeof window.navigator.vibrate == "function"
391
391
  },
392
392
  userAgent: navigator.userAgent
393
- }, U = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
393
+ }, Z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
394
394
  __proto__: null,
395
395
  device: v
396
396
  }, Symbol.toStringTag, { value: "Module" }));
397
- function M() {
397
+ function T() {
398
398
  try {
399
- const o = document.createElement("label");
400
- o.ariaHidden = "true", o.style.display = "none";
399
+ const s = document.createElement("label");
400
+ s.ariaHidden = "true", s.style.display = "none";
401
401
  const t = document.createElement("input");
402
- t.type = "checkbox", t.setAttribute("switch", ""), o.appendChild(t), document.head.appendChild(o), o.click(), document.head.removeChild(o);
402
+ t.type = "checkbox", t.setAttribute("switch", ""), s.appendChild(t), document.head.appendChild(s), s.click(), document.head.removeChild(s);
403
403
  } catch {
404
404
  }
405
405
  }
406
- function x(o) {
407
- v.supports.haptics ? navigator.vibrate(o || 50) : v.is.iPhone && M();
406
+ function x(s) {
407
+ v.supports.haptics ? navigator.vibrate(s || 50) : v.is.iPhone && T();
408
408
  }
409
- const Z = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
409
+ const X = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
410
410
  __proto__: null,
411
411
  haptic: x
412
412
  }, Symbol.toStringTag, { value: "Module" })), w = (() => {
413
- let o = {}, t;
413
+ let s = {}, t;
414
414
  try {
415
- o = JSON.parse(localStorage.getItem(t) || "{}");
416
- } catch (e) {
417
- console.error(e);
415
+ s = JSON.parse(localStorage.getItem(t) || "{}");
416
+ } catch (i) {
417
+ console.error(i);
418
418
  }
419
419
  return {
420
- get(e) {
421
- return o[e];
420
+ get(i) {
421
+ return s[i];
422
422
  },
423
- set(e, i) {
424
- o[e] = i, localStorage.setItem(t, JSON.stringify(o));
423
+ set(i, e) {
424
+ s[i] = e, localStorage.setItem(t, JSON.stringify(s));
425
425
  },
426
- delete(e) {
427
- delete o[e], localStorage.setItem(t, JSON.stringify(o));
426
+ delete(i) {
427
+ delete s[i], localStorage.setItem(t, JSON.stringify(s));
428
428
  },
429
429
  all() {
430
- return o;
430
+ return s;
431
431
  },
432
432
  clear() {
433
- o = {}, localStorage.setItem(t, JSON.stringify(o));
433
+ s = {}, localStorage.setItem(t, JSON.stringify(s));
434
434
  },
435
- name(e) {
436
- t = e;
435
+ name(i) {
436
+ t = i;
437
437
  try {
438
- o = JSON.parse(localStorage.getItem(t) || "{}");
439
- } catch (i) {
440
- console.error(i);
438
+ s = JSON.parse(localStorage.getItem(t) || "{}");
439
+ } catch (e) {
440
+ console.error(e);
441
441
  }
442
442
  },
443
443
  settings: {
444
- get(e) {
445
- return o && o.settings && o.settings[e];
444
+ get(i) {
445
+ return s && s.settings && s.settings[i];
446
446
  },
447
- set(e, i) {
448
- o.settings || (o.settings = {}), o.settings[e] = i, localStorage.setItem(t, JSON.stringify(o));
447
+ set(i, e) {
448
+ s.settings || (s.settings = {}), s.settings[i] = e, localStorage.setItem(t, JSON.stringify(s));
449
449
  },
450
- delete(e) {
451
- o.settings && (delete o.settings[e], localStorage.setItem(t, JSON.stringify(o)));
450
+ delete(i) {
451
+ s.settings && (delete s.settings[i], localStorage.setItem(t, JSON.stringify(s)));
452
452
  },
453
453
  all() {
454
- return o.settings || {};
454
+ return s.settings || {};
455
455
  },
456
456
  clear() {
457
- o.settings && (o.settings = {}, localStorage.setItem(t, JSON.stringify(o)));
457
+ s.settings && (s.settings = {}, localStorage.setItem(t, JSON.stringify(s)));
458
458
  }
459
459
  }
460
460
  };
461
- })(), T = w.settings, X = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
461
+ })(), M = w.settings, W = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
462
462
  __proto__: null,
463
- settings: T,
463
+ settings: M,
464
464
  storage: w
465
465
  }, Symbol.toStringTag, { value: "Module" }));
466
466
  class $ extends HTMLElement {
@@ -549,7 +549,7 @@ class $ extends HTMLElement {
549
549
  const t = this.hasAttribute("selected");
550
550
  this.inputEl.checked = t, this.switchEl.classList.toggle("selected", t);
551
551
  }
552
- attributeChangedCallback(t, e, i) {
552
+ attributeChangedCallback(t, i, e) {
553
553
  t === "selected" && this.inputEl && this.updateFromAttribute();
554
554
  }
555
555
  get selected() {
@@ -611,23 +611,23 @@ class R extends HTMLElement {
611
611
  </style>
612
612
  <slot></slot>
613
613
  `, this.addEventListener("pointerdown", (t) => {
614
- const e = document.createElement("span"), i = t.currentTarget, a = Math.max(i.offsetWidth, i.offsetHeight);
615
- e.classList.add("ripple"), e.style.left = t.clientX - i.getBoundingClientRect().left - a / 2 + "px", e.style.top = t.clientY - i.getBoundingClientRect().top - a / 2 + "px", e.style.width = a + "px", e.style.height = a + "px", this.shadowRoot.appendChild(e), setTimeout(() => {
616
- e.remove();
614
+ const i = document.createElement("span"), e = t.currentTarget, a = Math.max(e.offsetWidth, e.offsetHeight);
615
+ i.classList.add("ripple"), i.style.left = t.clientX - e.getBoundingClientRect().left - a / 2 + "px", i.style.top = t.clientY - e.getBoundingClientRect().top - a / 2 + "px", i.style.width = a + "px", i.style.height = a + "px", this.shadowRoot.appendChild(i), setTimeout(() => {
616
+ i.remove();
617
617
  }, 600);
618
618
  });
619
619
  }
620
620
  }
621
621
  customElements.define("eui-chip", R);
622
622
  const b = "", y = (() => {
623
- const o = [];
624
- function t(s, d) {
625
- const h = [], g = s.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${b}${g}$`);
626
- o.push({ regex: p, paramNames: h, renderFn: d });
627
- }
628
- function e(s) {
629
- for (const { regex: d, paramNames: h, renderFn: g } of o) {
630
- const p = s.match(d);
623
+ const s = [];
624
+ function t(o, d) {
625
+ const h = [], g = o.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${b}${g}$`);
626
+ s.push({ regex: p, paramNames: h, renderFn: d });
627
+ }
628
+ function i(o) {
629
+ for (const { regex: d, paramNames: h, renderFn: g } of s) {
630
+ const p = o.match(d);
631
631
  if (p) {
632
632
  const m = {};
633
633
  return h.forEach((f, C) => {
@@ -637,38 +637,38 @@ const b = "", y = (() => {
637
637
  }
638
638
  return null;
639
639
  }
640
- function i(s, d = !0) {
641
- s.startsWith(b) || (s = b + (s.startsWith("/") ? "" : "/") + s);
642
- const h = s.split(/[?#]/)[0];
643
- if (h === window.location.pathname && s.includes("#")) {
644
- d && history.pushState({}, "", s);
645
- const p = "#" + s.split("#")[1];
640
+ function e(o, d = !0) {
641
+ o.startsWith(b) || (o = b + (o.startsWith("/") ? "" : "/") + o);
642
+ const h = o.split(/[?#]/)[0];
643
+ if (h === window.location.pathname && o.includes("#")) {
644
+ d && history.pushState({}, "", o);
645
+ const p = "#" + o.split("#")[1];
646
646
  a(p);
647
647
  return;
648
648
  }
649
- const g = e(h);
649
+ const g = i(h);
650
650
  if (g)
651
- if (d && history.pushState({}, "", s), g.renderFn(g.params), window.dispatchEvent(new CustomEvent("route-changed", { detail: { path: s } })), s.includes("#")) {
652
- const p = "#" + s.split("#")[1];
651
+ if (d && history.pushState({}, "", o), g.renderFn(g.params), window.dispatchEvent(new CustomEvent("route-changed", { detail: { path: o } })), o.includes("#")) {
652
+ const p = "#" + o.split("#")[1];
653
653
  setTimeout(() => a(p), 100);
654
654
  } else {
655
655
  const p = document.getElementById("main");
656
656
  p && p.scrollTo(0, 0);
657
657
  }
658
- else n ? (d && history.pushState({}, "", s), n()) : console.warn(`No route found for ${h}`);
658
+ else n ? (d && history.pushState({}, "", o), n()) : console.warn(`No route found for ${h}`);
659
659
  }
660
- function a(s) {
661
- if (s)
660
+ function a(o) {
661
+ if (o)
662
662
  try {
663
- const d = document.querySelector(s);
663
+ const d = document.querySelector(o);
664
664
  d && d.scrollIntoView({ behavior: "smooth" });
665
665
  } catch {
666
- console.warn("Invalid hash:", s);
666
+ console.warn("Invalid hash:", o);
667
667
  }
668
668
  }
669
669
  let n = null;
670
- function r(s) {
671
- n = s;
670
+ function r(o) {
671
+ n = o;
672
672
  }
673
673
  function l() {
674
674
  history.back();
@@ -677,31 +677,31 @@ const b = "", y = (() => {
677
677
  return window.location.pathname.replace(b, "") || "/";
678
678
  }
679
679
  return window.addEventListener("popstate", () => {
680
- const s = window.location.pathname + window.location.search + window.location.hash;
681
- i(s, !1);
682
- }), window.addEventListener("click", (s) => {
683
- if (s.button !== 0 || s.metaKey || s.altKey || s.ctrlKey || s.shiftKey) return;
684
- const d = s.target.closest("a");
680
+ const o = window.location.pathname + window.location.search + window.location.hash;
681
+ e(o, !1);
682
+ }), window.addEventListener("click", (o) => {
683
+ if (o.button !== 0 || o.metaKey || o.altKey || o.ctrlKey || o.shiftKey) return;
684
+ const d = o.target.closest("a");
685
685
  if (!d || d.hasAttribute("download") || d.getAttribute("target") === "_blank") return;
686
686
  const h = d.getAttribute("href");
687
687
  if (!(!h || h.startsWith("http") && !h.startsWith(window.location.origin))) {
688
- if (s.preventDefault(), h.startsWith("#")) {
688
+ if (o.preventDefault(), h.startsWith("#")) {
689
689
  history.pushState({}, "", h), a(h);
690
690
  return;
691
691
  }
692
- i(h);
692
+ e(h);
693
693
  }
694
- }), { add: t, navigate: i, back: l, location: c, setNotFound: r };
694
+ }), { add: t, navigate: e, back: l, location: c, setNotFound: r };
695
695
  })();
696
- async function W(o) {
696
+ async function J(s) {
697
697
  try {
698
698
  const t = document.getElementById("main");
699
- t.classList.add("fade-out"), await new Promise((i) => setTimeout(i, 200));
700
- const e = await fetch(`/src/pages/${o}.html`).then((i) => i.text());
701
- t.innerHTML = e, t.classList.remove("fade-out"), t.classList.add("fade-in"), window.location.hash ? setTimeout(() => {
699
+ t.classList.add("fade-out"), await new Promise((e) => setTimeout(e, 200));
700
+ const i = await fetch(`/src/pages/${s}.html`).then((e) => e.text());
701
+ t.innerHTML = i, t.classList.remove("fade-out"), t.classList.add("fade-in"), window.location.hash ? setTimeout(() => {
702
702
  try {
703
- const i = document.querySelector(window.location.hash);
704
- i && i.scrollIntoView({ behavior: "smooth" });
703
+ const e = document.querySelector(window.location.hash);
704
+ e && e.scrollIntoView({ behavior: "smooth" });
705
705
  } catch {
706
706
  }
707
707
  }, 100) : t && t.scrollTo(0, 0), setTimeout(() => {
@@ -724,8 +724,8 @@ class H extends HTMLElement {
724
724
  disconnectedCallback() {
725
725
  this.removeEventListener("click", this.handleClick);
726
726
  }
727
- attributeChangedCallback(t, e, i) {
728
- if (e !== i && this.hasRendered) {
727
+ attributeChangedCallback(t, i, e) {
728
+ if (i !== e && this.hasRendered) {
729
729
  if (t === "active")
730
730
  return;
731
731
  this.updateContent();
@@ -737,30 +737,30 @@ class H extends HTMLElement {
737
737
  };
738
738
  setupEventListeners() {
739
739
  this.addEventListener("pointerdown", (t) => {
740
- const e = document.createElement("span"), i = t.currentTarget, a = i.getBoundingClientRect(), n = Math.max(i.offsetWidth, i.offsetHeight), r = n / 2;
741
- e.classList.add("ripple"), e.style.width = `${n}px`, e.style.height = `${n}px`, e.style.left = `${t.clientX - a.left - r}px`, e.style.top = `${t.clientY - a.top - r}px`, this.shadowRoot.appendChild(e), e.addEventListener("animationend", () => {
742
- e.remove();
740
+ const i = document.createElement("span"), e = t.currentTarget, a = e.getBoundingClientRect(), n = Math.max(e.offsetWidth, e.offsetHeight), r = n / 2;
741
+ i.classList.add("ripple"), i.style.width = `${n}px`, i.style.height = `${n}px`, i.style.left = `${t.clientX - a.left - r}px`, i.style.top = `${t.clientY - a.top - r}px`, this.shadowRoot.appendChild(i), i.addEventListener("animationend", () => {
742
+ i.remove();
743
743
  });
744
744
  });
745
745
  }
746
746
  updateContent() {
747
- const t = this.getAttribute("icon"), e = this.getAttribute("avatar-src"), i = this.getAttribute("avatar-name"), a = this.getAttribute("label") || "", n = this.getAttribute("badge"), r = this.shadowRoot.querySelector(".badge");
747
+ const t = this.getAttribute("icon"), i = this.getAttribute("avatar-src"), e = this.getAttribute("avatar-name"), a = this.getAttribute("label") || "", n = this.getAttribute("badge"), r = this.shadowRoot.querySelector(".badge");
748
748
  if (n)
749
749
  if (r)
750
750
  r.textContent = n;
751
751
  else {
752
- const s = document.createElement("span");
753
- s.className = "badge", s.textContent = n, this.shadowRoot.appendChild(s);
752
+ const o = document.createElement("span");
753
+ o.className = "badge", o.textContent = n, this.shadowRoot.appendChild(o);
754
754
  }
755
755
  else r && r.remove();
756
756
  const l = this.shadowRoot.querySelector("slot[name='icon']");
757
757
  if (l)
758
- if (e || i) {
759
- let s = '<eui-avatar size="24"';
760
- i && (s += ` name="${i}"`), s += ">", e && (s += `<img src="${e}" alt="${i || "Avatar"}" />`), s += "</eui-avatar>", l.innerHTML = s;
758
+ if (i || e) {
759
+ let o = '<eui-avatar size="24"';
760
+ e && (o += ` name="${e}"`), o += ">", i && (o += `<img src="${i}" alt="${e || "Avatar"}" />`), o += "</eui-avatar>", l.innerHTML = o;
761
761
  } else {
762
- const s = l.querySelector("eui-icon");
763
- t && s ? s.getAttribute("name") !== t && s.setAttribute("name", t) : t ? l.innerHTML = `<eui-icon width="24" height="24" name="${t}"></eui-icon>` : l.innerHTML = "";
762
+ const o = l.querySelector("eui-icon");
763
+ t && o ? o.getAttribute("name") !== t && o.setAttribute("name", t) : t ? l.innerHTML = `<eui-icon width="24" height="24" name="${t}"></eui-icon>` : l.innerHTML = "";
764
764
  }
765
765
  const c = this.shadowRoot.querySelector(".label");
766
766
  c && (c.textContent = a);
@@ -986,8 +986,8 @@ class _ extends HTMLElement {
986
986
  ${this.navItems.map((t) => {
987
987
  if (t.type === "divider")
988
988
  return '<div style="height: 1px; background: var(--app-300); margin: 0.5rem 0;"></div>';
989
- const e = t.avatar?.src || "", i = t.avatar?.name || "";
990
- return `<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${e}" avatar-name="${i}" label="${t.label}"></eui-nav-item>`;
989
+ const i = t.avatar?.src || "", e = t.avatar?.name || "";
990
+ return `<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${i}" avatar-name="${e}" label="${t.label}"></eui-nav-item>`;
991
991
  }).join("")}
992
992
  </div>
993
993
  </div>
@@ -1000,8 +1000,8 @@ class _ extends HTMLElement {
1000
1000
  return this._navItems || [];
1001
1001
  }
1002
1002
  updateActiveState(t) {
1003
- t || (t = y.location()), t.startsWith("/") || (t = "/" + t), this.shadowRoot.querySelectorAll("eui-nav-item").forEach((i) => {
1004
- i.getAttribute("path") === t ? i.setAttribute("active", "") : i.removeAttribute("active");
1003
+ t || (t = y.location()), t.startsWith("/") || (t = "/" + t), this.shadowRoot.querySelectorAll("eui-nav-item").forEach((e) => {
1004
+ e.getAttribute("path") === t ? e.setAttribute("active", "") : e.removeAttribute("active");
1005
1005
  });
1006
1006
  }
1007
1007
  }
@@ -1102,9 +1102,9 @@ class F extends HTMLElement {
1102
1102
  connectedCallback() {
1103
1103
  this.hd = this.shadowRoot.querySelector(".header"), this.hasAttribute("type") && this.hd.classList.add(this.getAttribute("type"));
1104
1104
  }
1105
- attributeChangedCallback(t, e, i) {
1105
+ attributeChangedCallback(t, i, e) {
1106
1106
  const a = this.shadowRoot.querySelector("h1"), n = this.shadowRoot.querySelector("p"), r = this.shadowRoot.querySelector(".img");
1107
- t === "title" && (a.textContent = i), t === "subtitle" && (n.textContent = i), t === "img" && (r.style.backgroundImage = i ? `url(${i})` : "");
1107
+ t === "title" && (a.textContent = e), t === "subtitle" && (n.textContent = e), t === "img" && (r.style.backgroundImage = e ? `url(${e})` : "");
1108
1108
  }
1109
1109
  }
1110
1110
  customElements.define("eui-header", F);
@@ -1209,7 +1209,7 @@ class I extends HTMLElement {
1209
1209
  const t = this.hasAttribute("selected");
1210
1210
  this.inputEl.checked = t, this.checkEl.classList.toggle("selected", t);
1211
1211
  }
1212
- attributeChangedCallback(t, e, i) {
1212
+ attributeChangedCallback(t, i, e) {
1213
1213
  t === "selected" && this.inputEl && this.updateFromAttribute();
1214
1214
  }
1215
1215
  get selected() {
@@ -1220,7 +1220,7 @@ class I extends HTMLElement {
1220
1220
  }
1221
1221
  }
1222
1222
  customElements.define("eui-checkbox", I);
1223
- class j extends HTMLElement {
1223
+ class q extends HTMLElement {
1224
1224
  static observedAttributes = ["type", "width", "height", "border-radius", "icon", "link", "href"];
1225
1225
  constructor() {
1226
1226
  super(), this.attachShadow({ mode: "open" });
@@ -1229,7 +1229,7 @@ class j extends HTMLElement {
1229
1229
  this.render();
1230
1230
  }
1231
1231
  render() {
1232
- const t = this.getAttribute("href"), e = t ? "a" : "button";
1232
+ const t = this.getAttribute("href"), i = t ? "a" : "button";
1233
1233
  this.shadowRoot.innerHTML = `
1234
1234
  <style>
1235
1235
  button, a {
@@ -1333,21 +1333,21 @@ class j extends HTMLElement {
1333
1333
  }
1334
1334
 
1335
1335
  </style>
1336
- <${e}>
1336
+ <${i}>
1337
1337
  <slot></slot>
1338
- </${e}>
1338
+ </${i}>
1339
1339
  `;
1340
- const i = this.shadowRoot.querySelector(e);
1341
- t && i.setAttribute("href", t), this.hasAttribute("type") && i.classList.add(this.getAttribute("type")), this.hasAttribute("icon") && i.classList.add("icon"), this.hasAttribute("width") && (i.style.width = this.getAttribute("width") + "px"), this.hasAttribute("height") && (i.style.height = this.getAttribute("height") + "px"), this.hasAttribute("border-radius") && (i.style.borderRadius = this.getAttribute("border-radius") + "px"), i.addEventListener("pointerdown", (a) => {
1342
- const n = document.createElement("span"), r = a.currentTarget, l = r.getBoundingClientRect(), c = Math.max(r.offsetWidth, r.offsetHeight), s = c / 2;
1343
- n.classList.add("ripple"), n.style.width = `${c}px`, n.style.height = `${c}px`, n.style.left = `${a.clientX - l.left - s}px`, n.style.top = `${a.clientY - l.top - s}px`, i.appendChild(n), n.addEventListener("animationend", () => {
1340
+ const e = this.shadowRoot.querySelector(i);
1341
+ t && e.setAttribute("href", t), this.hasAttribute("type") && e.classList.add(this.getAttribute("type")), this.hasAttribute("icon") && e.classList.add("icon"), this.hasAttribute("width") && (e.style.width = this.getAttribute("width") + "px"), this.hasAttribute("height") && (e.style.height = this.getAttribute("height") + "px"), this.hasAttribute("border-radius") && (e.style.borderRadius = this.getAttribute("border-radius") + "px"), e.addEventListener("pointerdown", (a) => {
1342
+ const n = document.createElement("span"), r = a.currentTarget, l = r.getBoundingClientRect(), c = Math.max(r.offsetWidth, r.offsetHeight), o = c / 2;
1343
+ n.classList.add("ripple"), n.style.width = `${c}px`, n.style.height = `${c}px`, n.style.left = `${a.clientX - l.left - o}px`, n.style.top = `${a.clientY - l.top - o}px`, e.appendChild(n), n.addEventListener("animationend", () => {
1344
1344
  n.remove();
1345
1345
  });
1346
1346
  });
1347
1347
  }
1348
1348
  }
1349
- customElements.define("eui-button", j);
1350
- class B extends HTMLElement {
1349
+ customElements.define("eui-button", q);
1350
+ class j extends HTMLElement {
1351
1351
  static get observedAttributes() {
1352
1352
  return ["type", "anchor"];
1353
1353
  }
@@ -1419,30 +1419,30 @@ class B extends HTMLElement {
1419
1419
  `;
1420
1420
  }
1421
1421
  }
1422
- customElements.define("eui-heading", B);
1423
- function q(o) {
1424
- const i = Date.now() - o, a = Math.floor(i / 1e3), n = Math.floor(a / 60), r = Math.floor(n / 60), l = Math.floor(r / 24), c = Math.floor(l / 30), s = Math.floor(c / 12);
1425
- return s > 0 ? `${s}y` : c > 0 ? `${c}mo` : l > 0 ? `${l}d` : r > 0 ? `${r}h` : n > 0 ? `${n}m` : `${a}s`;
1422
+ customElements.define("eui-heading", j);
1423
+ function B(s) {
1424
+ const e = Date.now() - s, a = Math.floor(e / 1e3), n = Math.floor(a / 60), r = Math.floor(n / 60), l = Math.floor(r / 24), c = Math.floor(l / 30), o = Math.floor(c / 12);
1425
+ return o > 0 ? `${o}y` : c > 0 ? `${c}mo` : l > 0 ? `${l}d` : r > 0 ? `${r}h` : n > 0 ? `${n}m` : `${a}s`;
1426
1426
  }
1427
- function N(o) {
1428
- const i = Date.now() - o, a = Math.floor(i / 1e3), n = Math.floor(a / 60), r = Math.floor(n / 60), l = Math.floor(r / 24), c = Math.floor(l / 30), s = Math.floor(c / 12);
1429
- return s > 0 ? `${s} year${s > 1 ? "s" : ""} ago` : c > 0 ? `${c} month${c > 1 ? "s" : ""} ago` : l > 0 ? `${l} day${l > 1 ? "s" : ""} ago` : r > 0 ? `${r} hour${r > 1 ? "s" : ""} ago` : n > 0 ? `${n} minute${n > 1 ? "s" : ""} ago` : `${a} second${a > 1 ? "s" : ""} ago`;
1427
+ function N(s) {
1428
+ const e = Date.now() - s, a = Math.floor(e / 1e3), n = Math.floor(a / 60), r = Math.floor(n / 60), l = Math.floor(r / 24), c = Math.floor(l / 30), o = Math.floor(c / 12);
1429
+ return o > 0 ? `${o} year${o > 1 ? "s" : ""} ago` : c > 0 ? `${c} month${c > 1 ? "s" : ""} ago` : l > 0 ? `${l} day${l > 1 ? "s" : ""} ago` : r > 0 ? `${r} hour${r > 1 ? "s" : ""} ago` : n > 0 ? `${n} minute${n > 1 ? "s" : ""} ago` : `${a} second${a > 1 ? "s" : ""} ago`;
1430
1430
  }
1431
- function O(o) {
1432
- return o.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;").replace(/`/g, "&#96;").replace(/'/g, "&#39;");
1431
+ function O(s) {
1432
+ return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;").replace(/`/g, "&#96;").replace(/'/g, "&#39;");
1433
1433
  }
1434
- function k(o) {
1434
+ function k(s) {
1435
1435
  const t = document.createElement("input");
1436
- t.value = o, document.body.appendChild(t), t.select(), document.execCommand("copy"), document.body.removeChild(t);
1436
+ t.value = s, document.body.appendChild(t), t.select(), document.execCommand("copy"), document.body.removeChild(t);
1437
1437
  }
1438
- const J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1438
+ const K = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1439
1439
  __proto__: null,
1440
1440
  copystr: k,
1441
1441
  joinedAgo: N,
1442
1442
  sanitize: O,
1443
- timeAgo: q
1443
+ timeAgo: B
1444
1444
  }, Symbol.toStringTag, { value: "Module" }));
1445
- class P extends HTMLElement {
1445
+ class U extends HTMLElement {
1446
1446
  static get observedAttributes() {
1447
1447
  return ["copy", "id", "type", "language"];
1448
1448
  }
@@ -1452,11 +1452,11 @@ class P extends HTMLElement {
1452
1452
  connectedCallback() {
1453
1453
  this._isRendered || (this.render(), this._isRendered = !0);
1454
1454
  }
1455
- attributeChangedCallback(t, e, i) {
1456
- this._isRendered && e !== i && this.render();
1455
+ attributeChangedCallback(t, i, e) {
1456
+ this._isRendered && i !== e && this.render();
1457
1457
  }
1458
1458
  render() {
1459
- const t = this.hasAttribute("copy"), e = this.getAttribute("language") || "text";
1459
+ const t = this.hasAttribute("copy"), i = this.getAttribute("language") || "text";
1460
1460
  this.shadowRoot.innerHTML = `
1461
1461
  <style>
1462
1462
  :host {
@@ -1510,47 +1510,47 @@ class P extends HTMLElement {
1510
1510
 
1511
1511
  <pre class="${t ? "g" : ""}"><code></code></pre>
1512
1512
  `, this.copyBtn = this.shadowRoot.querySelector(".copy"), this.codeEl = this.shadowRoot.querySelector("code");
1513
- const i = this._getFormattedText();
1514
- this.codeEl.innerHTML = this._highlight(i, e), t ? this.copyBtn.addEventListener("click", this._boundCopy) : this.copyBtn.style.display = "none";
1513
+ const e = this._getFormattedText();
1514
+ this.codeEl.innerHTML = this._highlight(e, i), t ? this.copyBtn.addEventListener("click", this._boundCopy) : this.copyBtn.style.display = "none";
1515
1515
  }
1516
1516
  _getFormattedText() {
1517
- let e = (this.querySelector("code") || this).innerHTML || "";
1518
- e = this._unescapeHtml(e), e = e.replace(/^\s*\n/, "").replace(/\n\s*$/, "");
1519
- const i = e.split(`
1520
- `), a = i.filter((r) => r.trim()).map((r) => r.match(/^\s*/)[0].length), n = a.length ? Math.min(...a) : 0;
1521
- return i.map((r) => r.slice(n)).join(`
1517
+ let i = (this.querySelector("code") || this).innerHTML || "";
1518
+ i = this._unescapeHtml(i), i = i.replace(/^\s*\n/, "").replace(/\n\s*$/, "");
1519
+ const e = i.split(`
1520
+ `), a = e.filter((r) => r.trim()).map((r) => r.match(/^\s*/)[0].length), n = a.length ? Math.min(...a) : 0;
1521
+ return e.map((r) => r.slice(n)).join(`
1522
1522
  `);
1523
1523
  }
1524
1524
  _unescapeHtml(t) {
1525
- const e = document.createElement("textarea");
1526
- return e.innerHTML = t, e.value;
1525
+ const i = document.createElement("textarea");
1526
+ return i.innerHTML = t, i.value;
1527
1527
  }
1528
- _highlight(t, e) {
1528
+ _highlight(t, i) {
1529
1529
  t = t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
1530
- const i = {};
1530
+ const e = {};
1531
1531
  let a = 0;
1532
1532
  function n(r, l) {
1533
1533
  const c = `__TOKEN_${l}_${a++}__`;
1534
- return i[c] = `<span class="token ${l}">${r}</span>`, c;
1534
+ return e[c] = `<span class="token ${l}">${r}</span>`, c;
1535
1535
  }
1536
- return ["javascript", "js", "json", "bash", "sh", "css"].includes(e) ? (t = t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g, (r) => n(r, "string")), e === "bash" || e === "sh" ? t = t.replace(/(#.*$)/gm, (r) => n(r, "comment")) : e === "css" ? t = t.replace(/(\/\*[\s\S]*?\*\/)/g, (r) => n(r, "comment")) : t = t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm, (r) => n(r, "comment"))) : ["html", "xml"].includes(e) && (t = t.replace(/(&lt;!--[\s\S]*?--&gt;)/g, (r) => n(r, "comment")), t = t.replace(/(&lt;\/?[a-z0-9:-]+)/gi, (r) => n(r, "tag"))), e === "javascript" || e === "js" || e === "json" ? (t = t.replace(/\b(const|let|var|if|else|for|while|return|function|class|import|export|from|default|switch|case|break|continue|new|this|async|await)\b/g, '<span class="token keyword">$1</span>'), t = t.replace(/\b(true|false|null|undefined)\b/g, '<span class="token boolean">$1</span>'), t = t.replace(/\b([a-zA-Z0-9_]+)\s*(?=\()/g, '<span class="token function">$1</span>')) : e === "bash" || e === "sh" ? (t = t.replace(/\b(npm|npx|node|git|cd|ls|mkdir|rm|mv|cp|echo|cat|sudo|docker|brew|grep|curl|wget|chmod|chown|touch)\b/g, '<span class="token keyword">$1</span>'), t = t.replace(/\b(install|run|build|start|test|dev|init|clone|pull|push|commit|add|checkout|branch|merge)\b/g, '<span class="token function">$1</span>'), t = t.replace(/(\s-+[a-zA-Z0-9-]+)/g, '<span class="token attr-name">$1</span>'), t = t.replace(/(\$[A-Z0-9_]+)/g, '<span class="token number">$1</span>')) : e === "html" || e === "xml" ? (t = t.replace(/\s([a-z0-9:-]+)=/gi, (r, l) => " " + n(l, "attr-name") + "="), t = t.replace(/(".*?")/g, (r) => n(r, "attr-value")), t = t.replace(/&gt;/g, '<span class="token tag">&gt;</span>')) : e === "css" && (t = t.replace(/([a-z-]+)(?=:)/g, '<span class="token keyword">$1</span>')), Object.keys(i).reverse().forEach((r) => {
1537
- t = t.replace(r, i[r]);
1536
+ return ["javascript", "js", "json", "bash", "sh", "css"].includes(i) ? (t = t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g, (r) => n(r, "string")), i === "bash" || i === "sh" ? t = t.replace(/(#.*$)/gm, (r) => n(r, "comment")) : i === "css" ? t = t.replace(/(\/\*[\s\S]*?\*\/)/g, (r) => n(r, "comment")) : t = t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm, (r) => n(r, "comment"))) : ["html", "xml"].includes(i) && (t = t.replace(/(&lt;!--[\s\S]*?--&gt;)/g, (r) => n(r, "comment")), t = t.replace(/(&lt;\/?[a-z0-9:-]+)/gi, (r) => n(r, "tag"))), i === "javascript" || i === "js" || i === "json" ? (t = t.replace(/\b(const|let|var|if|else|for|while|return|function|class|import|export|from|default|switch|case|break|continue|new|this|async|await)\b/g, '<span class="token keyword">$1</span>'), t = t.replace(/\b(true|false|null|undefined)\b/g, '<span class="token boolean">$1</span>'), t = t.replace(/\b([a-zA-Z0-9_]+)\s*(?=\()/g, '<span class="token function">$1</span>')) : i === "bash" || i === "sh" ? (t = t.replace(/\b(npm|npx|node|git|cd|ls|mkdir|rm|mv|cp|echo|cat|sudo|docker|brew|grep|curl|wget|chmod|chown|touch)\b/g, '<span class="token keyword">$1</span>'), t = t.replace(/\b(install|run|build|start|test|dev|init|clone|pull|push|commit|add|checkout|branch|merge)\b/g, '<span class="token function">$1</span>'), t = t.replace(/(\s-+[a-zA-Z0-9-]+)/g, '<span class="token attr-name">$1</span>'), t = t.replace(/(\$[A-Z0-9_]+)/g, '<span class="token number">$1</span>')) : i === "html" || i === "xml" ? (t = t.replace(/\s([a-z0-9:-]+)=/gi, (r, l) => " " + n(l, "attr-name") + "="), t = t.replace(/(".*?")/g, (r) => n(r, "attr-value")), t = t.replace(/&gt;/g, '<span class="token tag">&gt;</span>')) : i === "css" && (t = t.replace(/([a-z-]+)(?=:)/g, '<span class="token keyword">$1</span>')), Object.keys(e).reverse().forEach((r) => {
1537
+ t = t.replace(r, e[r]);
1538
1538
  }), t;
1539
1539
  }
1540
1540
  _onCopy() {
1541
1541
  k(this._getFormattedText());
1542
1542
  const t = this.copyBtn.querySelector("eui-icon");
1543
1543
  if (t) {
1544
- const e = t.getAttribute("name");
1545
- t.setAttribute("name", "check"), setTimeout(() => t.setAttribute("name", e), 2e3);
1544
+ const i = t.getAttribute("name");
1545
+ t.setAttribute("name", "check"), setTimeout(() => t.setAttribute("name", i), 2e3);
1546
1546
  }
1547
1547
  }
1548
1548
  disconnectedCallback() {
1549
1549
  this.copyBtn && this.copyBtn.removeEventListener("click", this._boundCopy);
1550
1550
  }
1551
1551
  }
1552
- customElements.define("eui-code", P);
1553
- class V extends HTMLElement {
1552
+ customElements.define("eui-code", U);
1553
+ class P extends HTMLElement {
1554
1554
  constructor() {
1555
1555
  super(), this.attachShadow({ mode: "open" });
1556
1556
  }
@@ -1560,7 +1560,7 @@ class V extends HTMLElement {
1560
1560
  static get observedAttributes() {
1561
1561
  return ["name"];
1562
1562
  }
1563
- attributeChangedCallback(t, e, i) {
1563
+ attributeChangedCallback(t, i, e) {
1564
1564
  t === "name" && (this.render(), this.setupEventListeners());
1565
1565
  }
1566
1566
  setupEventListeners() {
@@ -1666,8 +1666,8 @@ class V extends HTMLElement {
1666
1666
  `;
1667
1667
  }
1668
1668
  }
1669
- customElements.define("eui-app-titlebar", V);
1670
- class D extends HTMLElement {
1669
+ customElements.define("eui-app-titlebar", P);
1670
+ class V extends HTMLElement {
1671
1671
  constructor() {
1672
1672
  super(), this.attachShadow({ mode: "open" }), this._handleMouseDown = this._addRipple.bind(this);
1673
1673
  }
@@ -1677,16 +1677,16 @@ class D extends HTMLElement {
1677
1677
  static get observedAttributes() {
1678
1678
  return ["elevated", "interactive", "ripple"];
1679
1679
  }
1680
- attributeChangedCallback(t, e, i) {
1681
- e !== i && t === "ripple" && this.setupEventListeners();
1680
+ attributeChangedCallback(t, i, e) {
1681
+ i !== e && t === "ripple" && this.setupEventListeners();
1682
1682
  }
1683
1683
  setupEventListeners() {
1684
1684
  this.removeEventListener("mousedown", this._handleMouseDown), this.hasAttribute("ripple") && this.addEventListener("mousedown", this._handleMouseDown);
1685
1685
  }
1686
1686
  _addRipple(t) {
1687
- const e = this.getBoundingClientRect(), i = document.createElement("span"), a = Math.max(e.width, e.height), n = a / 2;
1688
- i.style.width = i.style.height = `${a}px`, i.style.left = `${t.clientX - e.left - n}px`, i.style.top = `${t.clientY - e.top - n}px`, i.classList.add("ripple"), this.shadowRoot.querySelector(".surface").appendChild(i), i.addEventListener("animationend", () => {
1689
- i.remove();
1687
+ const i = this.getBoundingClientRect(), e = document.createElement("span"), a = Math.max(i.width, i.height), n = a / 2;
1688
+ e.style.width = e.style.height = `${a}px`, e.style.left = `${t.clientX - i.left - n}px`, e.style.top = `${t.clientY - i.top - n}px`, e.classList.add("ripple"), this.shadowRoot.querySelector(".surface").appendChild(e), e.addEventListener("animationend", () => {
1689
+ e.remove();
1690
1690
  });
1691
1691
  }
1692
1692
  render() {
@@ -1754,14 +1754,142 @@ class D extends HTMLElement {
1754
1754
  `;
1755
1755
  }
1756
1756
  }
1757
- customElements.define("eui-surface", D);
1757
+ customElements.define("eui-surface", V);
1758
+ class D extends HTMLElement {
1759
+ static get observedAttributes() {
1760
+ return ["value", "min", "max", "step", "label"];
1761
+ }
1762
+ constructor() {
1763
+ super(), this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = `
1764
+ <style>
1765
+ :host {
1766
+ display: flex;
1767
+ flex-direction: column;
1768
+ gap: 8px;
1769
+ width: 100%;
1770
+ max-width: 300px;
1771
+ margin: 0.75rem 0;
1772
+ user-select: none;
1773
+ }
1774
+
1775
+ .header {
1776
+ display: flex;
1777
+ justify-content: space-between;
1778
+ align-items: center;
1779
+ font-size: 0.85rem;
1780
+ font-weight: 500;
1781
+ padding: 0 4px;
1782
+ }
1783
+
1784
+ .slider-container {
1785
+ position: relative;
1786
+ height: 32px;
1787
+ display: flex;
1788
+ align-items: center;
1789
+ }
1790
+
1791
+ input[type="range"] {
1792
+ -webkit-appearance: none;
1793
+ appearance: none;
1794
+ opacity: 0;
1795
+ width: 100%;
1796
+ height: 4px;
1797
+ background: var(--app-300, #333);
1798
+ border-radius: 3px;
1799
+ outline: none;
1800
+ margin: 0;
1801
+ cursor: pointer;
1802
+ position: relative;
1803
+ z-index: 1;
1804
+ }
1805
+
1806
+ .track {
1807
+ position: absolute;
1808
+ height: 4px;
1809
+ width: 100%;
1810
+ background: var(--app-200, #333);
1811
+ border-radius: 3px;
1812
+ overflow: hidden;
1813
+ pointer-events: none;
1814
+ z-index: 0;
1815
+ }
1816
+
1817
+ .track-fill {
1818
+ position: absolute;
1819
+ height: 4px;
1820
+ background: var(--app-accent, #6366f1);
1821
+ pointer-events: none;
1822
+ z-index: 0;
1823
+ left: 0;
1824
+ }
1825
+
1826
+ .slider-thumb {
1827
+ position: absolute;
1828
+ width: 20px;
1829
+ height: 20px;
1830
+ background: var(--app-accent, #6366f1);
1831
+ box-shadow: inset 0 0 0 1px var(--app-500, #131318), inset 0 0 0 4px var(--app-200, #131318);
1832
+ border-radius: 50%;
1833
+ pointer-events: none;
1834
+ z-index: 0;
1835
+ left: 0;
1836
+ }
1837
+
1838
+ .slider-thumb.active {
1839
+ background: var(--app-accent-50, #7376ff);
1840
+ }
1841
+
1842
+ .value-badge {
1843
+ color: var(--app-text);
1844
+ font-weight: 600;
1845
+ }
1846
+ </style>
1847
+ <div class="header">
1848
+ <span class="label"></span>
1849
+ <span class="value-badge"></span>
1850
+ </div>
1851
+ <div class="slider-container">
1852
+ <div class="track">
1853
+ <div class="track-fill"></div>
1854
+ </div>
1855
+ <div class="slider-thumb"></div>
1856
+ <input type="range">
1857
+ </div>
1858
+ `;
1859
+ }
1860
+ connectedCallback() {
1861
+ this.inputEl = this.shadowRoot.querySelector("input"), this.labelEl = this.shadowRoot.querySelector(".label"), this.valueEl = this.shadowRoot.querySelector(".value-badge"), this.trackFillEl = this.shadowRoot.querySelector(".track-fill"), this.sliderThumbEl = this.shadowRoot.querySelector(".slider-thumb"), this.inputEl.min = this.getAttribute("min") || 0, this.inputEl.max = this.getAttribute("max") || 100, this.inputEl.step = this.getAttribute("step") || 1, this.inputEl.value = this.getAttribute("value") || 50, this.hasAttribute("label") && (this.labelEl.textContent = this.getAttribute("label")), this.updateUI(), this.inputEl.addEventListener("input", () => {
1862
+ this.updateValue(this.inputEl.value), this.dispatchEvent(new Event("input", { bubbles: !0, composed: !0 }));
1863
+ }), this.inputEl.addEventListener("change", () => {
1864
+ this.dispatchEvent(new Event("change", { bubbles: !0, composed: !0 }));
1865
+ }), this.inputEl.addEventListener("mousedown", () => this.sliderThumbEl.classList.add("active")), this.inputEl.addEventListener("touchstart", () => this.sliderThumbEl.classList.add("active"), { passive: !0 }), window.addEventListener("mouseup", () => this.sliderThumbEl.classList.remove("active")), window.addEventListener("touchend", () => this.sliderThumbEl.classList.remove("active"));
1866
+ }
1867
+ updateValue(t) {
1868
+ this.setAttribute("value", t), this.updateUI();
1869
+ }
1870
+ updateUI() {
1871
+ if (!this.inputEl) return;
1872
+ const t = parseFloat(this.inputEl.min), i = parseFloat(this.inputEl.max), e = parseFloat(this.inputEl.value), a = (e - t) / (i - t) * 100;
1873
+ this.trackFillEl.style.width = `${a}%`, this.sliderThumbEl.style.left = `calc(${a}% - ${a / 100 * 20}px)`, this.valueEl.textContent = e;
1874
+ }
1875
+ attributeChangedCallback(t, i, e) {
1876
+ this.inputEl && (t === "value" && e !== this.inputEl.value ? (this.inputEl.value = e, this.updateUI()) : ["min", "max", "step"].includes(t) ? (this.inputEl[t] = e, this.updateUI()) : t === "label" && (this.labelEl.textContent = e));
1877
+ }
1878
+ get value() {
1879
+ return parseFloat(this.inputEl.value);
1880
+ }
1881
+ set value(t) {
1882
+ this.setAttribute("value", t);
1883
+ }
1884
+ }
1885
+ customElements.define("eui-slider", D);
1758
1886
  typeof window < "u" && console.log("ErisUI loaded successfully");
1759
1887
  export {
1760
- U as device,
1761
- Z as haptics,
1888
+ Z as device,
1889
+ X as haptics,
1762
1890
  u as icons,
1763
- W as loadPage,
1891
+ J as loadPage,
1764
1892
  y as router,
1765
- X as storage,
1766
- J as utils
1893
+ W as storage,
1894
+ K as utils
1767
1895
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3r1s_s/erisui",
3
- "version": "1.0.15",
3
+ "version": "1.0.17",
4
4
  "description": "an awesome ui library for web apps",
5
5
  "type": "module",
6
6
  "files": [