@3r1s_s/erisui 1.0.8 → 1.0.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/erisui.css +1 -1
- package/dist/erisui.js +15 -15
- package/dist/erisui.mjs +57 -61
- package/package.json +1 -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
|
|
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}
|
package/dist/erisui.js
CHANGED
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
<slot></slot>
|
|
44
44
|
<span id="initials"></span>
|
|
45
45
|
</div>
|
|
46
|
-
`}connectedCallback(){this.avatar=this.shadowRoot.querySelector(".avatar"),this.initials=this.shadowRoot.querySelector("#initials");const t=this.shadowRoot.querySelector("slot"),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>');
|
|
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=`
|
|
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",
|
|
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=`
|
|
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",
|
|
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=`
|
|
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",
|
|
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=`
|
|
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",
|
|
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=`
|
|
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",
|
|
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=`
|
|
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
|
|
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=`
|
|
455
455
|
<style>
|
|
456
456
|
:host {
|
|
457
457
|
position: fixed;
|
|
@@ -553,7 +553,7 @@
|
|
|
553
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
554
|
</div>
|
|
555
555
|
</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",
|
|
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
557
|
<style>
|
|
558
558
|
:host {
|
|
559
559
|
border-radius: 24px;
|
|
@@ -622,7 +622,7 @@
|
|
|
622
622
|
<p></p>
|
|
623
623
|
</div>
|
|
624
624
|
</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",
|
|
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
626
|
<style>
|
|
627
627
|
:host {
|
|
628
628
|
display: block;
|
|
@@ -705,7 +705,7 @@
|
|
|
705
705
|
<rect class="mark long"></rect>
|
|
706
706
|
</svg>
|
|
707
707
|
</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",
|
|
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
709
|
<style>
|
|
710
710
|
button, a {
|
|
711
711
|
display: flex;
|
|
@@ -811,7 +811,7 @@
|
|
|
811
811
|
<${i}>
|
|
812
812
|
<slot></slot>
|
|
813
813
|
</${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",
|
|
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
815
|
<style>
|
|
816
816
|
:host {
|
|
817
817
|
display: block;
|
|
@@ -869,7 +869,7 @@
|
|
|
869
869
|
<span class="anchor-hash">#</span>
|
|
870
870
|
</a>
|
|
871
871
|
`:""}
|
|
872
|
-
`}}customElements.define("eui-heading",
|
|
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,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'").replace(/`/g,"`").replace(/'/g,"'")}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
873
|
<style>
|
|
874
874
|
:host {
|
|
875
875
|
position: relative;
|
|
@@ -904,7 +904,7 @@
|
|
|
904
904
|
<pre class="${t?"g":""}"><code></code></pre>
|
|
905
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
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",
|
|
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=`
|
|
908
908
|
<style>
|
|
909
909
|
:host {
|
|
910
910
|
display: block;
|
|
@@ -996,7 +996,7 @@
|
|
|
996
996
|
<slot></slot>
|
|
997
997
|
</div>
|
|
998
998
|
</div>
|
|
999
|
-
`}}customElements.define("eui-app-titlebar",
|
|
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=`
|
|
1000
1000
|
<style>
|
|
1001
1001
|
:host {
|
|
1002
1002
|
display: block;
|
|
@@ -1057,4 +1057,4 @@
|
|
|
1057
1057
|
<div class="surface">
|
|
1058
1058
|
<slot></slot>
|
|
1059
1059
|
</div>
|
|
1060
|
-
`}}customElements.define("eui-surface",
|
|
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"})}));
|
package/dist/erisui.mjs
CHANGED
|
@@ -63,14 +63,14 @@ class C extends HTMLElement {
|
|
|
63
63
|
this.avatar.style.width = e + "px", this.avatar.style.height = e + "px", this.initials.style.fontSize = e / 2 + "px";
|
|
64
64
|
}
|
|
65
65
|
if (this.hasAttribute("border-radius") && (this.avatar.style.borderRadius = this.getAttribute("border-radius") + "px"), this.hasAttribute("name") && (this.avatar.title = this.getAttribute("name")), !i && this.hasAttribute("name")) {
|
|
66
|
-
const
|
|
67
|
-
let
|
|
68
|
-
|
|
66
|
+
const r = this.getAttribute("name").trim().split(/\s+/);
|
|
67
|
+
let n = "";
|
|
68
|
+
r.length === 1 ? n = r[0][0] || "" : n = (r[0][0] || "") + (r[r.length - 1][0] || ""), this.initials.textContent = n.toUpperCase();
|
|
69
69
|
}
|
|
70
70
|
}
|
|
71
71
|
}
|
|
72
72
|
customElements.define("eui-avatar", C);
|
|
73
|
-
const
|
|
73
|
+
const b = /* @__PURE__ */ (() => {
|
|
74
74
|
let o = {};
|
|
75
75
|
return {
|
|
76
76
|
register(t, i) {
|
|
@@ -81,13 +81,9 @@ const g = /* @__PURE__ */ (() => {
|
|
|
81
81
|
}
|
|
82
82
|
};
|
|
83
83
|
})();
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
const X = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
88
|
-
__proto__: null,
|
|
89
|
-
icon: g
|
|
90
|
-
}, Symbol.toStringTag, { value: "Module" }));
|
|
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>');
|
|
91
87
|
class S extends HTMLElement {
|
|
92
88
|
static get observedAttributes() {
|
|
93
89
|
return ["name", "width", "height"];
|
|
@@ -102,19 +98,19 @@ class S extends HTMLElement {
|
|
|
102
98
|
this.render();
|
|
103
99
|
}
|
|
104
100
|
render() {
|
|
105
|
-
const t = this.getAttribute("name"), i =
|
|
101
|
+
const t = this.getAttribute("name"), i = b.get(t);
|
|
106
102
|
if (!i) {
|
|
107
103
|
this.shadowRoot.innerHTML = '<span style="color:red;">?</span>';
|
|
108
104
|
return;
|
|
109
105
|
}
|
|
110
106
|
const e = document.createElement("template");
|
|
111
107
|
e.innerHTML = i.trim();
|
|
112
|
-
const
|
|
113
|
-
if (
|
|
108
|
+
const r = e.content.cloneNode(!0), n = r.firstElementChild;
|
|
109
|
+
if (n && n.style) {
|
|
114
110
|
const a = this.getAttribute("width"), l = this.getAttribute("height");
|
|
115
|
-
a &&
|
|
111
|
+
a && n.setAttribute("width", a), l && n.setAttribute("height", l), n.style.display = "block";
|
|
116
112
|
}
|
|
117
|
-
this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(
|
|
113
|
+
this.shadowRoot.innerHTML = "", this.shadowRoot.appendChild(r);
|
|
118
114
|
}
|
|
119
115
|
}
|
|
120
116
|
customElements.define("eui-icon", S);
|
|
@@ -386,7 +382,7 @@ const v = {
|
|
|
386
382
|
haptics: "vibrate" in navigator || "Vibrate" in window || typeof window.navigator.vibrate == "function"
|
|
387
383
|
},
|
|
388
384
|
userAgent: navigator.userAgent
|
|
389
|
-
},
|
|
385
|
+
}, X = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
390
386
|
__proto__: null,
|
|
391
387
|
device: v
|
|
392
388
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
@@ -402,7 +398,7 @@ function T() {
|
|
|
402
398
|
function x(o) {
|
|
403
399
|
v.supports.haptics ? navigator.vibrate(o || 50) : v.is.iPhone && T();
|
|
404
400
|
}
|
|
405
|
-
const
|
|
401
|
+
const W = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
406
402
|
__proto__: null,
|
|
407
403
|
haptic: x
|
|
408
404
|
}, Symbol.toStringTag, { value: "Module" })), w = (() => {
|
|
@@ -454,7 +450,7 @@ const J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
454
450
|
}
|
|
455
451
|
}
|
|
456
452
|
};
|
|
457
|
-
})(), y = w.settings,
|
|
453
|
+
})(), y = w.settings, J = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
458
454
|
__proto__: null,
|
|
459
455
|
settings: y,
|
|
460
456
|
storage: w
|
|
@@ -607,18 +603,18 @@ class $ extends HTMLElement {
|
|
|
607
603
|
</style>
|
|
608
604
|
<slot></slot>
|
|
609
605
|
`, this.addEventListener("pointerdown", (t) => {
|
|
610
|
-
const i = document.createElement("span"), e = t.currentTarget,
|
|
611
|
-
i.classList.add("ripple"), i.style.left = t.clientX - e.getBoundingClientRect().left -
|
|
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(() => {
|
|
612
608
|
i.remove();
|
|
613
609
|
}, 600);
|
|
614
610
|
});
|
|
615
611
|
}
|
|
616
612
|
}
|
|
617
613
|
customElements.define("eui-chip", $);
|
|
618
|
-
const
|
|
614
|
+
const g = "", k = (() => {
|
|
619
615
|
const o = [];
|
|
620
616
|
function t(s, d) {
|
|
621
|
-
const h = [], u = s.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${
|
|
617
|
+
const h = [], u = s.replace(/:([^/]+)/g, (m, f) => (h.push(f), "([^/]+)")).replace(/\//g, "\\/"), p = new RegExp(`^${g}${u}$`);
|
|
622
618
|
o.push({ regex: p, paramNames: h, renderFn: d });
|
|
623
619
|
}
|
|
624
620
|
function i(s) {
|
|
@@ -634,26 +630,26 @@ const b = "", k = (() => {
|
|
|
634
630
|
return null;
|
|
635
631
|
}
|
|
636
632
|
function e(s, d = !0) {
|
|
637
|
-
s.startsWith(
|
|
633
|
+
s.startsWith(g) || (s = g + (s.startsWith("/") ? "" : "/") + s);
|
|
638
634
|
const h = s.split(/[?#]/)[0];
|
|
639
635
|
if (h === window.location.pathname && s.includes("#")) {
|
|
640
636
|
d && history.pushState({}, "", s);
|
|
641
637
|
const p = "#" + s.split("#")[1];
|
|
642
|
-
|
|
638
|
+
r(p);
|
|
643
639
|
return;
|
|
644
640
|
}
|
|
645
641
|
const u = i(h);
|
|
646
642
|
if (u)
|
|
647
643
|
if (d && history.pushState({}, "", s), u.renderFn(u.params), window.dispatchEvent(new CustomEvent("route-changed", { detail: { path: s } })), s.includes("#")) {
|
|
648
644
|
const p = "#" + s.split("#")[1];
|
|
649
|
-
setTimeout(() =>
|
|
645
|
+
setTimeout(() => r(p), 100);
|
|
650
646
|
} else {
|
|
651
647
|
const p = document.getElementById("main");
|
|
652
648
|
p && p.scrollTo(0, 0);
|
|
653
649
|
}
|
|
654
|
-
else
|
|
650
|
+
else n ? (d && history.pushState({}, "", s), n()) : console.warn(`No route found for ${h}`);
|
|
655
651
|
}
|
|
656
|
-
function
|
|
652
|
+
function r(s) {
|
|
657
653
|
if (s)
|
|
658
654
|
try {
|
|
659
655
|
const d = document.querySelector(s);
|
|
@@ -662,15 +658,15 @@ const b = "", k = (() => {
|
|
|
662
658
|
console.warn("Invalid hash:", s);
|
|
663
659
|
}
|
|
664
660
|
}
|
|
665
|
-
let
|
|
661
|
+
let n = null;
|
|
666
662
|
function a(s) {
|
|
667
|
-
|
|
663
|
+
n = s;
|
|
668
664
|
}
|
|
669
665
|
function l() {
|
|
670
666
|
history.back();
|
|
671
667
|
}
|
|
672
668
|
function c() {
|
|
673
|
-
return window.location.pathname.replace(
|
|
669
|
+
return window.location.pathname.replace(g, "") || "/";
|
|
674
670
|
}
|
|
675
671
|
return window.addEventListener("popstate", () => {
|
|
676
672
|
const s = window.location.pathname + window.location.search + window.location.hash;
|
|
@@ -682,14 +678,14 @@ const b = "", k = (() => {
|
|
|
682
678
|
const h = d.getAttribute("href");
|
|
683
679
|
if (!(!h || h.startsWith("http") && !h.startsWith(window.location.origin))) {
|
|
684
680
|
if (s.preventDefault(), h.startsWith("#")) {
|
|
685
|
-
history.pushState({}, "", h),
|
|
681
|
+
history.pushState({}, "", h), r(h);
|
|
686
682
|
return;
|
|
687
683
|
}
|
|
688
684
|
e(h);
|
|
689
685
|
}
|
|
690
686
|
}), { add: t, navigate: e, back: l, location: c, setNotFound: a };
|
|
691
687
|
})();
|
|
692
|
-
async function
|
|
688
|
+
async function V(o) {
|
|
693
689
|
try {
|
|
694
690
|
const t = document.getElementById("main");
|
|
695
691
|
t.classList.add("fade-out"), await new Promise((e) => setTimeout(e, 200));
|
|
@@ -733,20 +729,20 @@ class H extends HTMLElement {
|
|
|
733
729
|
};
|
|
734
730
|
setupEventListeners() {
|
|
735
731
|
this.addEventListener("pointerdown", (t) => {
|
|
736
|
-
const i = document.createElement("span"), e = t.currentTarget,
|
|
737
|
-
i.classList.add("ripple"), i.style.width = `${
|
|
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", () => {
|
|
738
734
|
i.remove();
|
|
739
735
|
});
|
|
740
736
|
});
|
|
741
737
|
}
|
|
742
738
|
updateContent() {
|
|
743
|
-
const t = this.getAttribute("icon"), i = this.getAttribute("avatar-src"), e = this.getAttribute("avatar-name"),
|
|
744
|
-
if (
|
|
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)
|
|
745
741
|
if (a)
|
|
746
|
-
a.textContent =
|
|
742
|
+
a.textContent = n;
|
|
747
743
|
else {
|
|
748
744
|
const s = document.createElement("span");
|
|
749
|
-
s.className = "badge", s.textContent =
|
|
745
|
+
s.className = "badge", s.textContent = n, this.shadowRoot.appendChild(s);
|
|
750
746
|
}
|
|
751
747
|
else a && a.remove();
|
|
752
748
|
const l = this.shadowRoot.querySelector("slot[name='icon']");
|
|
@@ -759,7 +755,7 @@ class H extends HTMLElement {
|
|
|
759
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 = "";
|
|
760
756
|
}
|
|
761
757
|
const c = this.shadowRoot.querySelector(".label");
|
|
762
|
-
c && (c.textContent =
|
|
758
|
+
c && (c.textContent = r);
|
|
763
759
|
}
|
|
764
760
|
render() {
|
|
765
761
|
this.shadowRoot.innerHTML = `
|
|
@@ -1081,8 +1077,8 @@ class I extends HTMLElement {
|
|
|
1081
1077
|
this.hd = this.shadowRoot.querySelector(".header"), this.hasAttribute("type") && this.hd.classList.add(this.getAttribute("type"));
|
|
1082
1078
|
}
|
|
1083
1079
|
attributeChangedCallback(t, i, e) {
|
|
1084
|
-
const
|
|
1085
|
-
t === "title" && (
|
|
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})` : "");
|
|
1086
1082
|
}
|
|
1087
1083
|
}
|
|
1088
1084
|
customElements.define("eui-header", I);
|
|
@@ -1317,10 +1313,10 @@ class q extends HTMLElement {
|
|
|
1317
1313
|
</${i}>
|
|
1318
1314
|
`;
|
|
1319
1315
|
const e = this.shadowRoot.querySelector(i);
|
|
1320
|
-
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", (
|
|
1321
|
-
const
|
|
1322
|
-
|
|
1323
|
-
|
|
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", () => {
|
|
1319
|
+
n.remove();
|
|
1324
1320
|
});
|
|
1325
1321
|
});
|
|
1326
1322
|
}
|
|
@@ -1400,12 +1396,12 @@ class j extends HTMLElement {
|
|
|
1400
1396
|
}
|
|
1401
1397
|
customElements.define("eui-heading", j);
|
|
1402
1398
|
function N(o) {
|
|
1403
|
-
const e = Date.now() - o,
|
|
1404
|
-
return s > 0 ? `${s}y` : c > 0 ? `${c}mo` : l > 0 ? `${l}d` : a > 0 ? `${a}h` :
|
|
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`;
|
|
1405
1401
|
}
|
|
1406
1402
|
function B(o) {
|
|
1407
|
-
const e = Date.now() - o,
|
|
1408
|
-
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` :
|
|
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`;
|
|
1409
1405
|
}
|
|
1410
1406
|
function O(o) {
|
|
1411
1407
|
return o.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'").replace(/`/g, "`").replace(/'/g, "'");
|
|
@@ -1414,7 +1410,7 @@ function E(o) {
|
|
|
1414
1410
|
const t = document.createElement("input");
|
|
1415
1411
|
t.value = o, document.body.appendChild(t), t.select(), document.execCommand("copy"), document.body.removeChild(t);
|
|
1416
1412
|
}
|
|
1417
|
-
const
|
|
1413
|
+
const Y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1418
1414
|
__proto__: null,
|
|
1419
1415
|
copystr: E,
|
|
1420
1416
|
joinedAgo: B,
|
|
@@ -1472,8 +1468,8 @@ class P extends HTMLElement {
|
|
|
1472
1468
|
let t = this.textContent || "";
|
|
1473
1469
|
t = t.replace(/^\s*\n/, "").replace(/\n\s*$/, ""), t = t.replace(/[ \t]+$/gm, "");
|
|
1474
1470
|
const i = t.split(`
|
|
1475
|
-
`), e = i.filter((
|
|
1476
|
-
return t = i.map((
|
|
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(`
|
|
1477
1473
|
`), t;
|
|
1478
1474
|
}
|
|
1479
1475
|
_onCopy() {
|
|
@@ -1618,8 +1614,8 @@ class D extends HTMLElement {
|
|
|
1618
1614
|
this.removeEventListener("mousedown", this._handleMouseDown), this.hasAttribute("ripple") && this.addEventListener("mousedown", this._handleMouseDown);
|
|
1619
1615
|
}
|
|
1620
1616
|
_addRipple(t) {
|
|
1621
|
-
const i = this.getBoundingClientRect(), e = document.createElement("span"),
|
|
1622
|
-
e.style.width = e.style.height = `${
|
|
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", () => {
|
|
1623
1619
|
e.remove();
|
|
1624
1620
|
});
|
|
1625
1621
|
}
|
|
@@ -1691,11 +1687,11 @@ class D extends HTMLElement {
|
|
|
1691
1687
|
customElements.define("eui-surface", D);
|
|
1692
1688
|
typeof window < "u" && console.log("ErisUI loaded successfully");
|
|
1693
1689
|
export {
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1690
|
+
X as device,
|
|
1691
|
+
W as haptics,
|
|
1692
|
+
b as icons,
|
|
1693
|
+
V as loadPage,
|
|
1698
1694
|
k as router,
|
|
1699
|
-
|
|
1700
|
-
|
|
1695
|
+
J as storage,
|
|
1696
|
+
Y as utils
|
|
1701
1697
|
};
|