@pixelium/web-vue 0.0.1-beta

package/dist/pixelium-vue.cjs

@@ -0,0 +1 @@
+"use strict";var We=Object.defineProperty;var je=(t,e,o)=>e in t?We(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o;var ee=(t,e,o)=>je(t,typeof e!="symbol"?e+"":e,o);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),ue=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M23 9v6h-1v2h-3v-2h1V9h-1V7h-1V6h-1V5h-2V4h-2V3h-1V1h3v1h2v1h2v1h1v1h1v2h1v2z"},null,-1)])],4))}});function qe(t,e,o,n){let s=Math.atan2(e,t);return s<0&&(s+=Math.PI*2),s>=o&&s<=n}function Xe(t,e,o,n,s,a,u,l){const c=[[e,o],[-e,o],[e,-o],[-e,-o],[o,e],[-o,e],[o,-e],[-o,-e]];for(const[i,v]of c)qe(i,v,a,u)&&t.fillRect(n+i,s+v,l,l)}function Z(t,e,o,n,s=0,a=Math.PI*2,u){let l=0,c=n,i=3-2*n;for(;l<=c+u;)Xe(t,l,c,e,o,s,a,u),l+=u,i>0?(c-=u,i+=4*(l-c)+10):i+=4*l+6}function Qe(t,e,o,n){const s=t.getImageData(0,0,t.canvas.width,t.canvas.height),a=s.data,u=(o*t.canvas.width+e)*4,l=a[u],c=a[u+1],i=a[u+2],v=a[u+3];if(!(l===0&&c===0&&i===0&&v===0)||n.r===0&&n.g===0&&n.b===0&&n.a===0)return;const m=[[e,o]];for(;m.length;){const d=m.pop();if(!d)continue;const[f,_]=d,h=(_*t.canvas.width+f)*4;f<0||f>=t.canvas.width||_<0||_>=t.canvas.height||a[h]!==l||a[h+1]!==c||a[h+2]!==i||a[h+3]!==v||(a[h]=n.r,a[h+1]=n.g,a[h+2]=n.b,a[h+3]=n.a,m.push([f+1,_]),m.push([f-1,_]),m.push([f,_+1]),m.push([f,_-1]))}t.putImageData(s,0,0)}const I={r:0,g:0,b:0,a:0},le=3e3;var G=(t=>(t.XS="xs",t.SM="sm",t.MD="md",t.LG="lg",t.XL="xl",t.XXL="xxl",t))(G||{});const A=()=>typeof window<"u";function be(t){if(!Number.isInteger(t)||t<=0)throw new RangeError("max must be a positive integer");const e=new Map;return{get(o){const n=e.get(o);if(n!==void 0)return e.delete(o),e.set(o,n),n},set(o,n){e.has(o)?e.delete(o):e.size>=t&&e.delete(e.keys().next().value),e.set(o,n)},delete(o){return e.delete(o)},clear(){e.clear()},has(o){return e.has(o)},get size(){return e.size}}}const ve=be(120);function J(t){const e=ve.get(t);if(e)return{...e};let o={r:0,g:0,b:0,a:255};if(t.startsWith("rgb(")||t.startsWith("rgba(")){const n=t.match(/rgba?\(\s*(\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)/i);n&&(o.r=parseInt(n[1],10),o.g=parseInt(n[2],10),o.b=parseInt(n[3],10),n[4]&&(o.a=Math.round(parseFloat(n[4])*255)))}else t.startsWith("#")&&(t=t.slice(1),t.length===3?(o.r=parseInt(t[0]+t[0],16),o.g=parseInt(t[1]+t[1],16),o.b=parseInt(t[2]+t[2],16)):t.length===4?(o.r=parseInt(t[0]+t[0],16),o.g=parseInt(t[1]+t[1],16),o.b=parseInt(t[2]+t[2],16),o.a=parseInt(t[3]+t[3],16)):t.length===6?(o.r=parseInt(t.slice(0,2),16),o.g=parseInt(t.slice(2,4),16),o.b=parseInt(t.slice(4,6),16)):t.length===8&&(o.r=parseInt(t.slice(0,2),16),o.g=parseInt(t.slice(2,4),16),o.b=parseInt(t.slice(4,6),16),o.a=parseInt(t.slice(6,8),16)));return ve.set(t,o),{...o}}const p=(t,e)=>A()?J(getComputedStyle(document.documentElement).getPropertyValue(`--px-${t}-${e}`)):I;function te(t){return t<=.04045?t/12.92:Math.pow((t+.055)/1.055,2.4)}function Je(t,e,o,n=255){const s=t/255,a=e/255,u=o/255,l=te(s),c=te(a),i=te(u);let v=l*.41239079926595934+c*.357584339383878+i*.1804807884018343,m=l*.21263900587151027+c*.715168678767756+i*.07219231536073371,d=l*.01933081871559182+c*.11919477979462598+i*.9505321522496607,f=.819022437996703*v+.3619062600528904*m-.1288737815209879*d,_=.0329836539323885*v+.9292868615863434*m+.0361446663506424*d,h=.0481771893596242*v+.2642395317527308*m+.6335478284694309*d;f=Math.cbrt(f),_=Math.cbrt(_),h=Math.cbrt(h);const M=.210454268309314*f+.7936177747023054*_-.0040720430116193*h,L=1.9779985324311684*f-2.42859224204858*_+.450593709617411*h,k=.0259040424655478*f+.7827717124575296*_-.8086757549230774*h,y=Math.sqrt(L*L+k*k);let w=Math.atan2(k,L)*180/Math.PI;return w<0&&(w+=360),{l:M,c:y,h:w,a:n}}function ne(t){return t<=.0031308?12.92*t:1.055*Math.pow(t,1/2.4)-.055}function z(t,e,o,n=255){const s=o*Math.PI/180,a=e*Math.cos(s),u=e*Math.sin(s);let l=t+.3963377773761749*a+.2158037573099136*u,c=t-.1055613458156586*a-.0638541728258133*u,i=t-.0894841775298119*a-1.2914855480194092*u;l=l*l*l,c=c*c*c,i=i*i*i;const v=1.2268798758459243*l-.5578149944602171*c+.2813910456659647*i,m=-.0405757452148008*l+1.112286803280317*c-.0717110580655164*i,d=-.0763729366746601*l-.4214933324022432*c+1.5869240198367816*i,f=3.2409699419045226*v-1.537383177570094*m-.4986107602930034*d,_=-.9692436362808796*v+1.8759675015077202*m+.04155505740717559*d,h=.05563007969699366*v-.20397695888897652*m+1.0569715142428786*d,M=ne(f),L=ne(_),k=ne(h);return{r:Math.round(M*255),g:Math.round(L*255),b:Math.round(k*255),a:n}}function Ke(t,e,o){const{r:n,g:s,b:a}=z(e,t,o);return n>=0&&n<=255&&s>=0&&s<=255&&a>=0&&a<=255}function re(t,e){let n=0,s=2;for(;s-n>1e-6;){const a=(n+s)/2;Ke(a,t,e)?n=a:s=a}return n}const he=be(60);function X(t,e,o,n=255,s=!1){const a=`${t},${e},${o},${n},${s}`,u=he.get(a);if(u)return u;const l=Je(t,e,o,n);let c=[];const i=l.c<.049?0:.049,v=s?Math.min(Math.max(l.l,.05),.85):Math.min(Math.max(l.l,.15),.95),m=Math.min(Math.max(l.c,i),re(v,l.h)),d=Math.min(v+.35,s?.85:.9),f=Math.max(v-.35,s?.1:.15),_=s?(v-f)/4:(d-v)/4,h=(m-i)/4,M=s?(d-v)/3:(v-f)/3,L=(m-i)/3;for(let k=0;k<5;k++){const y=v+(s?-1:1)*_*(5-k),w=Math.min(m-h*(5-k),re(y,l.h)),N=l.h,C=z(y,w,N,n);c.push(C)}c.push(z(v,m,l.h,n));for(let k=0;k<4;k++){const y=v-(s?-1:1)*M*(k+1),w=Math.min(m-L*(k+1),re(y,l.h)),N=l.h,C=z(y,w,N,n);c.push(C)}return he.set(a,c),c}const V=t=>`rgba(${t.r}, ${t.g}, ${t.b}, ${+(t.a/255)})`,ce=r.defineComponent({name:"ButtonGroup",__name:"index",props:{borderRadius:null,shape:{default:"default"},size:{default:"medium"},disabled:{type:Boolean,default:!1},loading:{type:Boolean},variant:{default:"primary"}},setup(t){const e=t;r.provide("px-button-group-props",e);const o=r.ref(null),n=()=>{r.nextTick(()=>{o.value&&o.value.querySelectorAll("[data-px-button]").forEach(s=>s.dispatchEvent(new CustomEvent("slot-changed")))})};if(A()){const s=new MutationObserver(n);r.onMounted(()=>{r.nextTick(()=>{o.value&&s.observe(o.value,{childList:!0})}),n()}),r.onBeforeUnmount(()=>{s.disconnect()})}return(s,a)=>(r.openBlock(),r.createElementBlock("div",{class:"pixelium px-button-group",ref_key:"slotWrapper",ref:o},[r.renderSlot(s.$slots,"default")],512))}}),Ye=new RegExp("[-_\\s]|(?<=[a-z])(?=[A-Z])|(?<=[A-Z])(?=[A-Z][a-z])|(\\d+)");function Ze(t){return t.split(Ye).filter(Boolean)}function ze(t){const e=Ze(t);let o="";const n=e.length;for(let s=0;s<n;s++)o+=e[s].toLowerCase()+(s<n-1?"-":"");return o}function we(t){return typeof t=="function"}function K(t){return typeof t=="string"||t instanceof String}function H(t){return typeof t=="number"||t instanceof Number}function ie(t){return Array.isArray(t)}function D(t){return t==null}function ke(...t){return t.reduce((e,o)=>{if(D(o))return e;const n=Object.keys(o);for(const s of n){const a=e[s],u=o[s];(D(a)||!D(u))&&(e[s]=u)}return e},{})}typeof process<"u"&&process.env.NODE_ENV;function Fe(t,e,o,n="primary",s,a,u){if(s)switch(o){case"text":return t?I:u?s[1]:a&&!e?s[0]:I;case"outline":return I;case"plain":return t?s[0]:u?s[2]:a&&!e?s[1]:s[0];default:return t?s[1]:u?s[5]:a&&!e?s[4]:s[5]}else if(n!=="info")switch(o){case"text":return t?I:u?p(n,2):a&&!e?p(n,1):I;case"outline":return I;case"plain":return t?p(n,1):u?p(n,3):a&&!e?p(n,2):p(n,1);default:return t?p(n,2):u?p(n,6):a&&!e?p(n,5):p(n,6)}else switch(o){case"outline":return I;case"text":return t?I:u?p("neutral",3):a&&!e?p("neutral",2):I;case"plain":return t?p("neutral",1):u?p("neutral",4):a&&!e?p("neutral",3):p("neutral",1);default:return t?p("neutral",1):u?p("neutral",3):a&&!e?p("neutral",2):p("neutral",1)}}function Se(t,e,o,n="primary",s,a,u){if(s)switch(o){case"text":return t?I:u?s[1]:a&&!e?s[0]:I;case"plain":return t?s[1]:u?s[3]:a&&!e?s[2]:s[1];case"outline":return t?s[1]:u?s[6]:a&&!e?s[4]:s[5];default:return t?p("neutral",8):p("neutral",10)}else if(n!=="info")switch(o){case"text":return t?I:u?p(n,2):a&&!e?p(n,1):I;case"plain":return t?p(n,2):u?p(n,4):a&&!e?p(n,3):p(n,2);case"outline":return t?p(n,1):u?p(n,7):a&&!e?p(n,5):p(n,6);default:return t?p("neutral",8):p("neutral",10)}else{switch(o){case"text":return t?I:u?p("neutral",3):a&&!e?p("neutral",2):I;case"plain":return t?p("neutral",5):u?p("neutral",9):a&&!e?p("neutral",8):p("neutral",7);case"outline":return t?p("neutral",6):u?p("neutral",8):a&&!e?p("neutral",9):p("neutral",10)}return t?p("neutral",8):p("neutral",10)}}const et=(t,e,o,n,s,a,u,l,c,i,v,m)=>{t.fillStyle=`rgba(${u.r}, ${u.g}, ${u.b}, ${u.a/255})`;for(let f=0;f<4;f++)s[f]>l&&(!(f===1||f===2)||i&&(m||c==="text")||!i)&&Z(t,n[f][0],n[f][1],s[f],a[f][0],a[f][1],l);n[1][0]+l>n[0][0]&&t.fillRect(n[0][0],0,n[1][0]-n[0][0]+l,l),n[2][1]+l>n[1][1]&&(i&&(m||c==="text")||!i)&&t.fillRect(e-l,n[1][1],l,n[2][1]-n[1][1]+l),n[3][0]<n[2][0]+l&&t.fillRect(n[3][0],o-l,n[2][0]-n[3][0]+l,l),!(i&&!v&&c!=="text")&&n[3][1]+l>n[0][1]&&t.fillRect(0,n[0][1],l,n[3][1]-n[0][1]+l),i&&!v&&c!=="text"&&t.fillRect(l/2,0,l/2,o),i&&!m&&c!=="text"&&t.fillRect(e-2*l-1,0,l,o)};function ge(t,e,o="primary",n,s,a){return n?t?n[0]:a?n[6]:s&&!e?n[3]:n[4]:o!=="info"?t?p(o,1):a?p(o,7):s&&!e?p(o,4):p(o,5):t?p("neutral",2):a?p("neutral",5):s&&!e?p("neutral",4):p("neutral",3)}function Y(t,e){return Math.ceil((-6+Math.sqrt(36-48*t+32*t*e))/(8*t))*t}const tt=(t,e,o,n,s,a,u,l,c,i,v="primary",m,d,f,_,h,M)=>{const L=Y(u,s[2]),k=Y(u,s[3]),y=Y(u,s[1]),w=Y(u,s[0]),N=+!(d&&!f&&i!=="text");if(!M||l){const C=ge(l,c,v,m,h,M);t.fillStyle=`rgba(${C.r}, ${C.g}, ${C.b}, ${C.a/255})`;for(let g=1;g<3;g++)s[g]>u&&Z(t,n[g][0]-u,n[g][1],s[g],a[g][0],a[g][1],u);const O=n[2][0]+u-n[3][0]+k*N+L;O>0&&t.fillRect(n[3][0]-k*N,o-u*2,O,u);const P=n[2][1]+u-n[1][1]+y+L;P>0&&t.fillRect(e-u*2-(_?0:+d*u*1),n[1][1]-y,u,P)}else{const C=ge(l,c,v,m,h,M);t.fillStyle=`rgba(${C.r}, ${C.g}, ${C.b}, ${C.a/255})`,s[0]>u&&Z(t,n[0][0]+u,n[0][1],s[0],a[0][0],a[0][1],u),s[3]>u&&Z(t,n[3][0]+u,n[3][1],s[3],a[3][0],a[3][1],u);const O=n[1][0]+u-n[0][0]+y+w*N;O>0&&t.fillRect(n[0][0]-w*N,u,O,u);const P=u+n[3][1]-n[0][1]+k+w;P>0&&t.fillRect(u,n[0][1]-w,u,P)}},$=(t,e,o)=>H(e)?Math.max(e,o):Math.max(t.height*parseFloat(e)/100,o),R=t=>Array(4).fill(t),nt=(t,e,o)=>{if(!e)return R(o);if(!ie(e))return R($(t,e,o));switch(e.length){case 1:return R($(t,e[0],o));case 2:{const n=$(t,e[0],o),s=$(t,e[1],o);return[n,s,n,s]}case 3:{const n=$(t,e[0],o),s=$(t,e[2],o),a=$(t,e[1],o);return[n,a,s,a]}default:return e.map(n=>$(t,n,o))}},rt=(t,e,o,n,s)=>{if(!e)return R(o);if(!ie(e)){const a=$(t,e,o);return s?[o,a,a,o]:n?[a,o,o,a]:R(o)}switch(e.length){case 1:const a=$(t,e[0],o);return s?[o,a,a,o]:n?[a,o,o,a]:R(o);case 2:{const u=$(t,e[0],o),l=$(t,e[1],o);return s?[o,l,l,o]:n?[u,o,o,u]:R(o)}case 3:{const u=$(t,e[0],o),l=$(t,e[2],o),c=$(t,e[1],o);return s?[o,c,l,o]:n?[u,o,o,c]:R(o)}default:return s?[o,$(t,e[1],o),$(t,e[2],o),o]:n?[$(t,e[0],o),o,o,$(t,e[3],o)]:R(o)}},ot=(t,e,o,n,s,a,u)=>{if(s){if(o)return rt(t,o,e,a,u);switch(n){case"round":const l=R($(t,"50%",e));return u?l.map((c,i)=>i<1||i>2?e:c):a?l.map((c,i)=>i>0&&i<3?e:c):R(e);default:return R(e)}}else{if(o)return nt(t,o,e);switch(n){case"round":case"circle":return R($(t,"50%",e));default:return R(e)}}},st=(t,e,o,n,s,a)=>{if(!(!t||e==="primary")){if(o)return V(e==="plain"?t[2]:t[1]);if(n)return V(t[5]);if(a&&e!=="plain")return V(t[6]);switch(e){case"text":return V(t[5]);case"outline":return V(s?t[4]:t[5]);case"plain":return V(t[5]);default:return}}},_e=new WeakMap,j=new WeakMap,at=t=>()=>{const e=j.get(t);e==null||e.forEach(o=>o())},W=()=>{const t=r.ref(!1),e=r.ref(void 0);function o(s){t.value=s.matches}if(A()){const s=window.matchMedia("(prefers-color-scheme: dark)");o(s),s.addEventListener("change",o),r.onBeforeUnmount(()=>{s.removeEventListener("change",o)})}const n=()=>{if(A()){let s=!1,a=!1;document.documentElement.className.split(" ").forEach(u=>{u==="dark"&&(s=!0),u==="light"&&(a=!0)}),e.value=s?!0:a?!1:void 0}};return A()&&(r.onMounted(()=>{const s=_e.get(document.documentElement)||new MutationObserver(at(document.documentElement));_e.set(document.documentElement,s),s.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]}),j.set(document.documentElement,[...j.get(document.documentElement)||[],n]),n()}),r.onBeforeUnmount(()=>{j.set(document.documentElement,(j.get(document.documentElement)||[]).filter(s=>s!==n))})),r.computed(()=>e.value??t.value)},Be=(t,e,o=!0)=>{if(!A())return null;const n=new ResizeObserver(e);return r.onMounted(()=>{setTimeout(()=>{o&&e(),t.value&&n.observe(t.value)})}),r.onBeforeUnmount(()=>{n.disconnect()}),n},ut=["disabled","type","autofocus"],Ce=r.defineComponent({name:"Button",__name:"index",props:{borderRadius:null,shape:{default:"default"},size:{default:"medium"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},variant:{default:"primary"},theme:{default:"primary"},color:null,block:{type:Boolean,default:!1},nativeType:{default:"button"},autofocus:{type:Boolean,default:!1}},setup(t){var g;const e=t,o=r.getCurrentInstance(),n=r.ref(((g=o==null?void 0:o.parent)==null?void 0:g.type)===ce),s=r.ref(!1),a=r.ref(!1),u=r.inject("px-button-group-props"),l=r.computed(()=>n.value&&u?u.borderRadius:e.borderRadius),c=r.computed(()=>n.value&&u?u.variant:e.variant),i=r.computed(()=>n.value&&u?u.size:e.size),v=r.computed(()=>n.value&&u?u.shape:e.shape),m=r.computed(()=>n.value&&u&&u.disabled||e.disabled),d=()=>{if(o&&o.vnode.el instanceof HTMLElement){const b=o.vnode.el.parentElement;if(b&&b.children.length){const x=[...b.children];s.value=x.indexOf(o.vnode.el)===b.children.length-1,a.value=x.indexOf(o.vnode.el)===0}else s.value=!1,a.value=!1}},f=r.useSlots(),_=r.ref(!1),h=r.ref(!1),M=b=>{_.value=b},L=b=>{h.value=b},k=W(),y=r.ref(null),w=r.ref(null);r.onMounted(()=>{setTimeout(()=>{w.value&&w.value.addEventListener("slot-changed",N),d()})});const N=()=>{setTimeout(()=>{d(),P()})};r.onBeforeUnmount(()=>{w.value&&w.value.removeEventListener("slot-changed",N)});const C=r.computed(()=>{if(!e.color)return null;const b=J(e.color);return X(b.r,b.g,b.b,b.a,k.value)}),O=r.computed(()=>st(C.value,c.value,m.value,e.loading,_.value,h.value));r.watch([l,v,m,()=>e.loading,c,()=>e.theme,C,_,h,k],()=>{setTimeout(()=>{d(),P()})});const P=()=>{const b=getComputedStyle(document.documentElement),x=parseInt(b.getPropertyValue("--px-bit"));if(!y.value||!w.value)return;const E=y.value.getContext("2d",{willReadFrequently:!0}),B=w.value.getBoundingClientRect();if(y.value.width=B.width,y.value.height=B.height,!E)return;const T=ot(y.value,x,l.value,v.value,n.value,a.value,s.value),Ge=Se(m.value,e.loading,c.value,e.theme,C.value,_.value,h.value),U=[[T[0],T[0]],[y.value.width-T[1]-x,T[1]],[y.value.width-T[2]-x,y.value.height-T[2]-x],[T[3],y.value.height-T[3]-x]],pe=[[Math.PI,Math.PI*3/2],[Math.PI*3/2,Math.PI*2],[0,Math.PI/2],[Math.PI/2,Math.PI]];c.value==="primary"&&tt(E,y.value.width,y.value.height,U,T,pe,x,m.value,e.loading,c.value,e.theme,C.value,n.value,a.value,s.value,_.value,h.value),et(E,y.value.width,y.value.height,U,T,pe,Ge,x,c.value,n.value,a.value,s.value);const Ue=Fe(m.value,e.loading,c.value,e.theme,C.value,_.value,h.value);Qe(E,Math.round((U[0][0]+U[1][0])/2),Math.round((U[0][1]+U[2][1])/2),Ue)};return Be(w,P),(b,x)=>(r.openBlock(),r.createElementBlock("button",{disabled:m.value||e.loading,class:r.normalizeClass(["pixelium px-button",{"px-button__block":!n.value&&!!e.block,"px-button__circle":v.value==="circle","px-button__square":v.value==="square","px-button__loading":e.loading,"px-button__large":i.value==="large","px-button__small":i.value==="small","px-button__outline":c.value==="outline","px-button__plain":c.value==="plain","px-button__text":c.value==="text","px-button__disabled":m.value,"px-button__custom":C.value,"px-button__inner":n.value,[`px-button__${e.theme||"primary"}`]:!0}]),style:r.normalizeStyle({color:O.value}),ref_key:"buttonRef",ref:w,"data-px-button":"",onMouseenter:x[0]||(x[0]=E=>M(!0)),onMouseleave:x[1]||(x[1]=E=>M(!1)),onMousedown:x[2]||(x[2]=E=>L(!0)),onMouseup:x[3]||(x[3]=E=>L(!1)),type:e.nativeType,autofocus:e.autofocus},[r.createElementVNode("canvas",{ref_key:"canvasRef",ref:y,class:"px-button-canvas"},null,512),r.unref(f).icon||e.loading?(r.openBlock(),r.createElementBlock("div",{key:0,class:r.normalizeClass(["px-button-icon-wrapper",{"px-button-icon-wrapper__last":!r.unref(f).default}])},[e.loading?(r.openBlock(),r.createBlock(r.unref(ue),{key:0,class:r.normalizeClass(["px-button-icon",{"px-button-icon__loading":e.loading}]),style:r.normalizeStyle({fill:O.value})},null,8,["class","style"])):r.renderSlot(b.$slots,"icon",{key:1})],2)):r.createCommentVNode("",!0),r.renderSlot(b.$slots,"default")],46,ut))}}),lt=["href","target"],$e=r.defineComponent({name:"Link",__name:"index",props:{disabled:{type:Boolean},loading:{type:Boolean},theme:null,color:null,href:null,target:null},setup(t){const e=t,o=r.useSlots(),n=W(),s=r.computed(()=>{if(!e.color)return null;const d=J(e.color);return X(d.r,d.g,d.b,d.a,n.value)}),a=r.ref(!1),u=r.ref(!1),l=d=>{a.value=d},c=d=>{u.value=d},i=(d,f,_,h,M)=>{if(d)return V(f?d[1]:_?d[5]:M?d[6]:h?d[4]:d[5])},v=r.computed(()=>i(s.value,e.disabled,e.loading,a.value,u.value)),m=d=>{(e.disabled||e.loading)&&d.preventDefault()};return(d,f)=>(r.openBlock(),r.createElementBlock("a",{class:r.normalizeClass(["pixelium px-link",{"px-link__loading":e.loading,"px-link__disabled":e.disabled,"px-link__custom":s.value,[`px-link__${e.theme||"primary"}`]:!0}]),style:r.normalizeStyle({color:v.value}),onMouseenter:f[0]||(f[0]=_=>l(!0)),onMouseleave:f[1]||(f[1]=_=>l(!1)),onMousedown:f[2]||(f[2]=_=>c(!0)),onMouseup:f[3]||(f[3]=_=>c(!1)),href:e.href,target:e.target,onClick:m},[r.unref(o).icon||e.loading?(r.openBlock(),r.createElementBlock("div",{key:0,class:r.normalizeClass(["px-link-icon-wrapper",{"px-link-icon-wrapper__last":!r.unref(o).default}])},[e.loading?(r.openBlock(),r.createBlock(r.unref(ue),{key:0,class:r.normalizeClass(["px-link-icon",{"px-link-icon__loading":e.loading}]),style:r.normalizeStyle({fill:v.value})},null,8,["class","style"])):r.renderSlot(d.$slots,"icon",{key:1})],2)):r.createCommentVNode("",!0),r.renderSlot(d.$slots,"default")],46,lt))}}),ct=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M22 9V7h-1V5h-1V4h-1V3h-2V2h-2V1H9v1H7v1H5v1H4v1H3v2H2v2H1v6h1v2h1v2h1v1h1v1h2v1h2v1h6v-1h2v-1h2v-1h1v-1h1v-2h1v-2h1V9zM11 6h2v2h-2zm-1 9h1v-5h-1V9h3v6h1v2h-4z"},null,-1),r.createElementVNode("path",{fill:"none",d:"M0 0h24v24H0z"},null,-1)])],4))}}),it=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M22 20v-2h-1v-2h-1v-2h-1v-2h-1v-2h-1V8h-1V6h-1V4h-1V2h-1V1h-2v1h-1v2H9v2H8v2H7v2H6v2H5v2H4v2H3v2H2v2H1v2h1v1h20v-1h1v-2zm-12-9h4v3h-1v3h-2v-3h-1zm1 7h2v2h-2z"},null,-1)])],4))}}),dt=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M22 8V7h-1V6h-1V5h-1V4h-1V3h-1V2h-1V1H8v1H7v1H6v1H5v1H4v1H3v1H2v1H1v8h1v1h1v1h1v1h1v1h1v1h1v1h1v1h8v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1V8zm-6 9h-2v-1h-1v-1h-2v1h-1v1H8v-1H7v-2h1v-1h1v-2H8v-1H7V8h1V7h2v1h1v1h2V8h1V7h2v1h1v2h-1v1h-1v2h1v1h1v2h-1z"},null,-1)])],4))}}),ft=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M22 9V7h-1V5h-1V4h-1V3h-2V2h-2V1H9v1H7v1H5v1H4v1H3v2H2v2H1v6h1v2h1v2h1v1h1v1h2v1h2v1h6v-1h2v-1h2v-1h1v-1h1v-2h1v-2h1V9zm-4 3h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-2v-1H9v-1H8v-1H7v-1H6v-2h1v-1h2v1h1v1h2v-1h1v-1h1v-1h1V9h1V8h2v1h1v2h-1z"},null,-1)])],4))}}),mt=r.defineComponent({props:{size:{},color:{}},setup(t){const e=t;return(o,n)=>(r.openBlock(),r.createElementBlock("svg",{class:"px-icon-hn",style:r.normalizeStyle({color:e.color,fontSize:e.size+"px"}),xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},[...n[0]||(n[0]=[r.createElementVNode("path",{d:"M14 13h1v1h1v1h1v1h1v1h1v1h1v1h1v1h1v1h-1v1h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-1v-1h-2v1h-1v1H9v1H8v1H7v1H6v1H5v1H4v1H3v-1H2v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-1h1v-2H9v-1H8V9H7V8H6V7H5V6H4V5H3V4H2V3h1V2h1v1h1v1h1v1h1v1h1v1h1v1h1v1h1v1h2V9h1V8h1V7h1V6h1V5h1V4h1V3h1V2h1v1h1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1v1h-1z"},null,-1)])],4))}}),pt=r.defineComponent({__name:"index",props:{content:{default:""},icon:null,duration:{default:3e3},id:null,type:{default:"normal"},color:null,closable:{type:Boolean}},emits:["close"],setup(t,{expose:e,emit:o}){const n=t,s=r.ref(!1),a=r.ref(!1),u=g=>{a.value=g},l=g=>{s.value=g},c=r.ref(!1);let i;r.onMounted(()=>{c.value=!0,v()}),r.onBeforeUnmount(()=>{clearTimeout(i)});function v(){i=setTimeout(()=>d(),n.duration)}function m(){clearTimeout(i),i=void 0}function d(){c.value=!1}const f=o,_=()=>{f("close",n.id),m()},h=r.ref(),M=r.ref(),L=g=>{if(!g)return"normal";switch(g){case"info":return"primary";case"error":return"danger";default:return g}},k=W(),y=r.computed(()=>{if(!n.color)return null;const g=J(n.color);return X(g.r,g.g,g.b,g.a,k.value)}),w=r.computed(()=>y.value?V(y.value[5]):void 0),N=r.computed(()=>{if(y.value)return a.value?V(y.value[6]):s.value?V(y.value[4]):V(y.value[5])});function C(g="normal",b){if(b)return b[5];{const x=L(g);return x==="normal"?p("neutral",10):x==="loading"?p("neutral",8):p(x,6)}}const O=(g,b,x,E,B)=>{g.fillStyle=`rgba(${E.r}, ${E.g}, ${E.b}, ${E.a/255})`,g.fillRect(B,0,b-2*B,B),g.fillRect(b-B,B,B,x-2*B),g.fillRect(B,x-B,b-2*B,B),g.fillRect(0,B,B,x-2*B);const T=p("neutral",1);g.fillStyle=`rgba(${T.r}, ${T.g}, ${T.b}, ${T.a/255})`,g.fillRect(B,B,b-2*B,x-2*B)},P=()=>{const g=getComputedStyle(document.documentElement),b=parseInt(g.getPropertyValue("--px-bit"));if(!h.value||!M.value)return;const x=h.value.getContext("2d",{willReadFrequently:!0}),E=M.value.getBoundingClientRect();if(h.value.width=E.width,h.value.height=E.height,!x)return;const B=C(n.type,y.value);O(x,h.value.width,h.value.height,B,b)};return Be(M,P),r.watch([()=>n.type,y,k],()=>{setTimeout(()=>{P()})}),e({close:d}),()=>r.createVNode(r.Transition,{name:"px-message-fade",onAfterLeave:_},{default:()=>[c.value&&r.createVNode("div",{ref:g=>M.value=g,onMouseenter:m,onMouseleave:v,class:{"px-message":!0,pixelium:!0,[`px-message__${n.type||"primary"}`]:!0}},[(!!n.icon||n.type&&n.type!=="normal"&&n.type!=="sakura")&&r.createVNode("div",{class:"px-message-icon-wrapper"},[n.icon?n.icon():n.type==="info"?r.createVNode(ct,{class:"px-message-icon",style:{fill:w.value}},null):n.type==="success"?r.createVNode(ft,{class:"px-message-icon",style:{fill:w.value}},null):n.type==="warning"?r.createVNode(it,{class:"px-message-icon",style:{fill:w.value}},null):n.type==="error"?r.createVNode(dt,{class:"px-message-icon",style:{fill:w.value}},null):n.type==="loading"&&r.createVNode(ue,{class:"px-message-icon px-message-icon__loading",style:{fill:w.value}},null)]),r.createVNode("span",{class:"px-message-content",style:{color:w.value}},[K(n.content)?n.content:n.content()]),n.closable&&r.createVNode("div",{class:"px-message-close-wrapper"},[r.createVNode(mt,{class:"px-message-icon",style:{fill:N.value},onMouseenter:l(!0),onMouseleave:l(!1),onMousedown:u(!0),onMouseup:u(!1),onClick:d},null)]),r.createVNode("canvas",{ref:g=>h.value=g,class:"px-message-canvas"},null)])]})}}),vt="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict";let ae=(t=21)=>{let e="",o=crypto.getRandomValues(new Uint8Array(t|=0));for(;t--;)e+=vt[o[t]&63];return e};const Me=r.defineComponent({name:"MessageBoxInner",__name:"message-box",props:{messages:{},position:{},zIndex:{default:le},root:{},"onUpdate:messages":{}},emits:["close"],setup(t,{expose:e,emit:o}){const n=t,s=r.useModel(n,"messages"),a=o,u=r.computed(()=>s.value.map(i=>({...i,id:i.id??ae()}))),l=i=>{if(!D(i)){if(n["onUpdate:messages"]){const v=u.value.findIndex(m=>m.id===i);if(v>=0){const m=[...u.value];m.splice(v,1),s.value=m}}a("close",i)}},c=r.ref([]);return e({close:i=>{var m;const v=u.value.findIndex(d=>d.id===i);v!==-1&&((m=c.value[v])==null||m.close())}}),(i,v)=>(r.openBlock(),r.createElementBlock("div",{class:"px-message-box",style:r.normalizeStyle({zIndex:n.zIndex})},[r.createElementVNode("div",{class:r.normalizeClass(["px-message-box-container",{[`px-message-box-container__${r.unref(ze)(n.position||"top")}`]:!0}])},[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(u.value,m=>(r.openBlock(),r.createBlock(pt,{key:m.id,duration:m.duration,content:m.content,id:m.id,onClose:l,type:m.type,color:m.color,icon:m.icon,closable:m.closable,ref_for:!0,ref_key:"messageRef",ref:c},null,8,["duration","content","id","type","color","icon","closable"]))),128))],2)],4))}}),Ve=r.defineComponent({name:"MessageBox",__name:"message-box-wrapped",props:{messages:null,position:null,zIndex:{default:le},root:{default:"body"},"onUpdate:messages":{type:Function},onClose:{type:Function}},setup(t,{expose:e}){const o=t,n=r.useAttrs(),s=r.ref(null);return e({close:a=>{var u;(u=s.value)==null||u.close(a)}}),(a,u)=>(r.openBlock(),r.createBlock(r.Teleport,{to:o.root},[r.createVNode(Me,r.mergeProps({...o,...r.unref(n)},{ref_key:"messageBoxRef",ref:s}),null,16)],8,["to"]))}});class ht{constructor(e){ee(this,"messages");ee(this,"messageBox");this.messages=r.ref([]),this.messageBox=r.createVNode(Me,{messages:this.messages.value,zIndex:e.zIndex,position:e.position,onClose:a=>{const u=this.messages.value.findIndex(l=>l.id===a);u>=0&&this.messages.value.splice(u,1)}});const o=(K(e.root)?document.querySelector(e.root):e.root)||document.body,n=ae(),s=document.createElement("div");s.id=n,s.className="px-message-box-wrapper",o.appendChild(s),r.render(this.messageBox,s)}push(e){const o=e.id??ae();return this.messages.value.push({...e,id:o}),o}close(e){var o,n;(n=(o=this.messageBox.component)==null?void 0:o.exposed)==null||n.close(e)}clear(){this.messages.value.length=0}}const oe={top:void 0,bottom:void 0,topLeft:void 0,topRight:void 0,bottomLeft:void 0,bottomRight:void 0},gt=t=>{(K(t)||we(t))&&(t={content:t});const e=t.position||"top",o=oe[e]?oe[e]:oe[e]=new ht({position:e,zIndex:le,root:t.root||"body"}),n=o.push({content:t.content,icon:t.icon,duration:t.duration||3e3,type:t.type||"normal",color:t.color,closable:t.closable});return{close:()=>o.close(n),clear:()=>o.clear()}},Q=gt;["info","success","warning","error","loading","sakura","normal"].forEach(t=>{Q[t]=e=>((K(e)||we(e))&&(e={content:e}),Q({...e,type:t}))});const S=()=>{const t=r.ref(0);function e(){A()&&(t.value=window.innerWidth)}e();const o=r.computed(()=>{let n;return t.value<=576?n=G.XS:t.value<=768?n=G.SM:t.value<=992?n=G.MD:t.value<=1200?n=G.LG:t.value<=1600?n=G.XL:n=G.XXL,n});return A()&&(window.addEventListener("resize",e),r.onBeforeUnmount(()=>{window.removeEventListener("resize",e)})),[o,t]},_t={class:"pixelium px-row"},de=r.defineComponent({name:"Row",__name:"index",props:{gutter:{default:0},justify:{default:"start"},align:{default:"start"},wrap:{type:Boolean,default:!0}},setup(t){const e=t,[o]=S(),n=r.computed(()=>{if(H(e.gutter))return{x:e.gutter,y:e.gutter};if("x"in e.gutter||"y"in e.gutter)return{x:e.gutter.x||0,y:e.gutter.y||0};const s=e.gutter[o.value];return H(s)?{x:s,y:s}:ke({x:0,y:0},s)});return r.provide("px-row-provide",n),(s,a)=>(r.openBlock(),r.createElementBlock("div",_t,[r.createElementVNode("div",{class:r.normalizeClass(["px-row-inner",{[`px-row__justify-${e.justify}`]:!0,[`px-row__align-${e.align}`]:!0,"px-row__wrap":!!e.wrap}]),style:r.normalizeStyle({marginLeft:n.value?-n.value.x/2+"px":void 0,marginRight:n.value?-n.value.x/2+"px":void 0,marginTop:n.value?-n.value.y/2+"px":void 0,marginBottom:n.value?-n.value.y/2+"px":void 0})},[r.renderSlot(s.$slots,"default")],6)]))}}),He=r.defineComponent({name:"Col",__name:"index",props:{offset:{default:0},span:{default:24}},setup(t){var c;const e=t,[o]=S(),n=r.computed(()=>H(e.offset)?e.offset:e.offset[o.value]||0),s=r.computed(()=>H(e.span)?e.span:e.span[o.value]||24),a=r.getCurrentInstance(),l=r.ref(((c=a==null?void 0:a.parent)==null?void 0:c.type)===de).value&&r.inject("px-row-provide")||r.ref({x:0,y:0});return(i,v)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["pixelium px-col",{[`px-col__span-${s.value}`]:!0,[`px-col__offset-${n.value}`]:!0}]),style:r.normalizeStyle({paddingLeft:r.unref(l)?r.unref(l).x/2+"px":void 0,paddingRight:r.unref(l)?r.unref(l).x/2+"px":void 0,paddingTop:r.unref(l)?r.unref(l).y/2+"px":void 0,paddingBottom:r.unref(l)?r.unref(l).y/2+"px":void 0})},[r.renderSlot(i.$slots,"default")],6))}}),Ee=r.defineComponent({name:"Divider",__name:"index",props:{direction:{default:"horizontal"},variant:{default:"solid"},margin:null,size:null},setup(t){const e=t,o=r.computed(()=>{if(!D(e.margin))return H(e.margin)?`${e.margin}px`:e.margin}),n=r.computed(()=>{if(!D(e.size))return H(e.size)?`${e.size}px`:e.size});return(s,a)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["pixelium px-divider",{[`px-divider__${e.direction}`]:!0,[`px-divider__${e.variant}`]:!0}]),style:r.normalizeStyle({marginLeft:e.direction==="vertical"?o.value:void 0,marginRight:e.direction==="vertical"?o.value:void 0,marginTop:e.direction==="horizontal"?o.value:void 0,marginBottom:e.direction==="horizontal"?o.value:void 0,borderBottomWidth:e.direction==="horizontal"?n.value:void 0,borderRightWidth:e.direction==="vertical"?n.value:void 0})},null,6))}}),yt=(t,e)=>!!(t&&t.shapeFlag&1),xt=(t,e)=>!!(t&&t.shapeFlag&6),bt=(t,e)=>!!(t&&t.shapeFlag&8),wt=(t,e)=>!!(t&&t.shapeFlag&16),kt=(t,e)=>!!(t&&t.shapeFlag&32),F=t=>{var o,n;const e=[];for(const s of t??[])yt(s)||xt(s)||bt(s)?e.push(s):wt(s,s.children)?e.push(...F(s.children)):kt(s,s.children)?e.push(...F((n=(o=s.children).default)==null?void 0:n.call(o))):ie(s)&&e.push(...F(s));return e},Ie=r.defineComponent({name:"Space",__name:"index",props:{margin:{default:"medium"},direction:{default:"horizontal"},justify:{default:"start"},align:null,wrap:{type:Boolean,default:!0},inline:{type:Boolean,default:!1}},setup(t){var u;const e=t,o=r.computed(()=>e.align?e.align:e.direction==="horizontal"?"center":"stretch"),n=r.useSlots(),s=F(((u=n.default)==null?void 0:u.call(n))||[]),a=r.computed(()=>{if(!(!e.margin||e.margin==="small"||e.margin==="medium"||e.margin==="large")){if(H(e.margin))return{x:e.margin,y:e.margin};if("x"in e.margin||"y"in e.margin){const l=H(e.margin.x)?e.margin.x:0,c=H(e.margin.y)?e.margin.y:0;return{x:l,y:c}}}});return()=>r.createVNode("div",{class:{pixelium:!0,"px-space":!0,"px-space__inline":!!e.inline}},[r.createVNode("div",{class:{"px-space-inner":!0,"px-space__small":e.margin==="small","px-space__large":e.margin==="large",[`px-space__justify-${e.justify}`]:!0,[`px-space__align-${o.value}`]:!0,[`px-space__${e.direction}`]:!0,"px-space__wrap":!!e.wrap},style:{marginTop:a.value?-a.value.y/2+"px":void 0,marginBottom:a.value?-a.value.y/2+"px":void 0,marginLeft:a.value?-a.value.x/2+"px":void 0,marginRight:a.value?-a.value.x/2+"px":void 0}},[s.map((l,c)=>r.createVNode(r.Fragment,{key:l.key||`px-space-item-${c}`},[r.createVNode("div",{class:"px-space-item",style:{marginTop:a.value?a.value.y/2+"px":void 0,marginBottom:a.value?a.value.y/2+"px":void 0,marginLeft:a.value?a.value.x/2+"px":void 0,marginRight:a.value?a.value.x/2+"px":void 0}},[l])]))])])}}),fe=r.defineComponent({name:"Grid",__name:"index",props:{column:{default:24},gutter:{default:0}},setup(t){const e=t,[o]=S(),n=r.computed(()=>{if(H(e.gutter))return{x:e.gutter,y:e.gutter};if("x"in e.gutter||"y"in e.gutter)return{x:e.gutter.x||0,y:e.gutter.y||0};const u=e.gutter[o.value];return H(u)?{x:u,y:u}:ke({x:0,y:0},u)}),s=r.computed(()=>H(e.column)?e.column:e.column[o.value]||24),a=r.ref([]);return r.provide("px-grid-provide",{column:s,gutter:n,itemsStat:a}),(u,l)=>(r.openBlock(),r.createElementBlock("div",{class:"pixelium px-grid",style:r.normalizeStyle({gridTemplateColumns:`repeat(${s.value}, minmax(0, 1fr))`,gap:n.value?`${n.value.y}px ${n.value.x}px`:void 0})},[r.renderSlot(u.$slots,"default")],4))}}),se=new WeakMap,q=new WeakMap,Bt=t=>()=>{const e=q.get(t);e==null||e.forEach(o=>o())},Ct=()=>{const t=r.ref(-1),e=r.getCurrentInstance(),o=()=>{if(e&&e.vnode.el instanceof HTMLElement){const s=e.vnode.el.parentElement;if(s&&s.children.length){const a=[...s.children];t.value=a.indexOf(e.vnode.el)}}};let n=null;return A()&&(r.onMounted(()=>{setTimeout(()=>{var s;if(n=((s=e==null?void 0:e.vnode)==null?void 0:s.el)instanceof HTMLElement?e.vnode.el.parentElement:null,n){const a=se.get(n)||new MutationObserver(Bt(n));se.set(n,a),q.set(n,[...q.get(n)||[],o]),a.observe(n,{childList:!0})}o()})}),r.onUpdated(()=>{setTimeout(()=>{o()})}),r.onBeforeUnmount(()=>{var s;n&&((s=se.get(n))==null||s.disconnect(),q.set(n,(q.get(n)||[]).filter(a=>a!==o)))})),t},Le=r.defineComponent({name:"GridItem",__name:"index",props:{offset:{default:0},span:null},setup(t){var m;const e=r.getCurrentInstance(),n=r.ref(((m=e==null?void 0:e.parent)==null?void 0:m.type)===fe).value?r.inject("px-grid-provide"):void 0,s=t,a=r.useId(),u=Ct(),[l]=S(),c=r.computed(()=>H(s.offset)?s.offset:s.offset[l.value]||0),i=r.computed(()=>s.span===void 0?(n==null?void 0:n.column.value)||24:H(s.span)?s.span:s.span[l.value]||24);r.onMounted(()=>{n==null||n.itemsStat.value.push({id:a,index:u.value,offset:c.value,span:i.value})}),r.watch([u,c,i],()=>{const d=n==null?void 0:n.itemsStat.value.find(f=>f.id===a);d?(d.index=u.value,d.offset=c.value,d.span=i.value):n==null||n.itemsStat.value.push({id:a,index:u.value,offset:c.value,span:i.value})}),r.onBeforeUnmount(()=>{const d=n==null?void 0:n.itemsStat.value.findIndex(f=>f.id===a);d!==void 0&&d>-1&&(n==null||n.itemsStat.value.splice(d,1))});const v=r.computed(()=>{if(!n)return;if(c.value+i.value>n.column.value)return`${c.value+1} / span ${i.value}`;const d=n.itemsStat.value.filter(h=>h.index!==-1&&h.index<u.value);if(d.length===0)return`${c.value+1} / span ${i.value}`;let f=0;return d.forEach(h=>{if(h.span+h.offset>=n.column.value){f=0;return}f+=h.span+h.offset,f>n.column.value?f=h.span+h.offset:f===n.column.value&&(f=0)}),f+c.value+i.value>n.column.value?`${c.value+1} / span ${i.value}`:`${f+c.value+1} / span ${i.value}`});return(d,f)=>(r.openBlock(),r.createElementBlock("div",{class:"pixelium px-grid-item",style:r.normalizeStyle({gridColumn:v.value})},[r.renderSlot(d.$slots,"default")],4))}}),me=r.defineComponent({name:"Container",__name:"index",props:{direction:null},setup(t){const e=r.ref(0);r.provide("px-container-provide",e);const o=t;return(n,s)=>(r.openBlock(),r.createElementBlock("section",{class:r.normalizeClass(["pixelium px-container",{"px-container__has-aside":!!e.value,[`px-container__${o.direction}`]:!!o.direction}])},[r.renderSlot(n.$slots,"default")],2))}}),$t={class:"pixelium px-main"},Te=r.defineComponent({name:"Main",__name:"index",setup(t){return(e,o)=>(r.openBlock(),r.createElementBlock("main",$t,[r.renderSlot(e.$slots,"default")]))}}),Re=r.defineComponent({name:"Aside",__name:"index",props:{width:null,bordered:{type:Boolean,default:!1},side:{default:"left"},dark:{type:Boolean,default:!1}},setup(t){var l;const e=r.getCurrentInstance(),n=r.ref(((l=e==null?void 0:e.parent)==null?void 0:l.type)===me).value?r.inject("px-container-provide"):void 0;r.onMounted(()=>{n&&(n.value+=1)}),r.onBeforeUnmount(()=>{n&&(n.value-=1)});const s=t,a=W(),u=r.computed(()=>D(s.width)?void 0:H(s.width)?`${s.width}px`:s.width);return(c,i)=>(r.openBlock(),r.createElementBlock("aside",{class:r.normalizeClass(["pixelium px-aside",{"px-aside__dark":!r.unref(a)&&!!s.dark,"px-aside__bordered":!!s.bordered,[`px-aside__${s.side}`]:!0}]),style:r.normalizeStyle({width:u.value})},[r.renderSlot(c.$slots,"default")],6))}}),Ne=r.defineComponent({name:"Header",__name:"index",props:{minHeight:null,bordered:{type:Boolean},dark:{type:Boolean,default:!1}},setup(t){const e=t,o=W(),n=r.computed(()=>D(e.minHeight)?void 0:H(e.minHeight)?`${e.minHeight}px`:e.minHeight);return(s,a)=>(r.openBlock(),r.createElementBlock("header",{class:r.normalizeClass(["pixelium px-header",{"px-header__dark":!r.unref(o)&&!!e.dark,"px-header__bordered":!!e.bordered}]),style:r.normalizeStyle({minHeight:n.value})},[r.renderSlot(s.$slots,"default")],6))}}),Ae=r.defineComponent({name:"Footer",__name:"index",props:{minHeight:null,bordered:{type:Boolean},dark:{type:Boolean,default:!1}},setup(t){const e=t,o=W(),n=r.computed(()=>D(e.minHeight)?void 0:H(e.minHeight)?`${e.minHeight}px`:e.minHeight);return(s,a)=>(r.openBlock(),r.createElementBlock("footer",{class:r.normalizeClass(["pixelium px-footer",{"px-footer__dark":!r.unref(o)&&!!e.dark,"px-footer__bordered":!!e.bordered}]),style:r.normalizeStyle({minHeight:n.value})},[r.renderSlot(s.$slots,"default")],6))}});typeof process<"u"&&process.env.NODE_ENV;const Mt="Pixelium";function ye(t){throw new Error(`[${Mt}] ${t}`)}const Vt=(t,e)=>{var n,s;if(!A())return;const o={light:[],dark:[]};if(K(e)){const a=J(e);o.light=X(a.r,a.g,a.b,a.a,!1).map(u=>V(u)),o.dark=X(a.r,a.g,a.b,a.a,!0).map(u=>V(u))}else(n=e.light)!=null&&n.length&&e.light.length!==10&&ye("The length of color.light does not match the required number of CSS color palette (10)."),(s=e.dark)!=null&&s.length&&e.dark.length!==10&&ye("The length of color.dark does not match the required number of CSS color palette (10)."),o.light=e.light||[],o.dark=e.dark||[];o.light.forEach((a,u)=>{document.documentElement.style.setProperty(`--px-${t}-light-custom-${u+1}`,a)}),o.dark.forEach((a,u)=>{document.documentElement.style.setProperty(`--px-${t}-dark-custom-${u+1}`,a)})},xe=t=>{if(!A())return;const e=document.documentElement;e.classList.remove("light","dark"),t!=="unset"&&e.classList.add(t)};function Pe(t){const e=r.ref(!1);if(A()){let l=function(i){e.value=i.matches};const c=window.matchMedia("(prefers-color-scheme: dark)");l(c),c.addEventListener("change",l),r.onBeforeUnmount(()=>{c.removeEventListener("change",l)})}const o=r.ref(t||e.value?"dark":"light");t&&xe(o.value);const n=()=>{o.value=o.value==="unset"?e.value?"light":"dark":o.value==="light"?"dark":"light"},s=()=>{o.value="unset"},a=()=>{o.value=e.value?"dark":"light"},u=r.watch(o,xe,{flush:"post"});return r.onScopeDispose(()=>{u()}),[o,n,s,a]}const Oe=r.defineComponent({name:"Icon",__name:"index",props:{size:{default:"1em"},color:{default:"currentColor"},rotate:{default:0},spin:{type:Boolean,default:!1},flip:{default:"none"}},setup(t){const e=t,o=r.computed(()=>{let s=1,a=1;return(e.flip==="horizontal"||e.flip==="both")&&(s=-1),(e.flip==="vertical"||e.flip==="both")&&(a=-1),`scale(${s}, ${a}) rotate(${e.rotate}deg)`}),n=r.computed(()=>H(e.size)?`${e.size}px`:e.size);return(s,a)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass({"pixelium px-icon":!0,"px-icon__spin":!!e.spin}),style:r.normalizeStyle({height:n.value,width:n.value,fontSize:n.value,color:e.color,transform:o.value})},[r.renderSlot(s.$slots,"default")],6))}}),Ht=[Ce,ce,$e,Ve,de,He,Ee,Ie,fe,Le,me,Te,Re,Ne,Ae,Oe],Et="Px",De=(t,e={prefix:Et})=>{Ht.forEach(o=>{o.name&&t.component(e.prefix+o.name,o)}),e.attachToApp!==!1&&(t.config.globalProperties.PixeliumVue={message:Q,useThemeMode:Pe}),e.attachToWindow!==!1&&A()&&(window.$message=Q)},It={install:De};exports.Aside=Re;exports.Button=Ce;exports.ButtonGroup=ce;exports.Col=He;exports.Container=me;exports.Divider=Ee;exports.Footer=Ae;exports.Grid=fe;exports.GridItem=Le;exports.Header=Ne;exports.Icon=Oe;exports.Link=$e;exports.Main=Te;exports.Message=Q;exports.MessageBox=Ve;exports.Row=de;exports.Space=Ie;exports.default=It;exports.install=De;exports.setThemeColor=Vt;exports.useThemeMode=Pe;

package/dist/pixelium-vue.css

@@ -0,0 +1 @@
+.px-button-group{--padding-y-size: 6px;--padding-x-size: 12px;height:var(--button-size);display:inline-flex;align-items:center;position:relative}.px-button-group>.px-button{margin-left:calc(-2 * var(--px-bit) - 1px)}.px-button-group>.px-button:first-child{margin-left:0}.px-button-canvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1;pointer-events:none}.px-button{--button-size: var(--px-medium-size);--padding-x-size: 16px;--text-color: var(--px-neutral-1);height:var(--button-size);padding-left:var(--padding-x-size);padding-right:var(--padding-x-size);background-color:transparent;border-color:transparent;border-width:var(--px-bit);display:inline-flex;align-items:center;position:relative;color:var(--text-color);cursor:pointer;-webkit-user-select:none;user-select:none;transition:.25s;z-index:0}.px-button__inner{padding-right:calc(var(--padding-x-size) + 1px + 1 * var(--px-bit))}.px-button__inner:last-of-type{padding-right:var(--padding-x-size)}.px-button__inner.px-button__text{padding-right:var(--padding-x-size);margin-right:calc(1px + 1 * var(--px-bit))}.px-button__inner.px-button__text:last-of-type{margin-right:0}.px-button__circle,.px-button__square{width:var(--button-size);--padding-x-size: 0px;justify-content:center}.px-button__large{--padding-x-size: 24px;--button-size: var(--px-large-size)}.px-button__small{--padding-x-size: 12px;--button-size: var(--px-small-size)}.px-button__loading{cursor:auto}.px-button__block{display:flex;width:100%;justify-content:center}.px-button__disabled{cursor:not-allowed}.px-button-icon-wrapper{margin-right:8px;display:flex;align-items:center}.px-button-icon-wrapper__last{margin-right:0}.px-button-icon{height:14px;width:14px;fill:var(--text-color)}.px-button-icon__loading{animation:px-icon-spin 1s linear infinite}.px-button.px-button__primary:focus-visible{outline-color:var(--px-primary-6);outline-offset:var(--px-bit)}.px-button.px-button__primary.px-button__plain{--text-color: var(--px-primary-6)}.px-button.px-button__primary.px-button__plain.px-button__disabled{--text-color: var(--px-primary-3)}.px-button.px-button__primary.px-button__plain:active.px-button__loading,.px-button.px-button__primary.px-button__plain:hover.px-button__loading{--text-color: var(--px-primary-6)}.px-button.px-button__primary.px-button__plain:active.px-button__disabled,.px-button.px-button__primary.px-button__plain:hover.px-button__disabled{--text-color: var(--px-primary-3)}.px-button.px-button__primary.px-button__text,.px-button.px-button__primary.px-button__outline{--text-color: var(--px-primary-6)}.px-button.px-button__primary.px-button__text.px-button__disabled,.px-button.px-button__primary.px-button__outline.px-button__disabled{--text-color: var(--px-primary-2)}.px-button.px-button__primary.px-button__text:active.px-button__loading,.px-button.px-button__primary.px-button__outline:active.px-button__loading,.px-button.px-button__primary.px-button__text:hover.px-button__loading,.px-button.px-button__primary.px-button__outline:hover.px-button__loading{--text-color: var(--px-primary-6)}.px-button.px-button__primary.px-button__text:active.px-button__disabled,.px-button.px-button__primary.px-button__outline:active.px-button__disabled,.px-button.px-button__primary.px-button__text:hover.px-button__disabled,.px-button.px-button__primary.px-button__outline:hover.px-button__disabled{--text-color: var(--px-primary-2)}.px-button.px-button__primary.px-button__outline:hover{--text-color: var(--px-primary-5)}.px-button.px-button__primary.px-button__outline:active{--text-color: var(--px-primary-7)}.px-button.px-button__primary .px-button__text:hover{--text-color: var(--px-primary-6)}.px-button.px-button__primary .px-button__text:active{--text-color: var(--px-primary-7)}.px-button.px-button__sakura:focus-visible{outline-color:var(--px-sakura-6);outline-offset:var(--px-bit)}.px-button.px-button__sakura.px-button__plain{--text-color: var(--px-sakura-6)}.px-button.px-button__sakura.px-button__plain.px-button__disabled{--text-color: var(--px-sakura-3)}.px-button.px-button__sakura.px-button__plain:active.px-button__loading,.px-button.px-button__sakura.px-button__plain:hover.px-button__loading{--text-color: var(--px-sakura-6)}.px-button.px-button__sakura.px-button__plain:active.px-button__disabled,.px-button.px-button__sakura.px-button__plain:hover.px-button__disabled{--text-color: var(--px-sakura-3)}.px-button.px-button__sakura.px-button__text,.px-button.px-button__sakura.px-button__outline{--text-color: var(--px-sakura-6)}.px-button.px-button__sakura.px-button__text.px-button__disabled,.px-button.px-button__sakura.px-button__outline.px-button__disabled{--text-color: var(--px-sakura-2)}.px-button.px-button__sakura.px-button__text:active.px-button__loading,.px-button.px-button__sakura.px-button__outline:active.px-button__loading,.px-button.px-button__sakura.px-button__text:hover.px-button__loading,.px-button.px-button__sakura.px-button__outline:hover.px-button__loading{--text-color: var(--px-sakura-6)}.px-button.px-button__sakura.px-button__text:active.px-button__disabled,.px-button.px-button__sakura.px-button__outline:active.px-button__disabled,.px-button.px-button__sakura.px-button__text:hover.px-button__disabled,.px-button.px-button__sakura.px-button__outline:hover.px-button__disabled{--text-color: var(--px-sakura-2)}.px-button.px-button__sakura.px-button__outline:hover{--text-color: var(--px-sakura-5)}.px-button.px-button__sakura.px-button__outline:active{--text-color: var(--px-sakura-7)}.px-button.px-button__sakura .px-button__text:hover{--text-color: var(--px-sakura-6)}.px-button.px-button__sakura .px-button__text:active{--text-color: var(--px-sakura-7)}.px-button.px-button__success:focus-visible{outline-color:var(--px-success-6);outline-offset:var(--px-bit)}.px-button.px-button__success.px-button__plain{--text-color: var(--px-success-6)}.px-button.px-button__success.px-button__plain.px-button__disabled{--text-color: var(--px-success-3)}.px-button.px-button__success.px-button__plain:active.px-button__loading,.px-button.px-button__success.px-button__plain:hover.px-button__loading{--text-color: var(--px-success-6)}.px-button.px-button__success.px-button__plain:active.px-button__disabled,.px-button.px-button__success.px-button__plain:hover.px-button__disabled{--text-color: var(--px-success-3)}.px-button.px-button__success.px-button__text,.px-button.px-button__success.px-button__outline{--text-color: var(--px-success-6)}.px-button.px-button__success.px-button__text.px-button__disabled,.px-button.px-button__success.px-button__outline.px-button__disabled{--text-color: var(--px-success-2)}.px-button.px-button__success.px-button__text:active.px-button__loading,.px-button.px-button__success.px-button__outline:active.px-button__loading,.px-button.px-button__success.px-button__text:hover.px-button__loading,.px-button.px-button__success.px-button__outline:hover.px-button__loading{--text-color: var(--px-success-6)}.px-button.px-button__success.px-button__text:active.px-button__disabled,.px-button.px-button__success.px-button__outline:active.px-button__disabled,.px-button.px-button__success.px-button__text:hover.px-button__disabled,.px-button.px-button__success.px-button__outline:hover.px-button__disabled{--text-color: var(--px-success-2)}.px-button.px-button__success.px-button__outline:hover{--text-color: var(--px-success-5)}.px-button.px-button__success.px-button__outline:active{--text-color: var(--px-success-7)}.px-button.px-button__success .px-button__text:hover{--text-color: var(--px-success-6)}.px-button.px-button__success .px-button__text:active{--text-color: var(--px-success-7)}.px-button.px-button__warning:focus-visible{outline-color:var(--px-warning-6);outline-offset:var(--px-bit)}.px-button.px-button__warning.px-button__plain{--text-color: var(--px-warning-6)}.px-button.px-button__warning.px-button__plain.px-button__disabled{--text-color: var(--px-warning-3)}.px-button.px-button__warning.px-button__plain:active.px-button__loading,.px-button.px-button__warning.px-button__plain:hover.px-button__loading{--text-color: var(--px-warning-6)}.px-button.px-button__warning.px-button__plain:active.px-button__disabled,.px-button.px-button__warning.px-button__plain:hover.px-button__disabled{--text-color: var(--px-warning-3)}.px-button.px-button__warning.px-button__text,.px-button.px-button__warning.px-button__outline{--text-color: var(--px-warning-6)}.px-button.px-button__warning.px-button__text.px-button__disabled,.px-button.px-button__warning.px-button__outline.px-button__disabled{--text-color: var(--px-warning-2)}.px-button.px-button__warning.px-button__text:active.px-button__loading,.px-button.px-button__warning.px-button__outline:active.px-button__loading,.px-button.px-button__warning.px-button__text:hover.px-button__loading,.px-button.px-button__warning.px-button__outline:hover.px-button__loading{--text-color: var(--px-warning-6)}.px-button.px-button__warning.px-button__text:active.px-button__disabled,.px-button.px-button__warning.px-button__outline:active.px-button__disabled,.px-button.px-button__warning.px-button__text:hover.px-button__disabled,.px-button.px-button__warning.px-button__outline:hover.px-button__disabled{--text-color: var(--px-warning-2)}.px-button.px-button__warning.px-button__outline:hover{--text-color: var(--px-warning-5)}.px-button.px-button__warning.px-button__outline:active{--text-color: var(--px-warning-7)}.px-button.px-button__warning .px-button__text:hover{--text-color: var(--px-warning-6)}.px-button.px-button__warning .px-button__text:active{--text-color: var(--px-warning-7)}.px-button.px-button__danger:focus-visible{outline-color:var(--px-danger-6);outline-offset:var(--px-bit)}.px-button.px-button__danger.px-button__plain{--text-color: var(--px-danger-6)}.px-button.px-button__danger.px-button__plain.px-button__disabled{--text-color: var(--px-danger-3)}.px-button.px-button__danger.px-button__plain:active.px-button__loading,.px-button.px-button__danger.px-button__plain:hover.px-button__loading{--text-color: var(--px-danger-6)}.px-button.px-button__danger.px-button__plain:active.px-button__disabled,.px-button.px-button__danger.px-button__plain:hover.px-button__disabled{--text-color: var(--px-danger-3)}.px-button.px-button__danger.px-button__text,.px-button.px-button__danger.px-button__outline{--text-color: var(--px-danger-6)}.px-button.px-button__danger.px-button__text.px-button__disabled,.px-button.px-button__danger.px-button__outline.px-button__disabled{--text-color: var(--px-danger-2)}.px-button.px-button__danger.px-button__text:active.px-button__loading,.px-button.px-button__danger.px-button__outline:active.px-button__loading,.px-button.px-button__danger.px-button__text:hover.px-button__loading,.px-button.px-button__danger.px-button__outline:hover.px-button__loading{--text-color: var(--px-danger-6)}.px-button.px-button__danger.px-button__text:active.px-button__disabled,.px-button.px-button__danger.px-button__outline:active.px-button__disabled,.px-button.px-button__danger.px-button__text:hover.px-button__disabled,.px-button.px-button__danger.px-button__outline:hover.px-button__disabled{--text-color: var(--px-danger-2)}.px-button.px-button__danger.px-button__outline:hover{--text-color: var(--px-danger-5)}.px-button.px-button__danger.px-button__outline:active{--text-color: var(--px-danger-7)}.px-button.px-button__danger .px-button__text:hover{--text-color: var(--px-danger-6)}.px-button.px-button__danger .px-button__text:active{--text-color: var(--px-danger-7)}.px-button.px-button__info{--text-color: var(--px-neutral-10)}.px-button.px-button__info:focus-visible{outline-color:var(--px-neutral-10);outline-offset:var(--px-bit)}.px-button.px-button__info.px-button__disabled{--text-color: var(--px-neutral-6)}.px-button.px-button__info.px-button__text,.px-button.px-button__info.px-button__plain,.px-button.px-button__info.px-button__outline{--text-color: var(--px-neutral-10)}.px-button.px-button__info.px-button__text.px-button__disabled,.px-button.px-button__info.px-button__plain.px-button__disabled,.px-button.px-button__info.px-button__outline.px-button__disabled,.px-button.px-button__info.px-button__text:active.px-button__disabled,.px-button.px-button__info.px-button__plain:active.px-button__disabled,.px-button.px-button__info.px-button__outline:active.px-button__disabled,.px-button.px-button__info.px-button__text:hover.px-button__disabled,.px-button.px-button__info.px-button__plain:hover.px-button__disabled,.px-button.px-button__info.px-button__outline:hover.px-button__disabled{--text-color: var(--px-neutral-6)}.px-button.px-button__info.px-button__text:active.px-button__loading,.px-button.px-button__info.px-button__plain:active.px-button__loading,.px-button.px-button__info.px-button__outline:active.px-button__loading,.px-button.px-button__info.px-button__text:hover.px-button__loading,.px-button.px-button__info.px-button__plain:hover.px-button__loading,.px-button.px-button__info.px-button__outline:hover.px-button__loading{--text-color: var(--px-neutral-10)}.px-button.px-button__info.px-button__outline:hover{--text-color: var(--px-neutral-9)}.px-button.px-button__info.px-button__outline:active{--text-color: var(--px-neutral-8)}.px-button.px-button__info .px-button__text:hover{--text-color: var(--px-neutral-7)}.px-button.px-button__info .px-button__text:active{--text-color: var(--px-neutral-8)}.px-link{--text-color: var(--px-neutral-10);display:inline-flex;color:var(--text-color);cursor:pointer;transition:.25s}.px-link-icon-wrapper{margin-right:4px;display:flex;align-items:center}.px-link-icon-wrapper__last{margin-right:0}.px-link-icon{height:14px;width:14px;fill:var(--text-color)}.px-link-icon__loading{animation:px-icon-spin 1s linear infinite}.px-link__loading{cursor:auto}.px-link__disabled{cursor:not-allowed}.px-link.px-link__primary{--text-color: var(--px-primary-6)}.px-link.px-link__primary:focus-visible{outline-color:var(--px-primary-6);outline-offset:var(--px-bit)}.px-link.px-link__primary.px-link__disabled{--text-color: var(--px-primary-2)}.px-link.px-link__primary:active.px-link__loading,.px-link.px-link__primary:hover.px-link__loading{--text-color: var(--px-primary-6)}.px-link.px-link__primary:active.px-link__disabled,.px-link.px-link__primary:hover.px-link__disabled{--text-color: var(--px-primary-2)}.px-link.px-link__primary:hover{--text-color: var(--px-primary-5)}.px-link.px-link__primary:active{--text-color: var(--px-primary-7)}.px-link.px-link__sakura{--text-color: var(--px-sakura-6)}.px-link.px-link__sakura:focus-visible{outline-color:var(--px-sakura-6);outline-offset:var(--px-bit)}.px-link.px-link__sakura.px-link__disabled{--text-color: var(--px-sakura-2)}.px-link.px-link__sakura:active.px-link__loading,.px-link.px-link__sakura:hover.px-link__loading{--text-color: var(--px-sakura-6)}.px-link.px-link__sakura:active.px-link__disabled,.px-link.px-link__sakura:hover.px-link__disabled{--text-color: var(--px-sakura-2)}.px-link.px-link__sakura:hover{--text-color: var(--px-sakura-5)}.px-link.px-link__sakura:active{--text-color: var(--px-sakura-7)}.px-link.px-link__success{--text-color: var(--px-success-6)}.px-link.px-link__success:focus-visible{outline-color:var(--px-success-6);outline-offset:var(--px-bit)}.px-link.px-link__success.px-link__disabled{--text-color: var(--px-success-2)}.px-link.px-link__success:active.px-link__loading,.px-link.px-link__success:hover.px-link__loading{--text-color: var(--px-success-6)}.px-link.px-link__success:active.px-link__disabled,.px-link.px-link__success:hover.px-link__disabled{--text-color: var(--px-success-2)}.px-link.px-link__success:hover{--text-color: var(--px-success-5)}.px-link.px-link__success:active{--text-color: var(--px-success-7)}.px-link.px-link__warning{--text-color: var(--px-warning-6)}.px-link.px-link__warning:focus-visible{outline-color:var(--px-warning-6);outline-offset:var(--px-bit)}.px-link.px-link__warning.px-link__disabled{--text-color: var(--px-warning-2)}.px-link.px-link__warning:active.px-link__loading,.px-link.px-link__warning:hover.px-link__loading{--text-color: var(--px-warning-6)}.px-link.px-link__warning:active.px-link__disabled,.px-link.px-link__warning:hover.px-link__disabled{--text-color: var(--px-warning-2)}.px-link.px-link__warning:hover{--text-color: var(--px-warning-5)}.px-link.px-link__warning:active{--text-color: var(--px-warning-7)}.px-link.px-link__danger{--text-color: var(--px-danger-6)}.px-link.px-link__danger:focus-visible{outline-color:var(--px-danger-6);outline-offset:var(--px-bit)}.px-link.px-link__danger.px-link__disabled{--text-color: var(--px-danger-2)}.px-link.px-link__danger:active.px-link__loading,.px-link.px-link__danger:hover.px-link__loading{--text-color: var(--px-danger-6)}.px-link.px-link__danger:active.px-link__disabled,.px-link.px-link__danger:hover.px-link__disabled{--text-color: var(--px-danger-2)}.px-link.px-link__danger:hover{--text-color: var(--px-danger-5)}.px-link.px-link__danger:active{--text-color: var(--px-danger-7)}.px-link.px-link__info{--text-color: var(--px-neutral-10)}.px-link.px-link__info:focus-visible{outline-color:var(--px-neutral-10);outline-offset:var(--px-bit)}.px-link.px-link__info.px-link__disabled,.px-link.px-link__info:active.px-link__disabled,.px-link.px-link__info:hover.px-link__disabled{--text-color: var(--px-neutral-6)}.px-link.px-link__info:active.px-link__loading,.px-link.px-link__info:hover.px-link__loading{--text-color: var(--px-neutral-10)}.px-link.px-link__info:hover{--text-color: var(--px-neutral-7)}.px-link.px-link__info:active{--text-color: var(--px-neutral-8)}.px-message-canvas{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:-1}.px-message{--text-color: var(--px-neutral-10);color:var(--text-color);position:relative;border-color:transparent;border-width:var(--px-bit);border-style:solid;padding:4px 8px;display:flex;transition:.25s;pointer-events:auto}.px-message-fade-enter-to,.px-message-fade-leave-from{opacity:1;transform:translateY(0)}.px-message-fade-enter-from,.px-message-fade-leave-to{opacity:0;transform:translateY(-20px)}.px-message-icon-wrapper{display:flex;align-items:center;flex-shrink:0;margin-right:8px}.px-message-icon-wrapper svg{width:16px;height:16px;fill:var(--text-color)}.px-message-icon-wrapper svg.px-message-icon__loading{animation:px-icon-spin 1s linear infinite}.px-message-close-wrapper{display:flex;align-items:center;flex-shrink:0;margin-left:8px}.px-message-close-wrapper .px-message-icon{cursor:pointer;width:10px;height:10px;fill:var(--text-color);transition:.25s}.px-message.px-message__sakura{--text-color: var(--px-sakura-6)}.px-message.px-message__sakura .px-message-close-wrapper>.px-message-icon:hover{--text-color: var(--px-sakura-5)}.px-message.px-message__sakura .px-message-close-wrapper>.px-message-icon:active{--text-color: var(--px-sakura-7)}.px-message.px-message__success{--text-color: var(--px-success-6)}.px-message.px-message__success .px-message-close-wrapper>.px-message-icon:hover{--text-color: var(--px-success-5)}.px-message.px-message__success .px-message-close-wrapper>.px-message-icon:active{--text-color: var(--px-success-7)}.px-message.px-message__warning{--text-color: var(--px-warning-6)}.px-message.px-message__warning .px-message-close-wrapper>.px-message-icon:hover{--text-color: var(--px-warning-5)}.px-message.px-message__warning .px-message-close-wrapper>.px-message-icon:active{--text-color: var(--px-warning-7)}.px-message.px-message__info{--text-color: var(--px-primary-6)}.px-message.px-message__info .px-message-close-wrapper>.px-message-icon:hover{--text-color: var(--px-primary-5)}.px-message.px-message__info .px-message-close-wrapper>.px-message-icon:active{--text-color: var(--px-primary-7)}.px-message.px-message__error{--text-color: var(--px-danger-6)}.px-message.px-message__error .px-message-close-wrapper>.px-message-icon:hover:hover{--text-color: var(--px-danger-5)}.px-message.px-message__error .px-message-close-wrapper>.px-message-icon:hover:active{--text-color: var(--px-danger-7)}.px-message.px-message__loading{--text-color: var(--px-neutral-8)}.px-message.px-message__loading .px-message-close-wrapper>.px-message-icon:hover:hover{--text-color: var(--px-neutral-7)}.px-message.px-message__loading .px-message-close-wrapper>.px-message-icon:hover:active{--text-color: var(--px-neutral-9)}.px-message.px-message__normal{--text-color: var(--px-neutral-10)}.px-message.px-message__normal .px-message-close-wrapper>.px-message-icon:hover:hover{--text-color: var(--px-neutral-9)}.px-message.px-message__normal .px-message-close-wrapper>.px-message-icon:hover:active{--text-color: var(--px-neutral-8)}.px-message-box{position:fixed;width:100%;top:0;left:0;bottom:0;right:0;pointer-events:none}.px-message-box-container{padding:0 8px 8px;position:absolute;display:flex;flex-direction:column}.px-message-box-container .px-message{margin-top:16px}.px-message-box-container__top{top:0;left:50%;transform:translate(-50%);align-items:center}.px-message-box-container__top-left{top:0;left:0;align-items:start}.px-message-box-container__top-right{top:0;right:0;align-items:end}.px-message-box-container__bottom{bottom:0;left:50%;transform:translate(-50%);align-items:center}.px-message-box-container__bottom-left{bottom:0;left:0;align-items:start}.px-message-box-container__bottom-right{bottom:0;right:0;align-items:end}.px-row-inner{display:flex}.px-row__wrap{flex-wrap:wrap}.px-row__justify-start{justify-content:flex-start}.px-row__justify-end{justify-content:flex-end}.px-row__justify-center{justify-content:center}.px-row__justify-space-around{justify-content:space-around}.px-row__justify-space-between{justify-content:space-between}.px-row__justify-space-evenly{justify-content:space-evenly}.px-row__align-start{align-items:flex-start}.px-row__align-end{align-items:flex-end}.px-row__align-center{align-items:center}.px-row__align-stretch{align-items:stretch}.px-col{box-sizing:border-box}.px-col__span-0{flex:0 0 0%;width:0%}.px-col__offset-0{margin-left:0%}.px-col__span-1{flex:0 0 4.16666667%;width:4.16666667%}.px-col__offset-1{margin-left:4.16666667%}.px-col__span-2{flex:0 0 8.33333333%;width:8.33333333%}.px-col__offset-2{margin-left:8.33333333%}.px-col__span-3{flex:0 0 12.5%;width:12.5%}.px-col__offset-3{margin-left:12.5%}.px-col__span-4{flex:0 0 16.66666667%;width:16.66666667%}.px-col__offset-4{margin-left:16.66666667%}.px-col__span-5{flex:0 0 20.83333333%;width:20.83333333%}.px-col__offset-5{margin-left:20.83333333%}.px-col__span-6{flex:0 0 25%;width:25%}.px-col__offset-6{margin-left:25%}.px-col__span-7{flex:0 0 29.16666667%;width:29.16666667%}.px-col__offset-7{margin-left:29.16666667%}.px-col__span-8{flex:0 0 33.33333333%;width:33.33333333%}.px-col__offset-8{margin-left:33.33333333%}.px-col__span-9{flex:0 0 37.5%;width:37.5%}.px-col__offset-9{margin-left:37.5%}.px-col__span-10{flex:0 0 41.66666667%;width:41.66666667%}.px-col__offset-10{margin-left:41.66666667%}.px-col__span-11{flex:0 0 45.83333333%;width:45.83333333%}.px-col__offset-11{margin-left:45.83333333%}.px-col__span-12{flex:0 0 50%;width:50%}.px-col__offset-12{margin-left:50%}.px-col__span-13{flex:0 0 54.16666667%;width:54.16666667%}.px-col__offset-13{margin-left:54.16666667%}.px-col__span-14{flex:0 0 58.33333333%;width:58.33333333%}.px-col__offset-14{margin-left:58.33333333%}.px-col__span-15{flex:0 0 62.5%;width:62.5%}.px-col__offset-15{margin-left:62.5%}.px-col__span-16{flex:0 0 66.66666667%;width:66.66666667%}.px-col__offset-16{margin-left:66.66666667%}.px-col__span-17{flex:0 0 70.83333333%;width:70.83333333%}.px-col__offset-17{margin-left:70.83333333%}.px-col__span-18{flex:0 0 75%;width:75%}.px-col__offset-18{margin-left:75%}.px-col__span-19{flex:0 0 79.16666667%;width:79.16666667%}.px-col__offset-19{margin-left:79.16666667%}.px-col__span-20{flex:0 0 83.33333333%;width:83.33333333%}.px-col__offset-20{margin-left:83.33333333%}.px-col__span-21{flex:0 0 87.5%;width:87.5%}.px-col__offset-21{margin-left:87.5%}.px-col__span-22{flex:0 0 91.66666667%;width:91.66666667%}.px-col__offset-22{margin-left:91.66666667%}.px-col__span-23{flex:0 0 95.83333333%;width:95.83333333%}.px-col__offset-23{margin-left:95.83333333%}.px-col__span-24{flex:0 0 100%;width:100%}.px-col__offset-24{margin-left:100%}.px-divider__horizontal{margin-top:16px;margin-bottom:16px;height:0px;border-bottom-width:2px;border-bottom-color:var(--px-neutral-8)}.px-divider__horizontal.px-divider__solid{border-bottom-style:solid}.px-divider__horizontal.px-divider__dashed{border-bottom-style:dashed}.px-divider__horizontal.px-divider__dotted{border-bottom-style:dotted}.px-divider__horizontal.px-divider__double{border-bottom-style:double}.px-divider__horizontal.px-divider__ridge{border-bottom-style:ridge}.px-divider__horizontal.px-divider__groove{border-bottom-style:groove}.px-divider__vertical{margin-left:12px;margin-right:12px;width:0px;height:100%;border-right-width:2px;min-height:1em;border-right-color:var(--px-neutral-8);display:inline-block}.px-divider__vertical.px-divider__solid{border-right-style:solid}.px-divider__vertical.px-divider__dashed{border-right-style:dashed}.px-divider__vertical.px-divider__dotted{border-right-style:dotted}.px-divider__vertical.px-divider__double{border-right-style:double}.px-divider__vertical.px-divider__ridge{border-right-style:ridge}.px-divider__vertical.px-divider__groove{border-right-style:groove}.px-space__inline{display:inline-block}.px-space__justify-start{justify-content:flex-start}.px-space__justify-end{justify-content:flex-end}.px-space__justify-center{justify-content:center}.px-space__justify-space-around{justify-content:space-around}.px-space__justify-space-between{justify-content:space-between}.px-space__justify-space-evenly{justify-content:space-evenly}.px-space__align-start{align-items:flex-start}.px-space__align-end{align-items:flex-end}.px-space__align-center{align-items:center}.px-space__align-stretch{align-items:stretch}.px-space__vertical{flex-direction:column}.px-space-inner{display:flex;margin-top:calc(-1 * var(--px-medium-interval) / 2);margin-bottom:calc(-1 * var(--px-medium-interval) / 2);margin-left:calc(-1 * var(--px-medium-interval) / 2);margin-right:calc(-1 * var(--px-medium-interval) / 2)}.px-space-inner .px-space-item{margin-top:calc(var(--px-medium-interval) / 2);margin-bottom:calc(var(--px-medium-interval) / 2);margin-left:calc(var(--px-medium-interval) / 2);margin-right:calc(var(--px-medium-interval) / 2)}.px-space-inner.px-space__small{margin-top:calc(-1 * var(--px-small-interval) / 2);margin-bottom:calc(-1 * var(--px-small-interval) / 2);margin-left:calc(-1 * var(--px-small-interval) / 2);margin-right:calc(-1 * var(--px-small-interval) / 2)}.px-space-inner.px-space__small .px-space-item{margin-top:calc(var(--px-small-interval) / 2);margin-bottom:calc(var(--px-small-interval) / 2);margin-left:calc(var(--px-small-interval) / 2);margin-right:calc(var(--px-small-interval) / 2)}.px-space-inner.px-space__large{margin-top:calc(-1 * var(--px-large-interval) / 2);margin-bottom:calc(-1 * var(--px-large-interval) / 2);margin-left:calc(-1 * var(--px-large-interval) / 2);margin-right:calc(-1 * var(--px-large-interval) / 2)}.px-space-inner.px-space__large .px-space-item{margin-top:calc(var(--px-large-interval) / 2);margin-bottom:calc(var(--px-large-interval) / 2);margin-left:calc(var(--px-large-interval) / 2);margin-right:calc(var(--px-large-interval) / 2)}.px-space__wrap{flex-wrap:wrap}.px-grid{display:grid}.px-container{display:flex;flex-direction:column;flex:1}.px-container.px-container__has-aside,.px-container.px-container__horizontal{flex-direction:row}.px-container.px-container__vertical{flex-direction:column}.px-main{flex:1;overflow:auto;padding:16px;background-color:var(--px-neutral-1);color:var(--px-neutral-10);width:100%}.px-aside{height:auto;overflow:auto;background-color:var(--px-neutral-1);color:var(--px-neutral-10);width:300px}.px-aside__bordered{border-right:2px solid var(--px-neutral-3)}.px-aside__bordered.px-aside__right{border-right:none;border-left:2px solid var(--px-neutral-3)}.px-aside__dark{background-color:var(--px-neutral-10);color:var(--px-neutral-1)}.px-aside__dark.px-aside__bordered{border-right:2px solid var(--px-neutral-8)}.px-aside__dark.px-aside__bordered.px-aside__right{border-right:none;border-left:2px solid var(--px-neutral-8)}.px-header{width:100%;padding:0 16px;background-color:var(--px-neutral-1);color:var(--px-neutral-10);min-height:64px}.px-header__bordered{border-bottom:2px solid var(--px-neutral-3)}.px-header__dark{background-color:var(--px-neutral-10);color:var(--px-neutral-1)}.px-header__dark.px-header__bordered{border-bottom:2px solid var(--px-neutral-8)}.px-footer{width:100%;padding:0 16px;background-color:var(--px-neutral-1);color:var(--px-neutral-10);min-height:64px}.px-footer__bordered{border-top:2px solid var(--px-neutral-3)}.px-footer__dark{background-color:var(--px-neutral-10);color:var(--px-neutral-1)}.px-footer__dark.px-footer__bordered{border-top:2px solid var(--px-neutral-8)}:root{--px-teal-light-1: rgba(221, 250, 242, 1);--px-teal-light-2: rgba(188, 233, 222, 1);--px-teal-light-3: rgba(155, 217, 202, 1);--px-teal-light-4: rgba(119, 201, 183, 1);--px-teal-light-5: rgba(79, 184, 164, 1);--px-teal-light-6: rgba(0, 168, 145, 1);--px-teal-light-7: rgba(11, 128, 110, 1);--px-teal-light-8: rgba(14, 90, 78, 1);--px-teal-light-9: rgba(11, 55, 47, 1);--px-teal-light-10: rgba(6, 23, 19, 1);--px-green-light-1: rgba(238, 242, 238, 1);--px-green-light-2: rgba(203, 231, 202, 1);--px-green-light-3: rgba(167, 219, 166, 1);--px-green-light-4: rgba(129, 207, 130, 1);--px-green-light-5: rgba(86, 194, 91, 1);--px-green-light-6: rgba(0, 180, 42, 1);--px-green-light-7: rgba(34, 137, 44, 1);--px-green-light-8: rgba(38, 96, 41, 1);--px-green-light-9: rgba(34, 57, 34, 1);--px-green-light-10: rgba(24, 22, 24, 1);--px-orange-light-1: rgba(245, 234, 228, 1);--px-orange-light-2: rgba(250, 214, 193, 1);--px-orange-light-3: rgba(253, 193, 158, 1);--px-orange-light-4: rgba(255, 172, 121, 1);--px-orange-light-5: rgba(255, 149, 80, 1);--px-orange-light-6: rgba(255, 125, 0, 1);--px-orange-light-7: rgba(196, 103, 35, 1);--px-orange-light-8: rgba(140, 80, 42, 1);--px-orange-light-9: rgba(87, 58, 41, 1);--px-orange-light-10: rgba(37, 36, 35, 1);--px-red-light-1: rgba(248, 235, 233, 1);--px-red-light-2: rgba(253, 210, 205, 1);--px-red-light-3: rgba(255, 186, 178, 1);--px-red-light-4: rgba(255, 161, 152, 1);--px-red-light-5: rgba(255, 133, 124, 1);--px-red-light-6: rgba(253, 104, 96, 1);--px-red-light-7: rgba(193, 86, 79, 1);--px-red-light-8: rgba(136, 68, 62, 1);--px-red-light-9: rgba(82, 49, 46, 1);--px-red-light-10: rgba(32, 30, 29, 1);--px-pink-light-1: rgba(250, 223, 228, 1);--px-pink-light-2: rgba(252, 209, 218, 1);--px-pink-light-3: rgba(253, 196, 208, 1);--px-pink-light-4: rgba(255, 182, 198, 1);--px-pink-light-5: rgba(255, 168, 188, 1);--px-pink-light-6: rgba(255, 154, 178, 1);--px-pink-light-7: rgba(204, 126, 144, 1);--px-pink-light-8: rgba(154, 99, 112, 1);--px-pink-light-9: rgba(108, 73, 81, 1);--px-pink-light-10: rgba(65, 48, 52, 1);--px-neutral-light-1: rgba(255, 255, 255, 1);--px-neutral-light-2: rgba(250, 250, 250, 1);--px-neutral-light-3: rgba(245, 245, 245, 1);--px-neutral-light-4: rgba(240, 240, 240, 1);--px-neutral-light-5: rgba(235, 235, 235, 1);--px-neutral-light-6: rgba(230, 230, 230, 1);--px-neutral-light-7: rgba(200, 200, 200, 1);--px-neutral-light-8: rgba(150, 150, 150, 1);--px-neutral-light-9: rgba(100, 100, 100, 1);--px-neutral-light-10: rgba(50, 50, 50, 1);--px-teal-dark-1: rgba(7, 31, 26, 1);--px-teal-dark-2: rgba(11, 55, 47, 1);--px-teal-dark-3: rgba(13, 81, 70, 1);--px-teal-dark-4: rgba(13, 109, 94, 1);--px-teal-dark-5: rgba(9, 138, 119, 1);--px-teal-dark-6: rgba(0, 168, 145, 1);--px-teal-dark-7: rgba(88, 184, 165, 1);--px-teal-dark-8: rgba(132, 201, 185, 1);--px-teal-dark-9: rgba(172, 217, 206, 1);--px-teal-dark-10: rgba(210, 233, 227, 1);--px-green-dark-1: rgba(27, 30, 27, 1);--px-green-dark-2: rgba(34, 57, 34, 1);--px-green-dark-3: rgba(38, 86, 40, 1);--px-green-dark-4: rgba(38, 116, 43, 1);--px-green-dark-5: rgba(30, 147, 44, 1);--px-green-dark-6: rgba(0, 180, 42, 1);--px-green-dark-7: rgba(96, 193, 99, 1);--px-green-dark-8: rgba(144, 204, 144, 1);--px-green-dark-9: rgba(187, 215, 186, 1);--px-green-dark-10: rgba(227, 224, 228, 1);--px-orange-dark-1: rgba(49, 41, 37, 1);--px-orange-dark-2: rgba(87, 58, 41, 1);--px-orange-dark-3: rgba(126, 75, 42, 1);--px-orange-dark-4: rgba(167, 91, 40, 1);--px-orange-dark-5: rgba(210, 108, 31, 1);--px-orange-dark-6: rgba(255, 125, 0, 1);--px-orange-dark-7: rgba(250, 152, 89, 1);--px-orange-dark-8: rgba(242, 175, 135, 1);--px-orange-dark-9: rgba(233, 197, 177, 1);--px-orange-dark-10: rgba(220, 218, 217, 1);--px-red-dark-1: rgba(44, 35, 33, 1);--px-red-dark-2: rgba(82, 49, 46, 1);--px-red-dark-3: rgba(122, 63, 58, 1);--px-red-dark-4: rgba(164, 77, 71, 1);--px-red-dark-5: rgba(208, 90, 83, 1);--px-red-dark-6: rgba(253, 104, 96, 1);--px-red-dark-7: rgba(250, 137, 128, 1);--px-red-dark-8: rgba(245, 167, 158, 1);--px-red-dark-9: rgba(236, 194, 189, 1);--px-red-dark-10: rgba(224, 221, 220, 1);--px-pink-dark-1: rgba(75, 54, 59, 1);--px-pink-dark-2: rgba(108, 73, 81, 1);--px-pink-dark-3: rgba(143, 92, 104, 1);--px-pink-dark-4: rgba(179, 112, 128, 1);--px-pink-dark-5: rgba(216, 133, 152, 1);--px-pink-dark-6: rgba(255, 154, 178, 1);--px-pink-dark-7: rgba(249, 168, 186, 1);--px-pink-dark-8: rgba(243, 181, 194, 1);--px-pink-dark-9: rgba(235, 193, 201, 1);--px-pink-dark-10: rgba(227, 205, 209, 1);--px-neutral-dark-1: rgba(12, 12, 12, 1);--px-neutral-dark-2: rgba(32, 32, 32, 1);--px-neutral-dark-3: rgba(53, 53, 53, 1);--px-neutral-dark-4: rgba(76, 76, 76, 1);--px-neutral-dark-5: rgba(101, 101, 101, 1);--px-neutral-dark-6: rgba(126, 126, 126, 1);--px-neutral-dark-7: rgba(152, 152, 152, 1);--px-neutral-dark-8: rgba(178, 178, 178, 1);--px-neutral-dark-9: rgba(206, 206, 206, 1);--px-neutral-dark-10: rgba(234, 234, 234, 1);--px-primary-light-1: var(--px-teal-light-1);--px-primary-light-2: var(--px-teal-light-2);--px-primary-light-3: var(--px-teal-light-3);--px-primary-light-4: var(--px-teal-light-4);--px-primary-light-5: var(--px-teal-light-5);--px-primary-light-6: var(--px-teal-light-6);--px-primary-light-7: var(--px-teal-light-7);--px-primary-light-8: var(--px-teal-light-8);--px-primary-light-9: var(--px-teal-light-9);--px-primary-light-10: var(--px-teal-light-10);--px-success-light-1: var(--px-green-light-1);--px-success-light-2: var(--px-green-light-2);--px-success-light-3: var(--px-green-light-3);--px-success-light-4: var(--px-green-light-4);--px-success-light-5: var(--px-green-light-5);--px-success-light-6: var(--px-green-light-6);--px-success-light-7: var(--px-green-light-7);--px-success-light-8: var(--px-green-light-8);--px-success-light-9: var(--px-green-light-9);--px-success-light-10: var(--px-green-light-10);--px-warning-light-1: var(--px-orange-light-1);--px-warning-light-2: var(--px-orange-light-2);--px-warning-light-3: var(--px-orange-light-3);--px-warning-light-4: var(--px-orange-light-4);--px-warning-light-5: var(--px-orange-light-5);--px-warning-light-6: var(--px-orange-light-6);--px-warning-light-7: var(--px-orange-light-7);--px-warning-light-8: var(--px-orange-light-8);--px-warning-light-9: var(--px-orange-light-9);--px-warning-light-10: var(--px-orange-light-10);--px-danger-light-1: var(--px-red-light-1);--px-danger-light-2: var(--px-red-light-2);--px-danger-light-3: var(--px-red-light-3);--px-danger-light-4: var(--px-red-light-4);--px-danger-light-5: var(--px-red-light-5);--px-danger-light-6: var(--px-red-light-6);--px-danger-light-7: var(--px-red-light-7);--px-danger-light-8: var(--px-red-light-8);--px-danger-light-9: var(--px-red-light-9);--px-danger-light-10: var(--px-red-light-10);--px-sakura-light-1: var(--px-pink-light-1);--px-sakura-light-2: var(--px-pink-light-2);--px-sakura-light-3: var(--px-pink-light-3);--px-sakura-light-4: var(--px-pink-light-4);--px-sakura-light-5: var(--px-pink-light-5);--px-sakura-light-6: var(--px-pink-light-6);--px-sakura-light-7: var(--px-pink-light-7);--px-sakura-light-8: var(--px-pink-light-8);--px-sakura-light-9: var(--px-pink-light-9);--px-sakura-light-10: var(--px-pink-light-10);--px-primary-dark-1: var(--px-teal-dark-1);--px-primary-dark-2: var(--px-teal-dark-2);--px-primary-dark-3: var(--px-teal-dark-3);--px-primary-dark-4: var(--px-teal-dark-4);--px-primary-dark-5: var(--px-teal-dark-5);--px-primary-dark-6: var(--px-teal-dark-6);--px-primary-dark-7: var(--px-teal-dark-7);--px-primary-dark-8: var(--px-teal-dark-8);--px-primary-dark-9: var(--px-teal-dark-9);--px-primary-dark-10: var(--px-teal-dark-10);--px-success-dark-1: var(--px-green-dark-1);--px-success-dark-2: var(--px-green-dark-2);--px-success-dark-3: var(--px-green-dark-3);--px-success-dark-4: var(--px-green-dark-4);--px-success-dark-5: var(--px-green-dark-5);--px-success-dark-6: var(--px-green-dark-6);--px-success-dark-7: var(--px-green-dark-7);--px-success-dark-8: var(--px-green-dark-8);--px-success-dark-9: var(--px-green-dark-9);--px-success-dark-10: var(--px-green-dark-10);--px-warning-dark-1: var(--px-orange-dark-1);--px-warning-dark-2: var(--px-orange-dark-2);--px-warning-dark-3: var(--px-orange-dark-3);--px-warning-dark-4: var(--px-orange-dark-4);--px-warning-dark-5: var(--px-orange-dark-5);--px-warning-dark-6: var(--px-orange-dark-6);--px-warning-dark-7: var(--px-orange-dark-7);--px-warning-dark-8: var(--px-orange-dark-8);--px-warning-dark-9: var(--px-orange-dark-9);--px-warning-dark-10: var(--px-orange-dark-10);--px-danger-dark-1: var(--px-red-dark-1);--px-danger-dark-2: var(--px-red-dark-2);--px-danger-dark-3: var(--px-red-dark-3);--px-danger-dark-4: var(--px-red-dark-4);--px-danger-dark-5: var(--px-red-dark-5);--px-danger-dark-6: var(--px-red-dark-6);--px-danger-dark-7: var(--px-red-dark-7);--px-danger-dark-8: var(--px-red-dark-8);--px-danger-dark-9: var(--px-red-dark-9);--px-danger-dark-10: var(--px-red-dark-10);--px-sakura-dark-1: var(--px-pink-dark-1);--px-sakura-dark-2: var(--px-pink-dark-2);--px-sakura-dark-3: var(--px-pink-dark-3);--px-sakura-dark-4: var(--px-pink-dark-4);--px-sakura-dark-5: var(--px-pink-dark-5);--px-sakura-dark-6: var(--px-pink-dark-6);--px-sakura-dark-7: var(--px-pink-dark-7);--px-sakura-dark-8: var(--px-pink-dark-8);--px-sakura-dark-9: var(--px-pink-dark-9);--px-sakura-dark-10: var(--px-pink-dark-10);--px-primary-1: var(--px-primary-light-custom-1, var(--px-teal-light-1));--px-primary-2: var(--px-primary-light-custom-2, var(--px-teal-light-2));--px-primary-3: var(--px-primary-light-custom-3, var(--px-teal-light-3));--px-primary-4: var(--px-primary-light-custom-4, var(--px-teal-light-4));--px-primary-5: var(--px-primary-light-custom-5, var(--px-teal-light-5));--px-primary-6: var(--px-primary-light-custom-6, var(--px-teal-light-6));--px-primary-7: var(--px-primary-light-custom-7, var(--px-teal-light-7));--px-primary-8: var(--px-primary-light-custom-8, var(--px-teal-light-8));--px-primary-9: var(--px-primary-light-custom-9, var(--px-teal-light-9));--px-primary-10: var(--px-primary-light-custom-10, var(--px-teal-light-10));--px-success-1: var(--px-success-light-custom-1, var(--px-green-light-1));--px-success-2: var(--px-success-light-custom-2, var(--px-green-light-2));--px-success-3: var(--px-success-light-custom-3, var(--px-green-light-3));--px-success-4: var(--px-success-light-custom-4, var(--px-green-light-4));--px-success-5: var(--px-success-light-custom-5, var(--px-green-light-5));--px-success-6: var(--px-success-light-custom-6, var(--px-green-light-6));--px-success-7: var(--px-success-light-custom-7, var(--px-green-light-7));--px-success-8: var(--px-success-light-custom-8, var(--px-green-light-8));--px-success-9: var(--px-success-light-custom-9, var(--px-green-light-9));--px-success-10: var(--px-success-light-custom-10, var(--px-green-light-10));--px-warning-1: var(--px-warning-light-custom-1, var(--px-orange-light-1));--px-warning-2: var(--px-warning-light-custom-2, var(--px-orange-light-2));--px-warning-3: var(--px-warning-light-custom-3, var(--px-orange-light-3));--px-warning-4: var(--px-warning-light-custom-4, var(--px-orange-light-4));--px-warning-5: var(--px-warning-light-custom-5, var(--px-orange-light-5));--px-warning-6: var(--px-warning-light-custom-6, var(--px-orange-light-6));--px-warning-7: var(--px-warning-light-custom-7, var(--px-orange-light-7));--px-warning-8: var(--px-warning-light-custom-8, var(--px-orange-light-8));--px-warning-9: var(--px-warning-light-custom-9, var(--px-orange-light-9));--px-warning-10: var(--px-warning-light-custom-10, var(--px-orange-light-10));--px-danger-1: var(--px-danger-light-custom-1, var(--px-red-light-1));--px-danger-2: var(--px-danger-light-custom-2, var(--px-red-light-2));--px-danger-3: var(--px-danger-light-custom-3, var(--px-red-light-3));--px-danger-4: var(--px-danger-light-custom-4, var(--px-red-light-4));--px-danger-5: var(--px-danger-light-custom-5, var(--px-red-light-5));--px-danger-6: var(--px-danger-light-custom-6, var(--px-red-light-6));--px-danger-7: var(--px-danger-light-custom-7, var(--px-red-light-7));--px-danger-8: var(--px-danger-light-custom-8, var(--px-red-light-8));--px-danger-9: var(--px-danger-light-custom-9, var(--px-red-light-9));--px-danger-10: var(--px-danger-light-custom-10, var(--px-red-light-10));--px-sakura-1: var(--px-sakura-light-custom-1, var(--px-pink-light-1));--px-sakura-2: var(--px-sakura-light-custom-2, var(--px-pink-light-2));--px-sakura-3: var(--px-sakura-light-custom-3, var(--px-pink-light-3));--px-sakura-4: var(--px-sakura-light-custom-4, var(--px-pink-light-4));--px-sakura-5: var(--px-sakura-light-custom-5, var(--px-pink-light-5));--px-sakura-6: var(--px-sakura-light-custom-6, var(--px-pink-light-6));--px-sakura-7: var(--px-sakura-light-custom-7, var(--px-pink-light-7));--px-sakura-8: var(--px-sakura-light-custom-8, var(--px-pink-light-8));--px-sakura-9: var(--px-sakura-light-custom-9, var(--px-pink-light-9));--px-sakura-10: var(--px-sakura-light-custom-10, var(--px-pink-light-10));--px-neutral-1: var(--px-neutral-light-custom-1, var(--px-neutral-light-1));--px-neutral-2: var(--px-neutral-light-custom-2, var(--px-neutral-light-2));--px-neutral-3: var(--px-neutral-light-custom-3, var(--px-neutral-light-3));--px-neutral-4: var(--px-neutral-light-custom-4, var(--px-neutral-light-4));--px-neutral-5: var(--px-neutral-light-custom-5, var(--px-neutral-light-5));--px-neutral-6: var(--px-neutral-light-custom-6, var(--px-neutral-light-6));--px-neutral-7: var(--px-neutral-light-custom-7, var(--px-neutral-light-7));--px-neutral-8: var(--px-neutral-light-custom-8, var(--px-neutral-light-8));--px-neutral-9: var(--px-neutral-light-custom-9, var(--px-neutral-light-9));--px-neutral-10: var(--px-neutral-light-custom-10, var(--px-neutral-light-10))}@media (prefers-color-scheme: dark){:root{--px-primary-1: var(--px-primary-dark-custom-1, var(--px-teal-dark-1));--px-primary-2: var(--px-primary-dark-custom-2, var(--px-teal-dark-2));--px-primary-3: var(--px-primary-dark-custom-3, var(--px-teal-dark-3));--px-primary-4: var(--px-primary-dark-custom-4, var(--px-teal-dark-4));--px-primary-5: var(--px-primary-dark-custom-5, var(--px-teal-dark-5));--px-primary-6: var(--px-primary-dark-custom-6, var(--px-teal-dark-6));--px-primary-7: var(--px-primary-dark-custom-7, var(--px-teal-dark-7));--px-primary-8: var(--px-primary-dark-custom-8, var(--px-teal-dark-8));--px-primary-9: var(--px-primary-dark-custom-9, var(--px-teal-dark-9));--px-primary-10: var(--px-primary-dark-custom-10, var(--px-teal-dark-10));--px-success-1: var(--px-success-dark-custom-1, var(--px-green-dark-1));--px-success-2: var(--px-success-dark-custom-2, var(--px-green-dark-2));--px-success-3: var(--px-success-dark-custom-3, var(--px-green-dark-3));--px-success-4: var(--px-success-dark-custom-4, var(--px-green-dark-4));--px-success-5: var(--px-success-dark-custom-5, var(--px-green-dark-5));--px-success-6: var(--px-success-dark-custom-6, var(--px-green-dark-6));--px-success-7: var(--px-success-dark-custom-7, var(--px-green-dark-7));--px-success-8: var(--px-success-dark-custom-8, var(--px-green-dark-8));--px-success-9: var(--px-success-dark-custom-9, var(--px-green-dark-9));--px-success-10: var(--px-success-dark-custom-10, var(--px-green-dark-10));--px-warning-1: var(--px-warning-dark-custom-1, var(--px-orange-dark-1));--px-warning-2: var(--px-warning-dark-custom-2, var(--px-orange-dark-2));--px-warning-3: var(--px-warning-dark-custom-3, var(--px-orange-dark-3));--px-warning-4: var(--px-warning-dark-custom-4, var(--px-orange-dark-4));--px-warning-5: var(--px-warning-dark-custom-5, var(--px-orange-dark-5));--px-warning-6: var(--px-warning-dark-custom-6, var(--px-orange-dark-6));--px-warning-7: var(--px-warning-dark-custom-7, var(--px-orange-dark-7));--px-warning-8: var(--px-warning-dark-custom-8, var(--px-orange-dark-8));--px-warning-9: var(--px-warning-dark-custom-9, var(--px-orange-dark-9));--px-warning-10: var(--px-warning-dark-custom-10, var(--px-orange-dark-10));--px-danger-1: var(--px-danger-dark-custom-1, var(--px-red-dark-1));--px-danger-2: var(--px-danger-dark-custom-2, var(--px-red-dark-2));--px-danger-3: var(--px-danger-dark-custom-3, var(--px-red-dark-3));--px-danger-4: var(--px-danger-dark-custom-4, var(--px-red-dark-4));--px-danger-5: var(--px-danger-dark-custom-5, var(--px-red-dark-5));--px-danger-6: var(--px-danger-dark-custom-6, var(--px-red-dark-6));--px-danger-7: var(--px-danger-dark-custom-7, var(--px-red-dark-7));--px-danger-8: var(--px-danger-dark-custom-8, var(--px-red-dark-8));--px-danger-9: var(--px-danger-dark-custom-9, var(--px-red-dark-9));--px-danger-10: var(--px-danger-dark-custom-10, var(--px-red-dark-10));--px-sakura-1: var(--px-sakura-dark-custom-1, var(--px-pink-dark-1));--px-sakura-2: var(--px-sakura-dark-custom-2, var(--px-pink-dark-2));--px-sakura-3: var(--px-sakura-dark-custom-3, var(--px-pink-dark-3));--px-sakura-4: var(--px-sakura-dark-custom-4, var(--px-pink-dark-4));--px-sakura-5: var(--px-sakura-dark-custom-5, var(--px-pink-dark-5));--px-sakura-6: var(--px-sakura-dark-custom-6, var(--px-pink-dark-6));--px-sakura-7: var(--px-sakura-dark-custom-7, var(--px-pink-dark-7));--px-sakura-8: var(--px-sakura-dark-custom-8, var(--px-pink-dark-8));--px-sakura-9: var(--px-sakura-dark-custom-9, var(--px-pink-dark-9));--px-sakura-10: var(--px-sakura-dark-custom-10, var(--px-pink-dark-10));--px-neutral-1: var(--px-neutral-dark-custom-1, var(--px-neutral-dark-1));--px-neutral-2: var(--px-neutral-dark-custom-2, var(--px-neutral-dark-2));--px-neutral-3: var(--px-neutral-dark-custom-3, var(--px-neutral-dark-3));--px-neutral-4: var(--px-neutral-dark-custom-4, var(--px-neutral-dark-4));--px-neutral-5: var(--px-neutral-dark-custom-5, var(--px-neutral-dark-5));--px-neutral-6: var(--px-neutral-dark-custom-6, var(--px-neutral-dark-6));--px-neutral-7: var(--px-neutral-dark-custom-7, var(--px-neutral-dark-7));--px-neutral-8: var(--px-neutral-dark-custom-8, var(--px-neutral-dark-8));--px-neutral-9: var(--px-neutral-dark-custom-9, var(--px-neutral-dark-9));--px-neutral-10: var(--px-neutral-dark-custom-10, var(--px-neutral-dark-10))}}:root.dark{--px-primary-1: var(--px-primary-dark-custom-1, var(--px-teal-dark-1));--px-primary-2: var(--px-primary-dark-custom-2, var(--px-teal-dark-2));--px-primary-3: var(--px-primary-dark-custom-3, var(--px-teal-dark-3));--px-primary-4: var(--px-primary-dark-custom-4, var(--px-teal-dark-4));--px-primary-5: var(--px-primary-dark-custom-5, var(--px-teal-dark-5));--px-primary-6: var(--px-primary-dark-custom-6, var(--px-teal-dark-6));--px-primary-7: var(--px-primary-dark-custom-7, var(--px-teal-dark-7));--px-primary-8: var(--px-primary-dark-custom-8, var(--px-teal-dark-8));--px-primary-9: var(--px-primary-dark-custom-9, var(--px-teal-dark-9));--px-primary-10: var(--px-primary-dark-custom-10, var(--px-teal-dark-10));--px-success-1: var(--px-success-dark-custom-1, var(--px-green-dark-1));--px-success-2: var(--px-success-dark-custom-2, var(--px-green-dark-2));--px-success-3: var(--px-success-dark-custom-3, var(--px-green-dark-3));--px-success-4: var(--px-success-dark-custom-4, var(--px-green-dark-4));--px-success-5: var(--px-success-dark-custom-5, var(--px-green-dark-5));--px-success-6: var(--px-success-dark-custom-6, var(--px-green-dark-6));--px-success-7: var(--px-success-dark-custom-7, var(--px-green-dark-7));--px-success-8: var(--px-success-dark-custom-8, var(--px-green-dark-8));--px-success-9: var(--px-success-dark-custom-9, var(--px-green-dark-9));--px-success-10: var(--px-success-dark-custom-10, var(--px-green-dark-10));--px-warning-1: var(--px-warning-dark-custom-1, var(--px-orange-dark-1));--px-warning-2: var(--px-warning-dark-custom-2, var(--px-orange-dark-2));--px-warning-3: var(--px-warning-dark-custom-3, var(--px-orange-dark-3));--px-warning-4: var(--px-warning-dark-custom-4, var(--px-orange-dark-4));--px-warning-5: var(--px-warning-dark-custom-5, var(--px-orange-dark-5));--px-warning-6: var(--px-warning-dark-custom-6, var(--px-orange-dark-6));--px-warning-7: var(--px-warning-dark-custom-7, var(--px-orange-dark-7));--px-warning-8: var(--px-warning-dark-custom-8, var(--px-orange-dark-8));--px-warning-9: var(--px-warning-dark-custom-9, var(--px-orange-dark-9));--px-warning-10: var(--px-warning-dark-custom-10, var(--px-orange-dark-10));--px-danger-1: var(--px-danger-dark-custom-1, var(--px-red-dark-1));--px-danger-2: var(--px-danger-dark-custom-2, var(--px-red-dark-2));--px-danger-3: var(--px-danger-dark-custom-3, var(--px-red-dark-3));--px-danger-4: var(--px-danger-dark-custom-4, var(--px-red-dark-4));--px-danger-5: var(--px-danger-dark-custom-5, var(--px-red-dark-5));--px-danger-6: var(--px-danger-dark-custom-6, var(--px-red-dark-6));--px-danger-7: var(--px-danger-dark-custom-7, var(--px-red-dark-7));--px-danger-8: var(--px-danger-dark-custom-8, var(--px-red-dark-8));--px-danger-9: var(--px-danger-dark-custom-9, var(--px-red-dark-9));--px-danger-10: var(--px-danger-dark-custom-10, var(--px-red-dark-10));--px-sakura-1: var(--px-sakura-dark-custom-1, var(--px-pink-dark-1));--px-sakura-2: var(--px-sakura-dark-custom-2, var(--px-pink-dark-2));--px-sakura-3: var(--px-sakura-dark-custom-3, var(--px-pink-dark-3));--px-sakura-4: var(--px-sakura-dark-custom-4, var(--px-pink-dark-4));--px-sakura-5: var(--px-sakura-dark-custom-5, var(--px-pink-dark-5));--px-sakura-6: var(--px-sakura-dark-custom-6, var(--px-pink-dark-6));--px-sakura-7: var(--px-sakura-dark-custom-7, var(--px-pink-dark-7));--px-sakura-8: var(--px-sakura-dark-custom-8, var(--px-pink-dark-8));--px-sakura-9: var(--px-sakura-dark-custom-9, var(--px-pink-dark-9));--px-sakura-10: var(--px-sakura-dark-custom-10, var(--px-pink-dark-10));--px-neutral-1: var(--px-neutral-dark-custom-1, var(--px-neutral-dark-1));--px-neutral-2: var(--px-neutral-dark-custom-2, var(--px-neutral-dark-2));--px-neutral-3: var(--px-neutral-dark-custom-3, var(--px-neutral-dark-3));--px-neutral-4: var(--px-neutral-dark-custom-4, var(--px-neutral-dark-4));--px-neutral-5: var(--px-neutral-dark-custom-5, var(--px-neutral-dark-5));--px-neutral-6: var(--px-neutral-dark-custom-6, var(--px-neutral-dark-6));--px-neutral-7: var(--px-neutral-dark-custom-7, var(--px-neutral-dark-7));--px-neutral-8: var(--px-neutral-dark-custom-8, var(--px-neutral-dark-8));--px-neutral-9: var(--px-neutral-dark-custom-9, var(--px-neutral-dark-9));--px-neutral-10: var(--px-neutral-dark-custom-10, var(--px-neutral-dark-10))}:root.light{--px-primary-1: var(--px-primary-light-custom-1, var(--px-teal-light-1));--px-primary-2: var(--px-primary-light-custom-2, var(--px-teal-light-2));--px-primary-3: var(--px-primary-light-custom-3, var(--px-teal-light-3));--px-primary-4: var(--px-primary-light-custom-4, var(--px-teal-light-4));--px-primary-5: var(--px-primary-light-custom-5, var(--px-teal-light-5));--px-primary-6: var(--px-primary-light-custom-6, var(--px-teal-light-6));--px-primary-7: var(--px-primary-light-custom-7, var(--px-teal-light-7));--px-primary-8: var(--px-primary-light-custom-8, var(--px-teal-light-8));--px-primary-9: var(--px-primary-light-custom-9, var(--px-teal-light-9));--px-primary-10: var(--px-primary-light-custom-10, var(--px-teal-light-10));--px-success-1: var(--px-success-light-custom-1, var(--px-green-light-1));--px-success-2: var(--px-success-light-custom-2, var(--px-green-light-2));--px-success-3: var(--px-success-light-custom-3, var(--px-green-light-3));--px-success-4: var(--px-success-light-custom-4, var(--px-green-light-4));--px-success-5: var(--px-success-light-custom-5, var(--px-green-light-5));--px-success-6: var(--px-success-light-custom-6, var(--px-green-light-6));--px-success-7: var(--px-success-light-custom-7, var(--px-green-light-7));--px-success-8: var(--px-success-light-custom-8, var(--px-green-light-8));--px-success-9: var(--px-success-light-custom-9, var(--px-green-light-9));--px-success-10: var(--px-success-light-custom-10, var(--px-green-light-10));--px-warning-1: var(--px-warning-light-custom-1, var(--px-orange-light-1));--px-warning-2: var(--px-warning-light-custom-2, var(--px-orange-light-2));--px-warning-3: var(--px-warning-light-custom-3, var(--px-orange-light-3));--px-warning-4: var(--px-warning-light-custom-4, var(--px-orange-light-4));--px-warning-5: var(--px-warning-light-custom-5, var(--px-orange-light-5));--px-warning-6: var(--px-warning-light-custom-6, var(--px-orange-light-6));--px-warning-7: var(--px-warning-light-custom-7, var(--px-orange-light-7));--px-warning-8: var(--px-warning-light-custom-8, var(--px-orange-light-8));--px-warning-9: var(--px-warning-light-custom-9, var(--px-orange-light-9));--px-warning-10: var(--px-warning-light-custom-10, var(--px-orange-light-10));--px-danger-1: var(--px-danger-light-custom-1, var(--px-red-light-1));--px-danger-2: var(--px-danger-light-custom-2, var(--px-red-light-2));--px-danger-3: var(--px-danger-light-custom-3, var(--px-red-light-3));--px-danger-4: var(--px-danger-light-custom-4, var(--px-red-light-4));--px-danger-5: var(--px-danger-light-custom-5, var(--px-red-light-5));--px-danger-6: var(--px-danger-light-custom-6, var(--px-red-light-6));--px-danger-7: var(--px-danger-light-custom-7, var(--px-red-light-7));--px-danger-8: var(--px-danger-light-custom-8, var(--px-red-light-8));--px-danger-9: var(--px-danger-light-custom-9, var(--px-red-light-9));--px-danger-10: var(--px-danger-light-custom-10, var(--px-red-light-10));--px-sakura-1: var(--px-sakura-light-custom-1, var(--px-pink-light-1));--px-sakura-2: var(--px-sakura-light-custom-2, var(--px-pink-light-2));--px-sakura-3: var(--px-sakura-light-custom-3, var(--px-pink-light-3));--px-sakura-4: var(--px-sakura-light-custom-4, var(--px-pink-light-4));--px-sakura-5: var(--px-sakura-light-custom-5, var(--px-pink-light-5));--px-sakura-6: var(--px-sakura-light-custom-6, var(--px-pink-light-6));--px-sakura-7: var(--px-sakura-light-custom-7, var(--px-pink-light-7));--px-sakura-8: var(--px-sakura-light-custom-8, var(--px-pink-light-8));--px-sakura-9: var(--px-sakura-light-custom-9, var(--px-pink-light-9));--px-sakura-10: var(--px-sakura-light-custom-10, var(--px-pink-light-10));--px-neutral-1: var(--px-neutral-light-custom-1, var(--px-neutral-light-1));--px-neutral-2: var(--px-neutral-light-custom-2, var(--px-neutral-light-2));--px-neutral-3: var(--px-neutral-light-custom-3, var(--px-neutral-light-3));--px-neutral-4: var(--px-neutral-light-custom-4, var(--px-neutral-light-4));--px-neutral-5: var(--px-neutral-light-custom-5, var(--px-neutral-light-5));--px-neutral-6: var(--px-neutral-light-custom-6, var(--px-neutral-light-6));--px-neutral-7: var(--px-neutral-light-custom-7, var(--px-neutral-light-7));--px-neutral-8: var(--px-neutral-light-custom-8, var(--px-neutral-light-8));--px-neutral-9: var(--px-neutral-light-custom-9, var(--px-neutral-light-9));--px-neutral-10: var(--px-neutral-light-custom-10, var(--px-neutral-light-10))}:root{--px-large-size: 40px;--px-medium-size: 32px;--px-small-size: 24px;--px-bit: 4px;--px-line-height: 1.5;--px-medium-font-size: 14px;--px-large-font-size: 16px;--px-small-font-size: 12px;--px-medium-interval: 8px;--px-large-interval: 12px;--px-small-interval: 4px}@keyframes px-icon-spin{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.pixelium{font-family:Fusion Pixel Zh_hans,sans-serif;line-height:var(--px-line-height);font-size:var(--px-medium-font-size)}.px-icon{display:inline-flex;align-items:center;justify-content:center}.px-icon__spin{animation:px-icon-spin 1s linear infinite}