@3r1s_s/erisui 1.0.10 → 1.0.11

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 (4) hide show
  1. package/dist/erisui.css +1 -1
  2. package/dist/erisui.js +43 -23
  3. package/dist/erisui.mjs +216 -173
  4. package/package.json +2 -1
package/dist/erisui.css CHANGED
@@ -1 +1 @@
1
- :root{-webkit-touch-callout:none;-webkit-user-callout:none;-webkit-user-drag:none;-webkit-user-modify:none;-webkit-highlight:none;-webkit-tap-highlight-color:transparent}:root{--app-text: #F2F3F6;--app-link: #549fff;--app-100: #131318;--app-200: #202027;--app-300: #2c2c34;--app-400: #35353b;--app-500: #40404a;--app-600: #4b4b55;--app-700: #575761;--app-800: #62626e;--app-900: #6e6e7b;--banner-color: #182233;--nav-width: 75px;--nav-expanded-width: 250px;--titlebar-height: 65px;--content-width: 100%;--app-accent: #6366f1;--app-accent-50: #7376ff;--app-accent-100: #6366f1;--app-accent-200: #4b4ecf;--app-blue: #3679f0;--app-red: #ee4d3c;--app-green: #4dca9a;--app-yellow: #fffc5c;--app-pink: #ff5bff;--app-purple: #895bff;--app-orange: #ff9b5b;--app-white: #fff;--app-dark-blue: #1e4d9e;--app-dark-red: #c33f33;--app-dark-green: #2c7e4b;--app-dark-yellow: #c7b200;--app-dark-pink: #c95bff;--app-dark-purple: #5f5bff;--app-dark-orange: #c86f33;--transition-function: cubic-bezier(.4, 0, .2, 1);--specular-highlight: -.5px -.5px 1px #ffffff52 inset, 1px 1px .5px #ffffff52 inset, 0 4px 24px #0000003d}:root{--card-blue: #A8C7FA;--card-cyan: #80CFFF;--card-red: #ffadb5;--card-pink: #FFADE4;--card-green: #6CD58B;--card-yellow: #fff7c1;--card-purple: #D9BAFD;--card-orange: #FFB683}.light{--app-text: #1F1F1F;--app-link: #1868f2;--app-100: #fefefe;--app-200: #F0F4FA;--app-300: #dde3f0;--app-400: #C6CFD7;--app-500: #AEB9C3;--app-600: #99A3AE;--app-700: #7F8C98;--app-800: #66717C;--app-900: #4B5563;--banner-color: #d3e3fd}body{margin:0;padding:0;background-color:var(--app-100);color:var(--app-text);overflow:hidden}a{color:var(--app-link);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4,h5,h6{margin:0}button{color:inherit;font-family:inherit}#app{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--app-200)}.app-wrapper{margin-left:var(--nav-width);display:flex;flex-direction:column;padding:var(--titlebar-height) .5rem .5rem 0rem;box-sizing:border-box;height:100%;overflow-y:auto;background-color:var(--app-200);transition:margin-left .2s cubic-bezier(.2,0,0,1)}eui-app-nav.expanded+.app-wrapper{margin-left:var(--nav-expanded-width)}#main{width:100%;height:100%;padding:1.5rem;box-sizing:border-box;gap:1.5rem;display:flex;overflow-y:auto;scrollbar-color:var(--app-300) var(--app-100)}.main-wrapper{width:100%;height:100%;border-radius:2rem;background-color:var(--app-100);overflow:hidden}.content{width:var(--content-width);margin:0 auto}.content-header h1{font-size:2.375rem}.content-sidebar{display:flex;flex-direction:column;gap:.5rem}.content-sidebar-inner{width:300px;margin:0 auto;border-radius:12px;background-color:var(--app-200);height:100%}@keyframes ripple{to{transform:scale(4);opacity:0;filter:blur(10px)}}#main{opacity:1;transform:translateY(0);transition:transform .3s cubic-bezier(.2,0,0,1),opacity .3s cubic-bezier(.2,0,0,1)}#main.fade-out{opacity:0;transform:translateY(1rem);transition:none}
1
+ :root{-webkit-touch-callout:none;-webkit-user-callout:none;-webkit-user-drag:none;-webkit-user-modify:none;-webkit-highlight:none;-webkit-tap-highlight-color:transparent}:root{--app-text: #F2F3F6;--app-link: #549fff;--app-100: #131318;--app-200: #202027;--app-300: #2c2c34;--app-400: #35353b;--app-500: #40404a;--app-600: #4b4b55;--app-700: #575761;--app-800: #62626e;--app-900: #6e6e7b;--banner-color: #182233;--nav-width: 75px;--nav-expanded-width: 250px;--titlebar-height: 65px;--content-width: 100%;--app-accent: #6366f1;--app-accent-50: #7376ff;--app-accent-100: #6366f1;--app-accent-200: #4b4ecf;--app-blue: #3679f0;--app-red: #ee4d3c;--app-green: #4dca9a;--app-yellow: #fffc5c;--app-pink: #ff5bff;--app-purple: #895bff;--app-orange: #ff9b5b;--app-white: #fff;--app-dark-blue: #1e4d9e;--app-dark-red: #c33f33;--app-dark-green: #2c7e4b;--app-dark-yellow: #c7b200;--app-dark-pink: #c95bff;--app-dark-purple: #5f5bff;--app-dark-orange: #c86f33;--transition-function: cubic-bezier(.4, 0, .2, 1);--specular-highlight: -.5px -.5px 1px #ffffff52 inset, 1px 1px .5px #ffffff52 inset, 0 4px 24px #0000003d}:root{--card-blue: #A8C7FA;--card-cyan: #80CFFF;--card-red: #ffadb5;--card-pink: #FFADE4;--card-green: #6CD58B;--card-yellow: #fff7c1;--card-purple: #D9BAFD;--card-orange: #FFB683}.light{--app-text: #1F1F1F;--app-link: #1868f2;--app-100: #fefefe;--app-200: #F0F4FA;--app-300: #dde3f0;--app-400: #C6CFD7;--app-500: #AEB9C3;--app-600: #99A3AE;--app-700: #7F8C98;--app-800: #66717C;--app-900: #4B5563;--banner-color: #d3e3fd}body{margin:0;padding:0;background-color:var(--app-100);color:var(--app-text);overflow:hidden}a{color:var(--app-link);text-decoration:none}a:hover{text-decoration:underline}h1,h2,h3,h4,h5,h6{margin:0}button{color:inherit;font-family:inherit}#app{position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--app-200)}.app-wrapper{margin-left:var(--nav-width);display:flex;flex-direction:column;padding:var(--titlebar-height) .5rem .5rem 0rem;box-sizing:border-box;height:100%;overflow-y:auto;background-color:var(--app-200);transition:margin-left .2s cubic-bezier(.2,0,0,1)}eui-app-nav.expanded+.app-wrapper{margin-left:var(--nav-expanded-width)}#main{width:100%;height:100%;padding:1.5rem;box-sizing:border-box;gap:1.5rem;display:flex;overflow-y:auto;scrollbar-color:var(--app-300) var(--app-100)}.main-wrapper{width:100%;height:100%;border-radius:2rem;background-color:var(--app-100);overflow:hidden}.content{width:var(--content-width);margin:0 auto}.content-header h1{font-size:2.375rem}.content-sidebar{display:flex;flex-direction:column;gap:.5rem}.content-sidebar-inner{width:300px;margin:0 auto;border-radius:12px;background-color:var(--app-200);height:100%}@keyframes ripple{to{transform:scale(4);opacity:0;filter:blur(10px)}}#main{opacity:1;transform:translateY(0);transition:transform .3s cubic-bezier(.2,0,0,1),opacity .3s cubic-bezier(.2,0,0,1)}#main.fade-out{opacity:0;transform:translateY(1rem);transition:none}@media(max-width:768px){.app-wrapper{margin-left:0;padding:0;padding-top:var(--titlebar-height)}.main-wrapper{border-radius:2rem 2rem 0 0}eui-app-nav.expanded+.app-wrapper{margin-left:0}eui-app-nav{width:0;overflow:hidden}eui-app-nav.expanded{width:var(--nav-expanded-width);border-radius:0 2rem 2rem 0}}
package/dist/erisui.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(p,b){typeof exports=="object"&&typeof module<"u"?b(exports):typeof define=="function"&&define.amd?define(["exports"],b):(p=typeof globalThis<"u"?globalThis:p||self,b(p.eui={}))})(this,(function(p){"use strict";class b extends HTMLElement{static get observedAttributes(){return["size","border-radius","name","color"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
1
+ (function(h,g){typeof exports=="object"&&typeof module<"u"?g(exports):typeof define=="function"&&define.amd?define(["exports"],g):(h=typeof globalThis<"u"?globalThis:h||self,g(h.eui={}))})(this,(function(h){"use strict";var G=Object.defineProperty;var Q=(h,g,u)=>g in h?G(h,g,{enumerable:!0,configurable:!0,writable:!0,value:u}):h[g]=u;var C=(h,g,u)=>Q(h,typeof g!="symbol"?g+"":g,u);class g extends HTMLElement{static get observedAttributes(){return["size","border-radius","name","color"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
2
2
  <style>
3
3
  :host {
4
4
  aspect-ratio: 1 / 1;
@@ -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"),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 r=this.getAttribute("name").trim().split(/\s+/);let n="";r.length===1?n=r[0][0]||"":n=(r[0][0]||"")+(r[r.length-1][0]||""),this.initials.textContent=n.toUpperCase()}}}customElements.define("eui-avatar",b);const f=(()=>{let o={};return{register(t,i){o[t]=i},get(t){return o[t]||""}}})();f.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>'),f.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>'),f.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>');class S 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=f.get(t);if(!i){this.shadowRoot.innerHTML='<span style="color:red;">?</span>';return}const e=document.createElement("template");e.innerHTML=i.trim();const r=e.content.cloneNode(!0),n=r.firstElementChild;if(n&&n.style){const a=this.getAttribute("width"),l=this.getAttribute("height");a&&n.setAttribute("width",a),l&&n.setAttribute("height",l),n.style.display="block"}this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(r)}}customElements.define("eui-icon",S);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 s=this.getAttribute("name").trim().split(/\s+/);let n="";s.length===1?n=s[0][0]||"":n=(s[0][0]||"")+(s[s.length-1][0]||""),this.initials.textContent=n.toUpperCase()}}}customElements.define("eui-avatar",g);const u=(()=>{let o={};return{register(t,i){o[t]=i},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>');class z 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 s=e.content.cloneNode(!0),n=s.firstElementChild;if(n&&n.style){const l=this.getAttribute("width"),c=this.getAttribute("height");l&&n.setAttribute("width",l),c&&n.setAttribute("height",c),n.style.display="block"}this.shadowRoot.innerHTML="",this.shadowRoot.appendChild(s)}}customElements.define("eui-icon",z);class M 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",()=>{this.setAttribute("value",this.inputEl.value)})}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 z 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",()=>{this.setAttribute("value",this.inputEl.value)})}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",M);class T 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",z);class T extends HTMLElement{static get observedAttributes(){return["value","intermediate","id"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
191
+ `}}customElements.define("eui-loader",T);class $ 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",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},M=Object.freeze(Object.defineProperty({__proto__:null,device:v},Symbol.toStringTag,{value:"Module"}));function R(){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&&R()}const $=Object.freeze(Object.defineProperty({__proto__:null,haptic:x},Symbol.toStringTag,{value:"Module"})),E=(()=>{let o={},t;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(i){console.error(i)}return{get(i){return o[i]},set(i,e){o[i]=e,localStorage.setItem(t,JSON.stringify(o))},delete(i){delete o[i],localStorage.setItem(t,JSON.stringify(o))},all(){return o},clear(){o={},localStorage.setItem(t,JSON.stringify(o))},name(i){t=i;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(e){console.error(e)}},settings:{get(i){return o&&o.settings&&o.settings[i]},set(i,e){o.settings||(o.settings={}),o.settings[i]=e,localStorage.setItem(t,JSON.stringify(o))},delete(i){o.settings&&(delete o.settings[i],localStorage.setItem(t,JSON.stringify(o)))},all(){return o.settings||{}},clear(){o.settings&&(o.settings={},localStorage.setItem(t,JSON.stringify(o)))}}}})(),A=E.settings,H=Object.freeze(Object.defineProperty({__proto__:null,settings:A,storage:E},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",$);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},R=Object.freeze(Object.defineProperty({__proto__:null,device:v},Symbol.toStringTag,{value:"Module"}));function H(){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&&H()}const _=Object.freeze(Object.defineProperty({__proto__:null,haptic:x},Symbol.toStringTag,{value:"Module"})),A=(()=>{let o={},t;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(i){console.error(i)}return{get(i){return o[i]},set(i,e){o[i]=e,localStorage.setItem(t,JSON.stringify(o))},delete(i){delete o[i],localStorage.setItem(t,JSON.stringify(o))},all(){return o},clear(){o={},localStorage.setItem(t,JSON.stringify(o))},name(i){t=i;try{o=JSON.parse(localStorage.getItem(t)||"{}")}catch(e){console.error(e)}},settings:{get(i){return o&&o.settings&&o.settings[i]},set(i,e){o.settings||(o.settings={}),o.settings[i]=e,localStorage.setItem(t,JSON.stringify(o))},delete(i){o.settings&&(delete o.settings[i],localStorage.setItem(t,JSON.stringify(o)))},all(){return o.settings||{}},clear(){o.settings&&(o.settings={},localStorage.setItem(t,JSON.stringify(o)))}}}})(),E=A.settings,I=Object.freeze(Object.defineProperty({__proto__:null,settings:E,storage:A},Symbol.toStringTag,{value:"Module"}));class F 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()}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 I 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()}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",F);class j 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 i=document.createElement("span"),e=t.currentTarget,r=Math.max(e.offsetWidth,e.offsetHeight);i.classList.add("ripple"),i.style.left=t.clientX-e.getBoundingClientRect().left-r/2+"px",i.style.top=t.clientY-e.getBoundingClientRect().top-r/2+"px",i.style.width=r+"px",i.style.height=r+"px",this.shadowRoot.appendChild(i),setTimeout(()=>{i.remove()},600)})}}customElements.define("eui-chip",I);const m="",w=(()=>{const o=[];function t(s,d){const h=[],g=s.replace(/:([^/]+)/g,(y,k)=>(h.push(k),"([^/]+)")).replace(/\//g,"\\/"),u=new RegExp(`^${m}${g}$`);o.push({regex:u,paramNames:h,renderFn:d})}function i(s){for(const{regex:d,paramNames:h,renderFn:g}of o){const u=s.match(d);if(u){const y={};return h.forEach((k,K)=>{y[k]=decodeURIComponent(u[K+1])}),{renderFn:g,params:y}}}return null}function e(s,d=!0){s.startsWith(m)||(s=m+(s.startsWith("/")?"":"/")+s);const h=s.split(/[?#]/)[0];if(h===window.location.pathname&&s.includes("#")){d&&history.pushState({},"",s);const u="#"+s.split("#")[1];r(u);return}const g=i(h);if(g)if(d&&history.pushState({},"",s),g.renderFn(g.params),window.dispatchEvent(new CustomEvent("route-changed",{detail:{path:s}})),s.includes("#")){const u="#"+s.split("#")[1];setTimeout(()=>r(u),100)}else{const u=document.getElementById("main");u&&u.scrollTo(0,0)}else n?(d&&history.pushState({},"",s),n()):console.warn(`No route found for ${h}`)}function r(s){if(s)try{const d=document.querySelector(s);d&&d.scrollIntoView({behavior:"smooth"})}catch{console.warn("Invalid hash:",s)}}let n=null;function a(s){n=s}function l(){history.back()}function c(){return window.location.pathname.replace(m,"")||"/"}return window.addEventListener("popstate",()=>{const s=window.location.pathname+window.location.search+window.location.hash;e(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),r(h);return}e(h)}}),{add:t,navigate:e,back:l,location:c,setNotFound:a}})();async function F(o){try{const t=document.getElementById("main");t.classList.add("fade-out"),await new Promise(e=>setTimeout(e,200));const i=await fetch(`/src/pages/${o}.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 q 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,r=e.getBoundingClientRect(),n=Math.max(e.offsetWidth,e.offsetHeight),a=n/2;i.classList.add("ripple"),i.style.width=`${n}px`,i.style.height=`${n}px`,i.style.left=`${t.clientX-r.left-a}px`,i.style.top=`${t.clientY-r.top-a}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"),r=this.getAttribute("label")||"",n=this.getAttribute("badge"),a=this.shadowRoot.querySelector(".badge");if(n)if(a)a.textContent=n;else{const s=document.createElement("span");s.className="badge",s.textContent=n,this.shadowRoot.appendChild(s)}else a&&a.remove();const l=this.shadowRoot.querySelector("slot[name='icon']");if(l)if(i||e){let s='<eui-avatar size="24"';e&&(s+=` name="${e}"`),s+=">",i&&(s+=`<img src="${i}" alt="${e||"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=r)}render(){this.shadowRoot.innerHTML=`
349
+ `,this.addEventListener("pointerdown",t=>{const i=document.createElement("span"),e=t.currentTarget,s=Math.max(e.offsetWidth,e.offsetHeight);i.classList.add("ripple"),i.style.left=t.clientX-e.getBoundingClientRect().left-s/2+"px",i.style.top=t.clientY-e.getBoundingClientRect().top-s/2+"px",i.style.width=s+"px",i.style.height=s+"px",this.shadowRoot.appendChild(i),setTimeout(()=>{i.remove()},600)})}}customElements.define("eui-chip",j);const f="",w=(()=>{const o=[];function t(r,a){const p=[],m=r.replace(/:([^/]+)/g,(y,k)=>(p.push(k),"([^/]+)")).replace(/\//g,"\\/"),b=new RegExp(`^${f}${m}$`);o.push({regex:b,paramNames:p,renderFn:a})}function i(r){for(const{regex:a,paramNames:p,renderFn:m}of o){const b=r.match(a);if(b){const y={};return p.forEach((k,K)=>{y[k]=decodeURIComponent(b[K+1])}),{renderFn:m,params:y}}}return null}function e(r,a=!0){r.startsWith(f)||(r=f+(r.startsWith("/")?"":"/")+r);const p=r.split(/[?#]/)[0];if(p===window.location.pathname&&r.includes("#")){a&&history.pushState({},"",r);const b="#"+r.split("#")[1];s(b);return}const m=i(p);if(m)if(a&&history.pushState({},"",r),m.renderFn(m.params),window.dispatchEvent(new CustomEvent("route-changed",{detail:{path:r}})),r.includes("#")){const b="#"+r.split("#")[1];setTimeout(()=>s(b),100)}else{const b=document.getElementById("main");b&&b.scrollTo(0,0)}else n?(a&&history.pushState({},"",r),n()):console.warn(`No route found for ${p}`)}function s(r){if(r)try{const a=document.querySelector(r);a&&a.scrollIntoView({behavior:"smooth"})}catch{console.warn("Invalid hash:",r)}}let n=null;function l(r){n=r}function c(){history.back()}function d(){return window.location.pathname.replace(f,"")||"/"}return window.addEventListener("popstate",()=>{const r=window.location.pathname+window.location.search+window.location.hash;e(r,!1)}),window.addEventListener("click",r=>{if(r.button!==0||r.metaKey||r.altKey||r.ctrlKey||r.shiftKey)return;const a=r.target.closest("a");if(!a||a.hasAttribute("download")||a.getAttribute("target")==="_blank")return;const p=a.getAttribute("href");if(!(!p||p.startsWith("http")&&!p.startsWith(window.location.origin))){if(r.preventDefault(),p.startsWith("#")){history.pushState({},"",p),s(p);return}e(p)}}),{add:t,navigate:e,back:c,location:d,setNotFound:l}})();async function q(o){try{const t=document.getElementById("main");t.classList.add("fade-out"),await new Promise(e=>setTimeout(e,200));const i=await fetch(`/src/pages/${o}.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 B extends HTMLElement{constructor(){super();C(this,"handleClick",()=>{const i=this.getAttribute("path");i&&w.navigate(i)});this.attachShadow({mode:"open"})}static get observedAttributes(){return["path","icon","label","badge","active","avatar-src","avatar-name"]}connectedCallback(){this.hasRendered||(this.render(),this.setupEventListeners(),this.hasRendered=!0),this.updateContent(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}attributeChangedCallback(i,e,s){if(e!==s&&this.hasRendered){if(i==="active")return;this.updateContent()}}setupEventListeners(){this.addEventListener("pointerdown",i=>{const e=document.createElement("span"),s=i.currentTarget,n=s.getBoundingClientRect(),l=Math.max(s.offsetWidth,s.offsetHeight),c=l/2;e.classList.add("ripple"),e.style.width=`${l}px`,e.style.height=`${l}px`,e.style.left=`${i.clientX-n.left-c}px`,e.style.top=`${i.clientY-n.top-c}px`,this.shadowRoot.appendChild(e),e.addEventListener("animationend",()=>{e.remove()})})}updateContent(){const i=this.getAttribute("icon"),e=this.getAttribute("avatar-src"),s=this.getAttribute("avatar-name"),n=this.getAttribute("label")||"",l=this.getAttribute("badge"),c=this.shadowRoot.querySelector(".badge");if(l)if(c)c.textContent=l;else{const a=document.createElement("span");a.className="badge",a.textContent=l,this.shadowRoot.appendChild(a)}else c&&c.remove();const d=this.shadowRoot.querySelector("slot[name='icon']");if(d)if(e||s){let a='<eui-avatar size="24"';s&&(a+=` name="${s}"`),a+=">",e&&(a+=`<img src="${e}" alt="${s||"Avatar"}" />`),a+="</eui-avatar>",d.innerHTML=a}else{const a=d.querySelector("eui-icon");i&&a?a.getAttribute("name")!==i&&a.setAttribute("name",i):i?d.innerHTML=`<eui-icon width="24" height="24" name="${i}"></eui-icon>`:d.innerHTML=""}const r=this.shadowRoot.querySelector(".label");r&&(r.textContent=n)}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",q);class j 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",B);class N 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;
@@ -471,6 +471,7 @@
471
471
 
472
472
  .app-nav-container {
473
473
  width: 100%;
474
+ min-width: var(--nav-width, 75px);
474
475
  height: 100%;
475
476
  box-sizing: border-box;
476
477
  background-color: var(--app-200);
@@ -550,10 +551,10 @@
550
551
  <div class="app-nav-container">
551
552
  <a href="#content" id="skip_navigation_link">Skip To Content</a>
552
553
  <div class="nav-items">
553
- ${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("")}
554
+ ${this.navItems.map(t=>{var s,n;if(t.type==="divider")return'<div style="height: 1px; background: var(--app-300); margin: 0.5rem 0;"></div>';const i=((s=t.avatar)==null?void 0:s.src)||"",e=((n=t.avatar)==null?void 0:n.name)||"";return`<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${i}" avatar-name="${e}" label="${t.label}"></eui-nav-item>`}).join("")}
554
555
  </div>
555
556
  </div>
556
- `}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",j);class N 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",N);class O extends HTMLElement{static get observedAttributes(){return["type","title","subtitle","img"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
557
558
  <style>
558
559
  :host {
559
560
  border-radius: 24px;
@@ -622,7 +623,7 @@
622
623
  <p></p>
623
624
  </div>
624
625
  </div>
625
- `}connectedCallback(){this.hd=this.shadowRoot.querySelector(".header"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}attributeChangedCallback(t,i,e){const r=this.shadowRoot.querySelector("h1"),n=this.shadowRoot.querySelector("p"),a=this.shadowRoot.querySelector(".img");t==="title"&&(r.textContent=e),t==="subtitle"&&(n.textContent=e),t==="img"&&(a.style.backgroundImage=e?`url(${e})`:"")}}customElements.define("eui-header",N);class B extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
626
+ `}connectedCallback(){this.hd=this.shadowRoot.querySelector(".header"),this.hasAttribute("type")&&this.hd.classList.add(this.getAttribute("type"))}attributeChangedCallback(t,i,e){const s=this.shadowRoot.querySelector("h1"),n=this.shadowRoot.querySelector("p"),l=this.shadowRoot.querySelector(".img");t==="title"&&(s.textContent=e),t==="subtitle"&&(n.textContent=e),t==="img"&&(l.style.backgroundImage=e?`url(${e})`:"")}}customElements.define("eui-header",O);class P extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
626
627
  <style>
627
628
  :host {
628
629
  display: block;
@@ -705,7 +706,7 @@
705
706
  <rect class="mark long"></rect>
706
707
  </svg>
707
708
  </div>
708
- `}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();const t=this.selected,i=this.dataset.setting;i&&A.set(i,t)}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",B);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=`
709
+ `}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();const t=this.selected,i=this.dataset.setting;i&&E.set(i,t)}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",P);class L extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.render()}render(){const t=this.getAttribute("href"),i=t?"a":"button";this.shadowRoot.innerHTML=`
709
710
  <style>
710
711
  button, a {
711
712
  display: flex;
@@ -811,7 +812,7 @@
811
812
  <${i}>
812
813
  <slot></slot>
813
814
  </${i}>
814
- `;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",r=>{const n=document.createElement("span"),a=r.currentTarget,l=a.getBoundingClientRect(),c=Math.max(a.offsetWidth,a.offsetHeight),s=c/2;n.classList.add("ripple"),n.style.width=`${c}px`,n.style.height=`${c}px`,n.style.left=`${r.clientX-l.left-s}px`,n.style.top=`${r.clientY-l.top-s}px`,e.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=`
815
+ `;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",s=>{const n=document.createElement("span"),l=s.currentTarget,c=l.getBoundingClientRect(),d=Math.max(l.offsetWidth,l.offsetHeight),r=d/2;n.classList.add("ripple"),n.style.width=`${d}px`,n.style.height=`${d}px`,n.style.left=`${s.clientX-c.left-r}px`,n.style.top=`${s.clientY-c.top-r}px`,e.appendChild(n),n.addEventListener("animationend",()=>{n.remove()})})}}C(L,"observedAttributes",["type","width","height","border-radius","icon","link","href"]),customElements.define("eui-button",L);class V 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=`
815
816
  <style>
816
817
  :host {
817
818
  display: block;
@@ -869,7 +870,7 @@
869
870
  <span class="anchor-hash">#</span>
870
871
  </a>
871
872
  `:""}
872
- `}}customElements.define("eui-heading",P);function U(o){const e=Date.now()-o,r=Math.floor(e/1e3),n=Math.floor(r/60),a=Math.floor(n/60),l=Math.floor(a/24),c=Math.floor(l/30),s=Math.floor(c/12);return s>0?`${s}y`:c>0?`${c}mo`:l>0?`${l}d`:a>0?`${a}h`:n>0?`${n}m`:`${r}s`}function D(o){const e=Date.now()-o,r=Math.floor(e/1e3),n=Math.floor(r/60),a=Math.floor(n/60),l=Math.floor(a/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`:a>0?`${a} hour${a>1?"s":""} ago`:n>0?`${n} minute${n>1?"s":""} ago`:`${r} second${r>1?"s":""} ago`}function X(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 C(o){const t=document.createElement("input");t.value=o,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}const W=Object.freeze(Object.defineProperty({__proto__:null,copystr:C,joinedAgo:D,sanitize:X,timeAgo:U},Symbol.toStringTag,{value:"Module"}));class J extends HTMLElement{static get observedAttributes(){return["copy","id","type"]}constructor(){super(),this.attachShadow({mode:"open"}),this._boundCopy=this._onCopy.bind(this),this._isRendered=!1}connectedCallback(){this._isRendered||(this.render(),this._isRendered=!0)}render(){const t=this.hasAttribute("copy");this.shadowRoot.innerHTML=`
873
+ `}}customElements.define("eui-heading",V);function U(o){const e=Date.now()-o,s=Math.floor(e/1e3),n=Math.floor(s/60),l=Math.floor(n/60),c=Math.floor(l/24),d=Math.floor(c/30),r=Math.floor(d/12);return r>0?`${r}y`:d>0?`${d}mo`:c>0?`${c}d`:l>0?`${l}h`:n>0?`${n}m`:`${s}s`}function Z(o){const e=Date.now()-o,s=Math.floor(e/1e3),n=Math.floor(s/60),l=Math.floor(n/60),c=Math.floor(l/24),d=Math.floor(c/30),r=Math.floor(d/12);return r>0?`${r} year${r>1?"s":""} ago`:d>0?`${d} month${d>1?"s":""} ago`:c>0?`${c} day${c>1?"s":""} ago`:l>0?`${l} hour${l>1?"s":""} ago`:n>0?`${n} minute${n>1?"s":""} ago`:`${s} second${s>1?"s":""} ago`}function D(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 S(o){const t=document.createElement("input");t.value=o,document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}const X=Object.freeze(Object.defineProperty({__proto__:null,copystr:S,joinedAgo:Z,sanitize:D,timeAgo:U},Symbol.toStringTag,{value:"Module"}));class W 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=`
873
874
  <style>
874
875
  :host {
875
876
  position: relative;
@@ -881,30 +882,49 @@
881
882
  background: var(--app-100);
882
883
  border: 1px solid var(--app-300);
883
884
  border-radius: 20px;
884
- font-family: 'Reddit Mono', consolas;
885
+ font-family: 'Reddit Mono', monospace;
886
+ font-size: 14px;
885
887
  overflow-x: auto;
886
- line-height: 1.25;
888
+ line-height: 1.5;
887
889
  white-space: pre;
890
+ color: var(--app-text);
888
891
  }
889
892
 
890
893
  .copy {
891
894
  position: absolute;
892
895
  top: 8px;
893
896
  right: 8px;
897
+ opacity: 0;
898
+ transition: opacity 0.2s;
899
+ }
900
+
901
+ :host(:hover) .copy {
902
+ opacity: 1;
894
903
  }
904
+
895
905
  pre.g {
896
906
  padding-right: 60px;
897
907
  }
908
+
909
+ .token.comment { color: var(--app-700); font-style: italic; }
910
+ .token.string { color: var(--app-green); }
911
+ .token.number { color: var(--app-orange); }
912
+ .token.keyword { color: var(--app-purple); font-weight: bold; }
913
+ .token.function { color: var(--app-blue); }
914
+ .token.tag { color: var(--app-red); }
915
+ .token.attr-name { color: var(--app-yellow); }
916
+ .token.attr-value { color: var(--app-green); }
917
+ .token.boolean { color: var(--app-orange); }
898
918
  </style>
899
919
 
900
- <eui-button class="copy" width="45" height="45" border-radius="100">
901
- <eui-icon name="copy" width="24" height="24"></eui-icon>
920
+ <eui-button class="copy" width="36" height="36" border-radius="100">
921
+ <eui-icon name="copy" width="18" height="18"></eui-icon>
902
922
  </eui-button>
903
923
 
904
924
  <pre class="${t?"g":""}"><code></code></pre>
905
- `,this.copyBtn=this.shadowRoot.querySelector(".copy"),this.codeEl=this.shadowRoot.querySelector("code"),this.codeEl.textContent=this._getFormattedText(),t?this.copyBtn.addEventListener("click",this._boundCopy):this.copyBtn.style.display="none"}_getFormattedText(){let t=this.textContent||"";t=t.replace(/^\s*\n/,"").replace(/\n\s*$/,""),t=t.replace(/[ \t]+$/gm,"");const i=t.split(`
906
- `),e=i.filter(n=>n.trim()).map(n=>n.match(/^\s*/)[0].length),r=e.length?Math.min(...e):0;return t=i.map(n=>n.slice(r)).join(`
907
- `),t}_onCopy(){C(this._getFormattedText())}disconnectedCallback(){this.copyBtn&&this.copyBtn.removeEventListener("click",this._boundCopy)}}customElements.define("eui-code",J);class V 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=`
925
+ `,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 t=this.textContent||"";t=t.replace(/^\s*\n/,"").replace(/\n\s*$/,"");const i=t.split(`
926
+ `),e=i.filter(n=>n.trim()).map(n=>n.match(/^\s*/)[0].length),s=e.length?Math.min(...e):0;return i.map(n=>n.slice(s)).join(`
927
+ `)}_highlight(t,i){return t=t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),i==="javascript"||i==="js"||i==="json"?(t=t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g,'<span class="token string">$1</span>'),t=t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm,'<span class="token comment">$1</span>'),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(/(#.*$)/gm,'<span class="token comment">$1</span>'),t=t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g,'<span class="token string">$1</span>'),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(/(&lt;!--[\s\S]*?--&gt;)/g,'<span class="token comment">$1</span>'),t=t.replace(/(&lt;\/?[a-z0-9:-]+)/gi,'<span class="token tag">$1</span>'),t=t.replace(/\s([a-z0-9:-]+)=/gi,' <span class="token attr-name">$1</span>='),t=t.replace(/(".*?")/g,'<span class="token attr-value">$1</span>'),t=t.replace(/&gt;/g,'<span class="token tag">&gt;</span>')):i==="css"&&(t=t.replace(/(\/\*[\s\S]*?\*\/)/g,'<span class="token comment">$1</span>'),t=t.replace(/([a-z-]+)(?=:)/g,'<span class="token keyword">$1</span>')),t}_onCopy(){S(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",W);class J 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=`
908
928
  <style>
909
929
  :host {
910
930
  display: block;
@@ -996,7 +1016,7 @@
996
1016
  <slot></slot>
997
1017
  </div>
998
1018
  </div>
999
- `}}customElements.define("eui-app-titlebar",V);class Y 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"),r=Math.max(i.width,i.height),n=r/2;e.style.width=e.style.height=`${r}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",()=>{e.remove()})}render(){this.shadowRoot.innerHTML=`
1019
+ `}}customElements.define("eui-app-titlebar",J);class Y 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"),s=Math.max(i.width,i.height),n=s/2;e.style.width=e.style.height=`${s}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",()=>{e.remove()})}render(){this.shadowRoot.innerHTML=`
1000
1020
  <style>
1001
1021
  :host {
1002
1022
  display: block;
@@ -1057,4 +1077,4 @@
1057
1077
  <div class="surface">
1058
1078
  <slot></slot>
1059
1079
  </div>
1060
- `}}customElements.define("eui-surface",Y),typeof window<"u"&&console.log("ErisUI loaded successfully"),p.device=M,p.haptics=$,p.icons=f,p.loadPage=F,p.router=w,p.storage=H,p.utils=W,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
1080
+ `}}customElements.define("eui-surface",Y),typeof window<"u"&&console.log("ErisUI loaded successfully"),h.device=R,h.haptics=_,h.icons=u,h.loadPage=q,h.router=w,h.storage=I,h.utils=X,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
package/dist/erisui.mjs CHANGED
@@ -1,4 +1,7 @@
1
- class C extends HTMLElement {
1
+ var S = Object.defineProperty;
2
+ var z = (o, t, i) => t in o ? S(o, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : o[t] = i;
3
+ var v = (o, t, i) => z(o, typeof t != "symbol" ? t + "" : t, i);
4
+ class M extends HTMLElement {
2
5
  static get observedAttributes() {
3
6
  return ["size", "border-radius", "name", "color"];
4
7
  }
@@ -63,14 +66,14 @@ class C extends HTMLElement {
63
66
  this.avatar.style.width = e + "px", this.avatar.style.height = e + "px", this.initials.style.fontSize = e / 2 + "px";
64
67
  }
65
68
  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
- const r = this.getAttribute("name").trim().split(/\s+/);
69
+ const s = this.getAttribute("name").trim().split(/\s+/);
67
70
  let n = "";
68
- r.length === 1 ? n = r[0][0] || "" : n = (r[0][0] || "") + (r[r.length - 1][0] || ""), this.initials.textContent = n.toUpperCase();
71
+ s.length === 1 ? n = s[0][0] || "" : n = (s[0][0] || "") + (s[s.length - 1][0] || ""), this.initials.textContent = n.toUpperCase();
69
72
  }
70
73
  }
71
74
  }
72
- customElements.define("eui-avatar", C);
73
- const b = /* @__PURE__ */ (() => {
75
+ customElements.define("eui-avatar", M);
76
+ const u = /* @__PURE__ */ (() => {
74
77
  let o = {};
75
78
  return {
76
79
  register(t, i) {
@@ -81,10 +84,15 @@ const b = /* @__PURE__ */ (() => {
81
84
  }
82
85
  };
83
86
  })();
84
- b.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>');
85
- b.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>');
86
- b.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>');
87
- class S extends HTMLElement {
87
+ 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>');
88
+ 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>');
89
+ 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>');
90
+ 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>');
91
+ 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>');
92
+ 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>');
93
+ 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>');
94
+ 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>');
95
+ class $ extends HTMLElement {
88
96
  static get observedAttributes() {
89
97
  return ["name", "width", "height"];
90
98
  }
@@ -98,23 +106,23 @@ class S extends HTMLElement {
98
106
  this.render();
99
107
  }
100
108
  render() {
101
- const t = this.getAttribute("name"), i = b.get(t);
109
+ const t = this.getAttribute("name"), i = u.get(t);
102
110
  if (!i) {
103
111
  this.shadowRoot.innerHTML = '<span style="color:red;">?</span>';
104
112
  return;
105
113
  }
106
114
  const e = document.createElement("template");
107
115
  e.innerHTML = i.trim();
108
- const r = e.content.cloneNode(!0), n = r.firstElementChild;
116
+ const s = e.content.cloneNode(!0), n = s.firstElementChild;
109
117
  if (n && n.style) {
110
- const a = this.getAttribute("width"), l = this.getAttribute("height");
111
- a && n.setAttribute("width", a), l && n.setAttribute("height", l), n.style.display = "block";
118
+ const l = this.getAttribute("width"), c = this.getAttribute("height");
119
+ l && n.setAttribute("width", l), c && n.setAttribute("height", c), n.style.display = "block";
112
120
  }
113
- this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(r);
121
+ this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(s);
114
122
  }
115
123
  }
116
- customElements.define("eui-icon", S);
117
- class L extends HTMLElement {
124
+ customElements.define("eui-icon", $);
125
+ class T extends HTMLElement {
118
126
  static get observedAttributes() {
119
127
  return ["label", "value", "id", "type", "filled"];
120
128
  }
@@ -247,8 +255,8 @@ class L extends HTMLElement {
247
255
  this.setAttribute("value", t);
248
256
  }
249
257
  }
250
- customElements.define("eui-input", L);
251
- class z extends HTMLElement {
258
+ customElements.define("eui-input", T);
259
+ class R extends HTMLElement {
252
260
  constructor() {
253
261
  super(), this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = `
254
262
  <style>
@@ -298,8 +306,8 @@ class z extends HTMLElement {
298
306
  `;
299
307
  }
300
308
  }
301
- customElements.define("eui-loader", z);
302
- class M extends HTMLElement {
309
+ customElements.define("eui-loader", R);
310
+ class H extends HTMLElement {
303
311
  static get observedAttributes() {
304
312
  return ["value", "intermediate", "id"];
305
313
  }
@@ -361,8 +369,8 @@ class M extends HTMLElement {
361
369
  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") + "%");
362
370
  }
363
371
  }
364
- customElements.define("eui-progressbar", M);
365
- const v = {
372
+ customElements.define("eui-progressbar", H);
373
+ const x = {
366
374
  is: {
367
375
  iPhone: /iPhone/.test(navigator.userAgent),
368
376
  iPad: /iPad/.test(navigator.userAgent),
@@ -382,11 +390,11 @@ const v = {
382
390
  haptics: "vibrate" in navigator || "Vibrate" in window || typeof window.navigator.vibrate == "function"
383
391
  },
384
392
  userAgent: navigator.userAgent
385
- }, X = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
393
+ }, J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
386
394
  __proto__: null,
387
- device: v
395
+ device: x
388
396
  }, Symbol.toStringTag, { value: "Module" }));
389
- function T() {
397
+ function _() {
390
398
  try {
391
399
  const o = document.createElement("label");
392
400
  o.ariaHidden = "true", o.style.display = "none";
@@ -395,13 +403,13 @@ function T() {
395
403
  } catch {
396
404
  }
397
405
  }
398
- function x(o) {
399
- v.supports.haptics ? navigator.vibrate(o || 50) : v.is.iPhone && T();
406
+ function w(o) {
407
+ x.supports.haptics ? navigator.vibrate(o || 50) : x.is.iPhone && _();
400
408
  }
401
- const W = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
409
+ const Y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
402
410
  __proto__: null,
403
- haptic: x
404
- }, Symbol.toStringTag, { value: "Module" })), w = (() => {
411
+ haptic: w
412
+ }, Symbol.toStringTag, { value: "Module" })), y = (() => {
405
413
  let o = {}, t;
406
414
  try {
407
415
  o = JSON.parse(localStorage.getItem(t) || "{}");
@@ -450,12 +458,12 @@ const W = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
450
458
  }
451
459
  }
452
460
  };
453
- })(), y = w.settings, J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
461
+ })(), k = y.settings, K = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
454
462
  __proto__: null,
455
- settings: y,
456
- storage: w
463
+ settings: k,
464
+ storage: y
457
465
  }, Symbol.toStringTag, { value: "Module" }));
458
- class R extends HTMLElement {
466
+ class I extends HTMLElement {
459
467
  static get observedAttributes() {
460
468
  return ["selected"];
461
469
  }
@@ -535,7 +543,7 @@ class R extends HTMLElement {
535
543
  this.inputEl = this.shadowRoot.querySelector("input"), this.switchEl = this.shadowRoot.querySelector(".switch"), this.updateFromAttribute(), this.switchEl.addEventListener("click", () => this.toggle());
536
544
  }
537
545
  toggle() {
538
- this.selected = !this.selected, x();
546
+ this.selected = !this.selected, w();
539
547
  }
540
548
  updateFromAttribute() {
541
549
  const t = this.hasAttribute("selected");
@@ -551,8 +559,8 @@ class R extends HTMLElement {
551
559
  t ? this.setAttribute("selected", "") : this.removeAttribute("selected");
552
560
  }
553
561
  }
554
- customElements.define("eui-switch", R);
555
- class $ extends HTMLElement {
562
+ customElements.define("eui-switch", I);
563
+ class F extends HTMLElement {
556
564
  constructor() {
557
565
  super(), this.attachShadow({ mode: "open" });
558
566
  }
@@ -603,89 +611,89 @@ class $ extends HTMLElement {
603
611
  </style>
604
612
  <slot></slot>
605
613
  `, this.addEventListener("pointerdown", (t) => {
606
- const i = document.createElement("span"), e = t.currentTarget, r = Math.max(e.offsetWidth, e.offsetHeight);
607
- i.classList.add("ripple"), i.style.left = t.clientX - e.getBoundingClientRect().left - r / 2 + "px", i.style.top = t.clientY - e.getBoundingClientRect().top - r / 2 + "px", i.style.width = r + "px", i.style.height = r + "px", this.shadowRoot.appendChild(i), setTimeout(() => {
614
+ const i = document.createElement("span"), e = t.currentTarget, s = Math.max(e.offsetWidth, e.offsetHeight);
615
+ i.classList.add("ripple"), i.style.left = t.clientX - e.getBoundingClientRect().left - s / 2 + "px", i.style.top = t.clientY - e.getBoundingClientRect().top - s / 2 + "px", i.style.width = s + "px", i.style.height = s + "px", this.shadowRoot.appendChild(i), setTimeout(() => {
608
616
  i.remove();
609
617
  }, 600);
610
618
  });
611
619
  }
612
620
  }
613
- customElements.define("eui-chip", $);
614
- const g = "", k = (() => {
621
+ customElements.define("eui-chip", F);
622
+ const b = "", C = (() => {
615
623
  const o = [];
616
- function t(s, d) {
617
- const h = [], u = s.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${g}${u}$`);
618
- o.push({ regex: p, paramNames: h, renderFn: d });
624
+ function t(r, a) {
625
+ const h = [], g = r.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${b}${g}$`);
626
+ o.push({ regex: p, paramNames: h, renderFn: a });
619
627
  }
620
- function i(s) {
621
- for (const { regex: d, paramNames: h, renderFn: u } of o) {
622
- const p = s.match(d);
628
+ function i(r) {
629
+ for (const { regex: a, paramNames: h, renderFn: g } of o) {
630
+ const p = r.match(a);
623
631
  if (p) {
624
632
  const m = {};
625
- return h.forEach((f, A) => {
626
- m[f] = decodeURIComponent(p[A + 1]);
627
- }), { renderFn: u, params: m };
633
+ return h.forEach((f, L) => {
634
+ m[f] = decodeURIComponent(p[L + 1]);
635
+ }), { renderFn: g, params: m };
628
636
  }
629
637
  }
630
638
  return null;
631
639
  }
632
- function e(s, d = !0) {
633
- s.startsWith(g) || (s = g + (s.startsWith("/") ? "" : "/") + s);
634
- const h = s.split(/[?#]/)[0];
635
- if (h === window.location.pathname && s.includes("#")) {
636
- d && history.pushState({}, "", s);
637
- const p = "#" + s.split("#")[1];
638
- r(p);
640
+ function e(r, a = !0) {
641
+ r.startsWith(b) || (r = b + (r.startsWith("/") ? "" : "/") + r);
642
+ const h = r.split(/[?#]/)[0];
643
+ if (h === window.location.pathname && r.includes("#")) {
644
+ a && history.pushState({}, "", r);
645
+ const p = "#" + r.split("#")[1];
646
+ s(p);
639
647
  return;
640
648
  }
641
- const u = i(h);
642
- if (u)
643
- if (d && history.pushState({}, "", s), u.renderFn(u.params), window.dispatchEvent(new CustomEvent("route-changed", { detail: { path: s } })), s.includes("#")) {
644
- const p = "#" + s.split("#")[1];
645
- setTimeout(() => r(p), 100);
649
+ const g = i(h);
650
+ if (g)
651
+ if (a && history.pushState({}, "", r), g.renderFn(g.params), window.dispatchEvent(new CustomEvent("route-changed", { detail: { path: r } })), r.includes("#")) {
652
+ const p = "#" + r.split("#")[1];
653
+ setTimeout(() => s(p), 100);
646
654
  } else {
647
655
  const p = document.getElementById("main");
648
656
  p && p.scrollTo(0, 0);
649
657
  }
650
- else n ? (d && history.pushState({}, "", s), n()) : console.warn(`No route found for ${h}`);
658
+ else n ? (a && history.pushState({}, "", r), n()) : console.warn(`No route found for ${h}`);
651
659
  }
652
- function r(s) {
653
- if (s)
660
+ function s(r) {
661
+ if (r)
654
662
  try {
655
- const d = document.querySelector(s);
656
- d && d.scrollIntoView({ behavior: "smooth" });
663
+ const a = document.querySelector(r);
664
+ a && a.scrollIntoView({ behavior: "smooth" });
657
665
  } catch {
658
- console.warn("Invalid hash:", s);
666
+ console.warn("Invalid hash:", r);
659
667
  }
660
668
  }
661
669
  let n = null;
662
- function a(s) {
663
- n = s;
670
+ function l(r) {
671
+ n = r;
664
672
  }
665
- function l() {
673
+ function c() {
666
674
  history.back();
667
675
  }
668
- function c() {
669
- return window.location.pathname.replace(g, "") || "/";
676
+ function d() {
677
+ return window.location.pathname.replace(b, "") || "/";
670
678
  }
671
679
  return window.addEventListener("popstate", () => {
672
- const s = window.location.pathname + window.location.search + window.location.hash;
673
- e(s, !1);
674
- }), window.addEventListener("click", (s) => {
675
- if (s.button !== 0 || s.metaKey || s.altKey || s.ctrlKey || s.shiftKey) return;
676
- const d = s.target.closest("a");
677
- if (!d || d.hasAttribute("download") || d.getAttribute("target") === "_blank") return;
678
- const h = d.getAttribute("href");
680
+ const r = window.location.pathname + window.location.search + window.location.hash;
681
+ e(r, !1);
682
+ }), window.addEventListener("click", (r) => {
683
+ if (r.button !== 0 || r.metaKey || r.altKey || r.ctrlKey || r.shiftKey) return;
684
+ const a = r.target.closest("a");
685
+ if (!a || a.hasAttribute("download") || a.getAttribute("target") === "_blank") return;
686
+ const h = a.getAttribute("href");
679
687
  if (!(!h || h.startsWith("http") && !h.startsWith(window.location.origin))) {
680
- if (s.preventDefault(), h.startsWith("#")) {
681
- history.pushState({}, "", h), r(h);
688
+ if (r.preventDefault(), h.startsWith("#")) {
689
+ history.pushState({}, "", h), s(h);
682
690
  return;
683
691
  }
684
692
  e(h);
685
693
  }
686
- }), { add: t, navigate: e, back: l, location: c, setNotFound: a };
694
+ }), { add: t, navigate: e, back: c, location: d, setNotFound: l };
687
695
  })();
688
- async function V(o) {
696
+ async function G(o) {
689
697
  try {
690
698
  const t = document.getElementById("main");
691
699
  t.classList.add("fade-out"), await new Promise((e) => setTimeout(e, 200));
@@ -703,59 +711,60 @@ async function V(o) {
703
711
  console.error("Page load failed:", t);
704
712
  }
705
713
  }
706
- class H extends HTMLElement {
714
+ class q extends HTMLElement {
715
+ constructor() {
716
+ super();
717
+ v(this, "handleClick", () => {
718
+ const i = this.getAttribute("path");
719
+ i && C.navigate(i);
720
+ });
721
+ this.attachShadow({ mode: "open" });
722
+ }
707
723
  static get observedAttributes() {
708
724
  return ["path", "icon", "label", "badge", "active", "avatar-src", "avatar-name"];
709
725
  }
710
- constructor() {
711
- super(), this.attachShadow({ mode: "open" });
712
- }
713
726
  connectedCallback() {
714
727
  this.hasRendered || (this.render(), this.setupEventListeners(), this.hasRendered = !0), this.updateContent(), this.addEventListener("click", this.handleClick);
715
728
  }
716
729
  disconnectedCallback() {
717
730
  this.removeEventListener("click", this.handleClick);
718
731
  }
719
- attributeChangedCallback(t, i, e) {
720
- if (i !== e && this.hasRendered) {
721
- if (t === "active")
732
+ attributeChangedCallback(i, e, s) {
733
+ if (e !== s && this.hasRendered) {
734
+ if (i === "active")
722
735
  return;
723
736
  this.updateContent();
724
737
  }
725
738
  }
726
- handleClick = () => {
727
- const t = this.getAttribute("path");
728
- t && k.navigate(t);
729
- };
730
739
  setupEventListeners() {
731
- this.addEventListener("pointerdown", (t) => {
732
- const i = document.createElement("span"), e = t.currentTarget, r = e.getBoundingClientRect(), n = Math.max(e.offsetWidth, e.offsetHeight), a = n / 2;
733
- i.classList.add("ripple"), i.style.width = `${n}px`, i.style.height = `${n}px`, i.style.left = `${t.clientX - r.left - a}px`, i.style.top = `${t.clientY - r.top - a}px`, this.shadowRoot.appendChild(i), i.addEventListener("animationend", () => {
734
- i.remove();
740
+ this.addEventListener("pointerdown", (i) => {
741
+ const e = document.createElement("span"), s = i.currentTarget, n = s.getBoundingClientRect(), l = Math.max(s.offsetWidth, s.offsetHeight), c = l / 2;
742
+ e.classList.add("ripple"), e.style.width = `${l}px`, e.style.height = `${l}px`, e.style.left = `${i.clientX - n.left - c}px`, e.style.top = `${i.clientY - n.top - c}px`, this.shadowRoot.appendChild(e), e.addEventListener("animationend", () => {
743
+ e.remove();
735
744
  });
736
745
  });
737
746
  }
738
747
  updateContent() {
739
- const t = this.getAttribute("icon"), i = this.getAttribute("avatar-src"), e = this.getAttribute("avatar-name"), r = this.getAttribute("label") || "", n = this.getAttribute("badge"), a = this.shadowRoot.querySelector(".badge");
740
- if (n)
741
- if (a)
742
- a.textContent = n;
748
+ const i = this.getAttribute("icon"), e = this.getAttribute("avatar-src"), s = this.getAttribute("avatar-name"), n = this.getAttribute("label") || "", l = this.getAttribute("badge"), c = this.shadowRoot.querySelector(".badge");
749
+ if (l)
750
+ if (c)
751
+ c.textContent = l;
743
752
  else {
744
- const s = document.createElement("span");
745
- s.className = "badge", s.textContent = n, this.shadowRoot.appendChild(s);
753
+ const a = document.createElement("span");
754
+ a.className = "badge", a.textContent = l, this.shadowRoot.appendChild(a);
746
755
  }
747
- else a && a.remove();
748
- const l = this.shadowRoot.querySelector("slot[name='icon']");
749
- if (l)
750
- if (i || e) {
751
- let s = '<eui-avatar size="24"';
752
- e && (s += ` name="${e}"`), s += ">", i && (s += `<img src="${i}" alt="${e || "Avatar"}" />`), s += "</eui-avatar>", l.innerHTML = s;
756
+ else c && c.remove();
757
+ const d = this.shadowRoot.querySelector("slot[name='icon']");
758
+ if (d)
759
+ if (e || s) {
760
+ let a = '<eui-avatar size="24"';
761
+ s && (a += ` name="${s}"`), a += ">", e && (a += `<img src="${e}" alt="${s || "Avatar"}" />`), a += "</eui-avatar>", d.innerHTML = a;
753
762
  } else {
754
- const s = l.querySelector("eui-icon");
755
- 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 = "";
763
+ const a = d.querySelector("eui-icon");
764
+ i && a ? a.getAttribute("name") !== i && a.setAttribute("name", i) : i ? d.innerHTML = `<eui-icon width="24" height="24" name="${i}"></eui-icon>` : d.innerHTML = "";
756
765
  }
757
- const c = this.shadowRoot.querySelector(".label");
758
- c && (c.textContent = r);
766
+ const r = this.shadowRoot.querySelector(".label");
767
+ r && (r.textContent = n);
759
768
  }
760
769
  render() {
761
770
  this.shadowRoot.innerHTML = `
@@ -866,8 +875,8 @@ class H extends HTMLElement {
866
875
  `;
867
876
  }
868
877
  }
869
- customElements.define("eui-nav-item", H);
870
- class _ extends HTMLElement {
878
+ customElements.define("eui-nav-item", q);
879
+ class j extends HTMLElement {
871
880
  constructor() {
872
881
  super(), this.attachShadow({ mode: "open" });
873
882
  }
@@ -895,6 +904,7 @@ class _ extends HTMLElement {
895
904
 
896
905
  .app-nav-container {
897
906
  width: 100%;
907
+ min-width: var(--nav-width, 75px);
898
908
  height: 100%;
899
909
  box-sizing: border-box;
900
910
  background-color: var(--app-200);
@@ -975,9 +985,10 @@ class _ extends HTMLElement {
975
985
  <a href="#content" id="skip_navigation_link">Skip To Content</a>
976
986
  <div class="nav-items">
977
987
  ${this.navItems.map((t) => {
988
+ var s, n;
978
989
  if (t.type === "divider")
979
990
  return '<div style="height: 1px; background: var(--app-300); margin: 0.5rem 0;"></div>';
980
- const i = t.avatar?.src || "", e = t.avatar?.name || "";
991
+ const i = ((s = t.avatar) == null ? void 0 : s.src) || "", e = ((n = t.avatar) == null ? void 0 : n.name) || "";
981
992
  return `<eui-nav-item path="${t.path}" icon="${t.icon}" avatar-src="${i}" avatar-name="${e}" label="${t.label}"></eui-nav-item>`;
982
993
  }).join("")}
983
994
  </div>
@@ -991,13 +1002,13 @@ class _ extends HTMLElement {
991
1002
  return this._navItems || [];
992
1003
  }
993
1004
  updateActiveState(t) {
994
- t || (t = k.location()), t.startsWith("/") || (t = "/" + t), this.shadowRoot.querySelectorAll("eui-nav-item").forEach((e) => {
1005
+ t || (t = C.location()), t.startsWith("/") || (t = "/" + t), this.shadowRoot.querySelectorAll("eui-nav-item").forEach((e) => {
995
1006
  e.getAttribute("path") === t ? e.setAttribute("active", "") : e.removeAttribute("active");
996
1007
  });
997
1008
  }
998
1009
  }
999
- customElements.define("eui-app-nav", _);
1000
- class I extends HTMLElement {
1010
+ customElements.define("eui-app-nav", j);
1011
+ class B extends HTMLElement {
1001
1012
  static get observedAttributes() {
1002
1013
  return ["type", "title", "subtitle", "img"];
1003
1014
  }
@@ -1077,12 +1088,12 @@ class I extends HTMLElement {
1077
1088
  this.hd = this.shadowRoot.querySelector(".header"), this.hasAttribute("type") && this.hd.classList.add(this.getAttribute("type"));
1078
1089
  }
1079
1090
  attributeChangedCallback(t, i, e) {
1080
- const r = this.shadowRoot.querySelector("h1"), n = this.shadowRoot.querySelector("p"), a = this.shadowRoot.querySelector(".img");
1081
- t === "title" && (r.textContent = e), t === "subtitle" && (n.textContent = e), t === "img" && (a.style.backgroundImage = e ? `url(${e})` : "");
1091
+ const s = this.shadowRoot.querySelector("h1"), n = this.shadowRoot.querySelector("p"), l = this.shadowRoot.querySelector(".img");
1092
+ t === "title" && (s.textContent = e), t === "subtitle" && (n.textContent = e), t === "img" && (l.style.backgroundImage = e ? `url(${e})` : "");
1082
1093
  }
1083
1094
  }
1084
- customElements.define("eui-header", I);
1085
- class F extends HTMLElement {
1095
+ customElements.define("eui-header", B);
1096
+ class N extends HTMLElement {
1086
1097
  static get observedAttributes() {
1087
1098
  return ["selected"];
1088
1099
  }
@@ -1176,9 +1187,9 @@ class F extends HTMLElement {
1176
1187
  this.inputEl = this.shadowRoot.querySelector("input"), this.checkEl = this.shadowRoot.querySelector(".checkbox"), this.updateFromAttribute(), this.checkEl.addEventListener("click", () => this.toggle());
1177
1188
  }
1178
1189
  toggle() {
1179
- this.selected = !this.selected, x();
1190
+ this.selected = !this.selected, w();
1180
1191
  const t = this.selected, i = this.dataset.setting;
1181
- i && y.set(i, t);
1192
+ i && k.set(i, t);
1182
1193
  }
1183
1194
  updateFromAttribute() {
1184
1195
  const t = this.hasAttribute("selected");
@@ -1194,9 +1205,8 @@ class F extends HTMLElement {
1194
1205
  t ? this.setAttribute("selected", "") : this.removeAttribute("selected");
1195
1206
  }
1196
1207
  }
1197
- customElements.define("eui-checkbox", F);
1198
- class q extends HTMLElement {
1199
- static observedAttributes = ["type", "width", "height", "border-radius", "icon", "link", "href"];
1208
+ customElements.define("eui-checkbox", N);
1209
+ class A extends HTMLElement {
1200
1210
  constructor() {
1201
1211
  super(), this.attachShadow({ mode: "open" });
1202
1212
  }
@@ -1313,16 +1323,17 @@ class q extends HTMLElement {
1313
1323
  </${i}>
1314
1324
  `;
1315
1325
  const e = this.shadowRoot.querySelector(i);
1316
- 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", (r) => {
1317
- const n = document.createElement("span"), a = r.currentTarget, l = a.getBoundingClientRect(), c = Math.max(a.offsetWidth, a.offsetHeight), s = c / 2;
1318
- n.classList.add("ripple"), n.style.width = `${c}px`, n.style.height = `${c}px`, n.style.left = `${r.clientX - l.left - s}px`, n.style.top = `${r.clientY - l.top - s}px`, e.appendChild(n), n.addEventListener("animationend", () => {
1326
+ 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", (s) => {
1327
+ const n = document.createElement("span"), l = s.currentTarget, c = l.getBoundingClientRect(), d = Math.max(l.offsetWidth, l.offsetHeight), r = d / 2;
1328
+ n.classList.add("ripple"), n.style.width = `${d}px`, n.style.height = `${d}px`, n.style.left = `${s.clientX - c.left - r}px`, n.style.top = `${s.clientY - c.top - r}px`, e.appendChild(n), n.addEventListener("animationend", () => {
1319
1329
  n.remove();
1320
1330
  });
1321
1331
  });
1322
1332
  }
1323
1333
  }
1324
- customElements.define("eui-button", q);
1325
- class j extends HTMLElement {
1334
+ v(A, "observedAttributes", ["type", "width", "height", "border-radius", "icon", "link", "href"]);
1335
+ customElements.define("eui-button", A);
1336
+ class O extends HTMLElement {
1326
1337
  static get observedAttributes() {
1327
1338
  return ["type", "anchor"];
1328
1339
  }
@@ -1394,32 +1405,32 @@ class j extends HTMLElement {
1394
1405
  `;
1395
1406
  }
1396
1407
  }
1397
- customElements.define("eui-heading", j);
1398
- function N(o) {
1399
- const e = Date.now() - o, r = Math.floor(e / 1e3), n = Math.floor(r / 60), a = Math.floor(n / 60), l = Math.floor(a / 24), c = Math.floor(l / 30), s = Math.floor(c / 12);
1400
- return s > 0 ? `${s}y` : c > 0 ? `${c}mo` : l > 0 ? `${l}d` : a > 0 ? `${a}h` : n > 0 ? `${n}m` : `${r}s`;
1408
+ customElements.define("eui-heading", O);
1409
+ function P(o) {
1410
+ const e = Date.now() - o, s = Math.floor(e / 1e3), n = Math.floor(s / 60), l = Math.floor(n / 60), c = Math.floor(l / 24), d = Math.floor(c / 30), r = Math.floor(d / 12);
1411
+ return r > 0 ? `${r}y` : d > 0 ? `${d}mo` : c > 0 ? `${c}d` : l > 0 ? `${l}h` : n > 0 ? `${n}m` : `${s}s`;
1401
1412
  }
1402
- function B(o) {
1403
- const e = Date.now() - o, r = Math.floor(e / 1e3), n = Math.floor(r / 60), a = Math.floor(n / 60), l = Math.floor(a / 24), c = Math.floor(l / 30), s = Math.floor(c / 12);
1404
- 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` : a > 0 ? `${a} hour${a > 1 ? "s" : ""} ago` : n > 0 ? `${n} minute${n > 1 ? "s" : ""} ago` : `${r} second${r > 1 ? "s" : ""} ago`;
1413
+ function V(o) {
1414
+ const e = Date.now() - o, s = Math.floor(e / 1e3), n = Math.floor(s / 60), l = Math.floor(n / 60), c = Math.floor(l / 24), d = Math.floor(c / 30), r = Math.floor(d / 12);
1415
+ return r > 0 ? `${r} year${r > 1 ? "s" : ""} ago` : d > 0 ? `${d} month${d > 1 ? "s" : ""} ago` : c > 0 ? `${c} day${c > 1 ? "s" : ""} ago` : l > 0 ? `${l} hour${l > 1 ? "s" : ""} ago` : n > 0 ? `${n} minute${n > 1 ? "s" : ""} ago` : `${s} second${s > 1 ? "s" : ""} ago`;
1405
1416
  }
1406
- function O(o) {
1417
+ function U(o) {
1407
1418
  return o.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;").replace(/`/g, "&#96;").replace(/'/g, "&#39;");
1408
1419
  }
1409
1420
  function E(o) {
1410
1421
  const t = document.createElement("input");
1411
1422
  t.value = o, document.body.appendChild(t), t.select(), document.execCommand("copy"), document.body.removeChild(t);
1412
1423
  }
1413
- const Y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1424
+ const Q = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
1414
1425
  __proto__: null,
1415
1426
  copystr: E,
1416
- joinedAgo: B,
1417
- sanitize: O,
1418
- timeAgo: N
1427
+ joinedAgo: V,
1428
+ sanitize: U,
1429
+ timeAgo: P
1419
1430
  }, Symbol.toStringTag, { value: "Module" }));
1420
- class P extends HTMLElement {
1431
+ class Z extends HTMLElement {
1421
1432
  static get observedAttributes() {
1422
- return ["copy", "id", "type"];
1433
+ return ["copy", "id", "type", "language"];
1423
1434
  }
1424
1435
  constructor() {
1425
1436
  super(), this.attachShadow({ mode: "open" }), this._boundCopy = this._onCopy.bind(this), this._isRendered = !1;
@@ -1427,8 +1438,11 @@ class P extends HTMLElement {
1427
1438
  connectedCallback() {
1428
1439
  this._isRendered || (this.render(), this._isRendered = !0);
1429
1440
  }
1441
+ attributeChangedCallback(t, i, e) {
1442
+ this._isRendered && i !== e && this.render();
1443
+ }
1430
1444
  render() {
1431
- const t = this.hasAttribute("copy");
1445
+ const t = this.hasAttribute("copy"), i = this.getAttribute("language") || "text";
1432
1446
  this.shadowRoot.innerHTML = `
1433
1447
  <style>
1434
1448
  :host {
@@ -1441,46 +1455,75 @@ class P extends HTMLElement {
1441
1455
  background: var(--app-100);
1442
1456
  border: 1px solid var(--app-300);
1443
1457
  border-radius: 20px;
1444
- font-family: 'Reddit Mono', consolas;
1458
+ font-family: 'Reddit Mono', monospace;
1459
+ font-size: 14px;
1445
1460
  overflow-x: auto;
1446
- line-height: 1.25;
1461
+ line-height: 1.5;
1447
1462
  white-space: pre;
1463
+ color: var(--app-text);
1448
1464
  }
1449
1465
 
1450
1466
  .copy {
1451
1467
  position: absolute;
1452
1468
  top: 8px;
1453
1469
  right: 8px;
1470
+ opacity: 0;
1471
+ transition: opacity 0.2s;
1454
1472
  }
1473
+
1474
+ :host(:hover) .copy {
1475
+ opacity: 1;
1476
+ }
1477
+
1455
1478
  pre.g {
1456
1479
  padding-right: 60px;
1457
1480
  }
1481
+
1482
+ .token.comment { color: var(--app-700); font-style: italic; }
1483
+ .token.string { color: var(--app-green); }
1484
+ .token.number { color: var(--app-orange); }
1485
+ .token.keyword { color: var(--app-purple); font-weight: bold; }
1486
+ .token.function { color: var(--app-blue); }
1487
+ .token.tag { color: var(--app-red); }
1488
+ .token.attr-name { color: var(--app-yellow); }
1489
+ .token.attr-value { color: var(--app-green); }
1490
+ .token.boolean { color: var(--app-orange); }
1458
1491
  </style>
1459
1492
 
1460
- <eui-button class="copy" width="45" height="45" border-radius="100">
1461
- <eui-icon name="copy" width="24" height="24"></eui-icon>
1493
+ <eui-button class="copy" width="36" height="36" border-radius="100">
1494
+ <eui-icon name="copy" width="18" height="18"></eui-icon>
1462
1495
  </eui-button>
1463
1496
 
1464
1497
  <pre class="${t ? "g" : ""}"><code></code></pre>
1465
- `, this.copyBtn = this.shadowRoot.querySelector(".copy"), this.codeEl = this.shadowRoot.querySelector("code"), this.codeEl.textContent = this._getFormattedText(), t ? this.copyBtn.addEventListener("click", this._boundCopy) : this.copyBtn.style.display = "none";
1498
+ `, this.copyBtn = this.shadowRoot.querySelector(".copy"), this.codeEl = this.shadowRoot.querySelector("code");
1499
+ const e = this._getFormattedText();
1500
+ this.codeEl.innerHTML = this._highlight(e, i), t ? this.copyBtn.addEventListener("click", this._boundCopy) : this.copyBtn.style.display = "none";
1466
1501
  }
1467
1502
  _getFormattedText() {
1468
1503
  let t = this.textContent || "";
1469
- t = t.replace(/^\s*\n/, "").replace(/\n\s*$/, ""), t = t.replace(/[ \t]+$/gm, "");
1504
+ t = t.replace(/^\s*\n/, "").replace(/\n\s*$/, "");
1470
1505
  const i = t.split(`
1471
- `), e = i.filter((n) => n.trim()).map((n) => n.match(/^\s*/)[0].length), r = e.length ? Math.min(...e) : 0;
1472
- return t = i.map((n) => n.slice(r)).join(`
1473
- `), t;
1506
+ `), e = i.filter((n) => n.trim()).map((n) => n.match(/^\s*/)[0].length), s = e.length ? Math.min(...e) : 0;
1507
+ return i.map((n) => n.slice(s)).join(`
1508
+ `);
1509
+ }
1510
+ _highlight(t, i) {
1511
+ return t = t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), i === "javascript" || i === "js" || i === "json" ? (t = t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g, '<span class="token string">$1</span>'), t = t.replace(/(\/\/.*$|\/\*[\s\S]*?\*\/)/gm, '<span class="token comment">$1</span>'), 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(/(#.*$)/gm, '<span class="token comment">$1</span>'), t = t.replace(/("(?:[^"\\]|\\.)*"|'(?:[^'\\]|\\.)*')/g, '<span class="token string">$1</span>'), 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(/(&lt;!--[\s\S]*?--&gt;)/g, '<span class="token comment">$1</span>'), t = t.replace(/(&lt;\/?[a-z0-9:-]+)/gi, '<span class="token tag">$1</span>'), t = t.replace(/\s([a-z0-9:-]+)=/gi, ' <span class="token attr-name">$1</span>='), t = t.replace(/(".*?")/g, '<span class="token attr-value">$1</span>'), t = t.replace(/&gt;/g, '<span class="token tag">&gt;</span>')) : i === "css" && (t = t.replace(/(\/\*[\s\S]*?\*\/)/g, '<span class="token comment">$1</span>'), t = t.replace(/([a-z-]+)(?=:)/g, '<span class="token keyword">$1</span>')), t;
1474
1512
  }
1475
1513
  _onCopy() {
1476
1514
  E(this._getFormattedText());
1515
+ const t = this.copyBtn.querySelector("eui-icon");
1516
+ if (t) {
1517
+ const i = t.getAttribute("name");
1518
+ t.setAttribute("name", "check"), setTimeout(() => t.setAttribute("name", i), 2e3);
1519
+ }
1477
1520
  }
1478
1521
  disconnectedCallback() {
1479
1522
  this.copyBtn && this.copyBtn.removeEventListener("click", this._boundCopy);
1480
1523
  }
1481
1524
  }
1482
- customElements.define("eui-code", P);
1483
- class U extends HTMLElement {
1525
+ customElements.define("eui-code", Z);
1526
+ class D extends HTMLElement {
1484
1527
  constructor() {
1485
1528
  super(), this.attachShadow({ mode: "open" });
1486
1529
  }
@@ -1596,8 +1639,8 @@ class U extends HTMLElement {
1596
1639
  `;
1597
1640
  }
1598
1641
  }
1599
- customElements.define("eui-app-titlebar", U);
1600
- class D extends HTMLElement {
1642
+ customElements.define("eui-app-titlebar", D);
1643
+ class X extends HTMLElement {
1601
1644
  constructor() {
1602
1645
  super(), this.attachShadow({ mode: "open" }), this._handleMouseDown = this._addRipple.bind(this);
1603
1646
  }
@@ -1614,8 +1657,8 @@ class D extends HTMLElement {
1614
1657
  this.removeEventListener("mousedown", this._handleMouseDown), this.hasAttribute("ripple") && this.addEventListener("mousedown", this._handleMouseDown);
1615
1658
  }
1616
1659
  _addRipple(t) {
1617
- const i = this.getBoundingClientRect(), e = document.createElement("span"), r = Math.max(i.width, i.height), n = r / 2;
1618
- e.style.width = e.style.height = `${r}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", () => {
1660
+ const i = this.getBoundingClientRect(), e = document.createElement("span"), s = Math.max(i.width, i.height), n = s / 2;
1661
+ e.style.width = e.style.height = `${s}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", () => {
1619
1662
  e.remove();
1620
1663
  });
1621
1664
  }
@@ -1684,14 +1727,14 @@ class D extends HTMLElement {
1684
1727
  `;
1685
1728
  }
1686
1729
  }
1687
- customElements.define("eui-surface", D);
1730
+ customElements.define("eui-surface", X);
1688
1731
  typeof window < "u" && console.log("ErisUI loaded successfully");
1689
1732
  export {
1690
- X as device,
1691
- W as haptics,
1692
- b as icons,
1693
- V as loadPage,
1694
- k as router,
1695
- J as storage,
1696
- Y as utils
1733
+ J as device,
1734
+ Y as haptics,
1735
+ u as icons,
1736
+ G as loadPage,
1737
+ C as router,
1738
+ K as storage,
1739
+ Q as utils
1697
1740
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@3r1s_s/erisui",
3
- "version": "1.0.10",
3
+ "version": "1.0.11",
4
4
  "description": "an awesome ui library for web apps",
5
5
  "type": "module",
6
6
  "files": [
@@ -20,6 +20,7 @@
20
20
  "scripts": {
21
21
  "dev": "vite",
22
22
  "build": "vite build",
23
+ "build:lib": "vite build",
23
24
  "preview": "vite preview",
24
25
  "prepublishOnly": "npm run build"
25
26
  },