@3r1s_s/erisui 1.0.21 → 1.0.22
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.js +25 -8
- package/dist/erisui.mjs +22 -5
- package/package.json +1 -1
package/dist/erisui.js
CHANGED
|
@@ -188,7 +188,7 @@
|
|
|
188
188
|
<span class="loader animate">
|
|
189
189
|
<svg viewBox="0 0 16 16"><circle class="loader-icon" cx="8px" cy="8px" r="7px"></circle></svg>
|
|
190
190
|
</span>
|
|
191
|
-
`}}customElements.define("eui-loader",S);class
|
|
191
|
+
`}}customElements.define("eui-loader",S);class z 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)}set intermediate(t){t?this.setAttribute("intermediate",""):this.removeAttribute("intermediate")}set id(t){this.setAttribute("id",t)}get intermediate(){return this.hasAttribute("intermediate")}get value(){return this.getAttribute("value")}attributeChangedCallback(){this.connectedCallback()}connectedCallback(){const t=this.shadowRoot.querySelector(".progress");this.hasAttribute("id")&&(t.id=this.getAttribute("id")),this.hasAttribute("intermediate")?t.classList.add("intermediate"):t.classList.remove("intermediate"),this.hasAttribute("value")&&(t.style.width=this.getAttribute("value")+"%")}}customElements.define("eui-progressbar",
|
|
235
|
+
`}set value(t){this.setAttribute("value",t)}set intermediate(t){t?this.setAttribute("intermediate",""):this.removeAttribute("intermediate")}set id(t){this.setAttribute("id",t)}get intermediate(){return this.hasAttribute("intermediate")}get value(){return this.getAttribute("value")}attributeChangedCallback(){this.connectedCallback()}connectedCallback(){const t=this.shadowRoot.querySelector(".progress");this.hasAttribute("id")&&(t.id=this.getAttribute("id")),this.hasAttribute("intermediate")?t.classList.add("intermediate"):t.classList.remove("intermediate"),this.hasAttribute("value")&&(t.style.width=this.getAttribute("value")+"%")}}customElements.define("eui-progressbar",z);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},T=Object.freeze(Object.defineProperty({__proto__:null,device:v},Symbol.toStringTag,{value:"Module"}));function M(){try{const s=document.createElement("label");s.ariaHidden="true",s.style.display="none";const t=document.createElement("input");t.type="checkbox",t.setAttribute("switch",""),s.appendChild(t),document.head.appendChild(s),s.click(),document.head.removeChild(s)}catch{}}function x(s){v.supports.haptics?navigator.vibrate(s||50):v.is.iPhone&&M()}const $=Object.freeze(Object.defineProperty({__proto__:null,haptic:x},Symbol.toStringTag,{value:"Module"})),C=(()=>{let s={},t;try{s=JSON.parse(localStorage.getItem(t)||"{}")}catch(i){console.error(i)}return{get(i){return s[i]},set(i,e){s[i]=e,localStorage.setItem(t,JSON.stringify(s))},delete(i){delete s[i],localStorage.setItem(t,JSON.stringify(s))},all(){return s},clear(){s={},localStorage.setItem(t,JSON.stringify(s))},name(i){t=i;try{s=JSON.parse(localStorage.getItem(t)||"{}")}catch(e){console.error(e)}},settings:{get(i){return s&&s.settings&&s.settings[i]},set(i,e){s.settings||(s.settings={}),s.settings[i]=e,localStorage.setItem(t,JSON.stringify(s))},delete(i){s.settings&&(delete s.settings[i],localStorage.setItem(t,JSON.stringify(s)))},all(){return s.settings||{}},clear(){s.settings&&(s.settings={},localStorage.setItem(t,JSON.stringify(s)))}}}})(),R=C.settings,H=Object.freeze(Object.defineProperty({__proto__:null,settings:R,storage:C},Symbol.toStringTag,{value:"Module"}));class _ extends HTMLElement{static get observedAttributes(){return["selected"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
|
|
236
236
|
<style>
|
|
237
237
|
.switch {
|
|
238
238
|
background-color: var(--app-200);
|
|
@@ -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,a=Math.max(e.offsetWidth,e.offsetHeight);i.classList.add("ripple"),i.style.left=t.clientX-e.getBoundingClientRect().left-a/2+"px",i.style.top=t.clientY-e.getBoundingClientRect().top-a/2+"px",i.style.width=a+"px",i.style.height=a+"px",this.shadowRoot.appendChild(i),setTimeout(()=>{i.remove()},600)})}}customElements.define("eui-chip",F);const f="",w=(()=>{const s=[];function t(n,d){const h=[],b=n.replace(/:([^/]+)/g,(y,k)=>(h.push(k),"([^/]+)")).replace(/\//g,"\\/"),g=new RegExp(`^${f}${b}$`);s.push({regex:g,paramNames:h,renderFn:d})}function i(n){for(const{regex:d,paramNames:h,renderFn:b}of s){const g=n.match(d);if(g){const y={};return h.forEach((k,
|
|
349
|
+
`,this.addEventListener("pointerdown",t=>{const i=document.createElement("span"),e=t.currentTarget,a=Math.max(e.offsetWidth,e.offsetHeight);i.classList.add("ripple"),i.style.left=t.clientX-e.getBoundingClientRect().left-a/2+"px",i.style.top=t.clientY-e.getBoundingClientRect().top-a/2+"px",i.style.width=a+"px",i.style.height=a+"px",this.shadowRoot.appendChild(i),setTimeout(()=>{i.remove()},600)})}}customElements.define("eui-chip",F);const f="",w=(()=>{const s=[];function t(n,d){const h=[],b=n.replace(/:([^/]+)/g,(y,k)=>(h.push(k),"([^/]+)")).replace(/\//g,"\\/"),g=new RegExp(`^${f}${b}$`);s.push({regex:g,paramNames:h,renderFn:d})}function i(n){for(const{regex:d,paramNames:h,renderFn:b}of s){const g=n.match(d);if(g){const y={};return h.forEach((k,K)=>{y[k]=decodeURIComponent(g[K+1])}),{renderFn:b,params:y}}}return null}function e(n,d=!0){n.startsWith(f)||(n=f+(n.startsWith("/")?"":"/")+n);const h=n.split(/[?#]/)[0];if(h===window.location.pathname&&n.includes("#")){d&&history.pushState({},"",n);const g="#"+n.split("#")[1];a(g);return}const b=i(h);if(b)if(d&&history.pushState({},"",n),b.renderFn(b.params),window.dispatchEvent(new CustomEvent("route-changed",{detail:{path:n}})),n.includes("#")){const g="#"+n.split("#")[1];setTimeout(()=>a(g),100)}else{const g=document.getElementById("main");g&&g.scrollTo(0,0)}else o?(d&&history.pushState({},"",n),o()):console.warn(`No route found for ${h}`)}function a(n){if(n)try{const d=document.querySelector(n);d&&d.scrollIntoView({behavior:"smooth"})}catch{console.warn("Invalid hash:",n)}}let o=null;function r(n){o=n}function l(){history.back()}function c(){return window.location.pathname.replace(f,"")||"/"}return window.addEventListener("popstate",()=>{const n=window.location.pathname+window.location.search+window.location.hash;e(n,!1)}),window.addEventListener("click",n=>{if(n.button!==0||n.metaKey||n.altKey||n.ctrlKey||n.shiftKey)return;const d=n.target.closest("a");if(!d||d.hasAttribute("download")||d.getAttribute("target")==="_blank")return;const h=d.getAttribute("href");if(!(!h||h.startsWith("http")&&!h.startsWith(window.location.origin))){if(n.preventDefault(),h.startsWith("#")){history.pushState({},"",h),a(h);return}e(h)}}),{add:t,navigate:e,back:l,location:c,setNotFound:r}})();async function I(s){try{const t=document.getElementById("main");t.classList.add("fade-out"),await new Promise(e=>setTimeout(e,200));const i=await fetch(`/src/pages/${s}.html`).then(e=>e.text());t.innerHTML=i,t.classList.remove("fade-out"),t.classList.add("fade-in"),window.location.hash?setTimeout(()=>{try{const e=document.querySelector(window.location.hash);e&&e.scrollIntoView({behavior:"smooth"})}catch{}},100):t&&t.scrollTo(0,0),setTimeout(()=>{t.classList.remove("fade-in")},200)}catch(t){console.error("Page load failed:",t)}}class j extends HTMLElement{static get observedAttributes(){return["path","icon","label","badge","active","avatar-src","avatar-name"]}constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.hasRendered||(this.render(),this.setupEventListeners(),this.hasRendered=!0),this.updateContent(),this.addEventListener("click",this.handleClick)}disconnectedCallback(){this.removeEventListener("click",this.handleClick)}attributeChangedCallback(t,i,e){if(i!==e&&this.hasRendered){if(t==="active")return;this.updateContent()}}handleClick=()=>{const t=this.getAttribute("path");t&&w.navigate(t)};setupEventListeners(){this.addEventListener("pointerdown",t=>{const i=document.createElement("span"),e=t.currentTarget,a=e.getBoundingClientRect(),o=Math.max(e.offsetWidth,e.offsetHeight),r=o/2;i.classList.add("ripple"),i.style.width=`${o}px`,i.style.height=`${o}px`,i.style.left=`${t.clientX-a.left-r}px`,i.style.top=`${t.clientY-a.top-r}px`,this.shadowRoot.appendChild(i),i.addEventListener("animationend",()=>{i.remove()})})}updateContent(){const t=this.getAttribute("icon"),i=this.getAttribute("avatar-src"),e=this.getAttribute("avatar-name"),a=this.getAttribute("label")||"",o=this.getAttribute("badge"),r=this.shadowRoot.querySelector(".badge");if(o)if(r)r.textContent=o;else{const n=document.createElement("span");n.className="badge",n.textContent=o,this.shadowRoot.appendChild(n)}else r&&r.remove();const l=this.shadowRoot.querySelector("slot[name='icon']");if(l)if(i||e){let n='<eui-avatar size="24"';e&&(n+=` name="${e}"`),n+=">",i&&(n+=`<img src="${i}" alt="${e||"Avatar"}" />`),n+="</eui-avatar>",l.innerHTML=n}else{const n=l.querySelector("eui-icon");t&&n?n.getAttribute("name")!==t&&n.setAttribute("name",t):t?l.innerHTML=`<eui-icon width="24" height="24" name="${t}"></eui-icon>`:l.innerHTML=""}const c=this.shadowRoot.querySelector(".label");c&&(c.textContent=a)}render(){this.shadowRoot.innerHTML=`
|
|
350
350
|
<style>
|
|
351
351
|
:host {
|
|
352
352
|
position: relative;
|
|
@@ -1095,7 +1095,7 @@
|
|
|
1095
1095
|
<div class="surface">
|
|
1096
1096
|
<slot></slot>
|
|
1097
1097
|
</div>
|
|
1098
|
-
`}}customElements.define("eui-surface",J);class
|
|
1098
|
+
`}}customElements.define("eui-surface",J);class Y extends HTMLElement{static get observedAttributes(){return["value","min","max","step","label"]}constructor(){super(),this.attachShadow({mode:"open"}),this.shadowRoot.innerHTML=`
|
|
1099
1099
|
<style>
|
|
1100
1100
|
:host {
|
|
1101
1101
|
display: flex;
|
|
@@ -1128,9 +1128,8 @@
|
|
|
1128
1128
|
appearance: none;
|
|
1129
1129
|
opacity: 0;
|
|
1130
1130
|
width: 100%;
|
|
1131
|
-
height:
|
|
1132
|
-
background:
|
|
1133
|
-
border-radius: 3px;
|
|
1131
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1132
|
+
background: transparent;
|
|
1134
1133
|
outline: none;
|
|
1135
1134
|
margin: 0;
|
|
1136
1135
|
cursor: pointer;
|
|
@@ -1138,6 +1137,22 @@
|
|
|
1138
1137
|
z-index: 1;
|
|
1139
1138
|
}
|
|
1140
1139
|
|
|
1140
|
+
input[type="range"]::-webkit-slider-thumb {
|
|
1141
|
+
-webkit-appearance: none;
|
|
1142
|
+
appearance: none;
|
|
1143
|
+
width: 20px;
|
|
1144
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1145
|
+
cursor: pointer;
|
|
1146
|
+
}
|
|
1147
|
+
|
|
1148
|
+
input[type="range"]::-moz-range-thumb {
|
|
1149
|
+
width: 20px;
|
|
1150
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1151
|
+
cursor: pointer;
|
|
1152
|
+
border: none;
|
|
1153
|
+
background: transparent;
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1141
1156
|
.track {
|
|
1142
1157
|
position: absolute;
|
|
1143
1158
|
height: 4px;
|
|
@@ -1168,6 +1183,8 @@
|
|
|
1168
1183
|
pointer-events: none;
|
|
1169
1184
|
z-index: 0;
|
|
1170
1185
|
left: 0;
|
|
1186
|
+
top: 50%;
|
|
1187
|
+
transform: translateY(-50%);
|
|
1171
1188
|
}
|
|
1172
1189
|
|
|
1173
1190
|
.slider-thumb.active {
|
|
@@ -1190,4 +1207,4 @@
|
|
|
1190
1207
|
<div class="slider-thumb"></div>
|
|
1191
1208
|
<input type="range">
|
|
1192
1209
|
</div>
|
|
1193
|
-
`}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.labelEl=this.shadowRoot.querySelector(".label"),this.valueEl=this.shadowRoot.querySelector(".value-badge"),this.trackFillEl=this.shadowRoot.querySelector(".track-fill"),this.sliderThumbEl=this.shadowRoot.querySelector(".slider-thumb"),this.inputEl.min=this.getAttribute("min")||0,this.inputEl.max=this.getAttribute("max")||100,this.inputEl.step=this.getAttribute("step")||1,this.inputEl.value=this.getAttribute("value")||50,this.hasAttribute("label")&&(this.labelEl.textContent=this.getAttribute("label")),this.updateUI(),this.inputEl.addEventListener("input",()=>{this.updateValue(this.inputEl.value),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("change",()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("mousedown",()=>this.sliderThumbEl.classList.add("active")),this.inputEl.addEventListener("touchstart",()=>this.sliderThumbEl.classList.add("active"),{passive:!0}),window.addEventListener("mouseup",()=>this.sliderThumbEl.classList.remove("active")),window.addEventListener("touchend",()=>this.sliderThumbEl.classList.remove("active"))}updateValue(t){this.setAttribute("value",t),this.updateUI()}updateUI(){if(!this.inputEl)return;const t=parseFloat(this.inputEl.min),i=parseFloat(this.inputEl.max),e=parseFloat(this.inputEl.value),a=(e-t)/(i-t)*100;this.trackFillEl.style.width=`${a}%`,this.sliderThumbEl.style.left=`calc(${a}% - ${a/100*20}px)`,this.valueEl.textContent=e}attributeChangedCallback(t,i,e){this.inputEl&&(t==="value"&&e!==this.inputEl.value?(this.inputEl.value=e,this.updateUI()):["min","max","step"].includes(t)?(this.inputEl[t]=e,this.updateUI()):t==="label"&&(this.labelEl.textContent=e))}get value(){return parseFloat(this.inputEl.value)}set value(t){this.setAttribute("value",t)}}customElements.define("eui-slider",
|
|
1210
|
+
`}connectedCallback(){this.inputEl=this.shadowRoot.querySelector("input"),this.labelEl=this.shadowRoot.querySelector(".label"),this.valueEl=this.shadowRoot.querySelector(".value-badge"),this.trackFillEl=this.shadowRoot.querySelector(".track-fill"),this.sliderThumbEl=this.shadowRoot.querySelector(".slider-thumb"),this.inputEl.min=this.getAttribute("min")||0,this.inputEl.max=this.getAttribute("max")||100,this.inputEl.step=this.getAttribute("step")||1,this.inputEl.value=this.getAttribute("value")||50,this.hasAttribute("label")&&(this.labelEl.textContent=this.getAttribute("label")),this.updateUI(),this.inputEl.addEventListener("input",()=>{this.updateValue(this.inputEl.value),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("change",()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}),this.inputEl.addEventListener("mousedown",()=>this.sliderThumbEl.classList.add("active")),this.inputEl.addEventListener("touchstart",()=>this.sliderThumbEl.classList.add("active"),{passive:!0}),window.addEventListener("mouseup",()=>this.sliderThumbEl.classList.remove("active")),window.addEventListener("touchend",()=>this.sliderThumbEl.classList.remove("active"))}updateValue(t){this.setAttribute("value",t),this.updateUI()}updateUI(){if(!this.inputEl)return;const t=parseFloat(this.inputEl.min),i=parseFloat(this.inputEl.max),e=parseFloat(this.inputEl.value),a=(e-t)/(i-t)*100;this.trackFillEl.style.width=`${a}%`,this.sliderThumbEl.style.left=`calc(${a}% - ${a/100*20}px)`,this.valueEl.textContent=e}attributeChangedCallback(t,i,e){this.inputEl&&(t==="value"&&e!==this.inputEl.value?(this.inputEl.value=e,this.updateUI()):["min","max","step"].includes(t)?(this.inputEl[t]=e,this.updateUI()):t==="label"&&(this.labelEl.textContent=e))}get value(){return parseFloat(this.inputEl.value)}set value(t){this.setAttribute("value",t)}}customElements.define("eui-slider",Y),typeof window<"u"&&console.log("ErisUI loaded successfully"),p.device=T,p.haptics=$,p.icons=u,p.loadPage=I,p.router=w,p.storage=H,p.utils=Z,Object.defineProperty(p,Symbol.toStringTag,{value:"Module"})}));
|
package/dist/erisui.mjs
CHANGED
|
@@ -1447,7 +1447,7 @@ function k(s) {
|
|
|
1447
1447
|
const t = document.createElement("input");
|
|
1448
1448
|
t.value = s, document.body.appendChild(t), t.select(), document.execCommand("copy"), document.body.removeChild(t);
|
|
1449
1449
|
}
|
|
1450
|
-
const
|
|
1450
|
+
const Y = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1451
1451
|
__proto__: null,
|
|
1452
1452
|
copystr: k,
|
|
1453
1453
|
joinedAgo: N,
|
|
@@ -1805,9 +1805,8 @@ class D extends HTMLElement {
|
|
|
1805
1805
|
appearance: none;
|
|
1806
1806
|
opacity: 0;
|
|
1807
1807
|
width: 100%;
|
|
1808
|
-
height:
|
|
1809
|
-
background:
|
|
1810
|
-
border-radius: 3px;
|
|
1808
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1809
|
+
background: transparent;
|
|
1811
1810
|
outline: none;
|
|
1812
1811
|
margin: 0;
|
|
1813
1812
|
cursor: pointer;
|
|
@@ -1815,6 +1814,22 @@ class D extends HTMLElement {
|
|
|
1815
1814
|
z-index: 1;
|
|
1816
1815
|
}
|
|
1817
1816
|
|
|
1817
|
+
input[type="range"]::-webkit-slider-thumb {
|
|
1818
|
+
-webkit-appearance: none;
|
|
1819
|
+
appearance: none;
|
|
1820
|
+
width: 20px;
|
|
1821
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1822
|
+
cursor: pointer;
|
|
1823
|
+
}
|
|
1824
|
+
|
|
1825
|
+
input[type="range"]::-moz-range-thumb {
|
|
1826
|
+
width: 20px;
|
|
1827
|
+
height: var(--eui-slider-touch-target-size, 44px);
|
|
1828
|
+
cursor: pointer;
|
|
1829
|
+
border: none;
|
|
1830
|
+
background: transparent;
|
|
1831
|
+
}
|
|
1832
|
+
|
|
1818
1833
|
.track {
|
|
1819
1834
|
position: absolute;
|
|
1820
1835
|
height: 4px;
|
|
@@ -1845,6 +1860,8 @@ class D extends HTMLElement {
|
|
|
1845
1860
|
pointer-events: none;
|
|
1846
1861
|
z-index: 0;
|
|
1847
1862
|
left: 0;
|
|
1863
|
+
top: 50%;
|
|
1864
|
+
transform: translateY(-50%);
|
|
1848
1865
|
}
|
|
1849
1866
|
|
|
1850
1867
|
.slider-thumb.active {
|
|
@@ -1903,5 +1920,5 @@ export {
|
|
|
1903
1920
|
J as loadPage,
|
|
1904
1921
|
y as router,
|
|
1905
1922
|
W as storage,
|
|
1906
|
-
|
|
1923
|
+
Y as utils
|
|
1907
1924
|
};
|