@glycanage/web-components 1.211.0 → 1.213.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{c as W,S as F,i as G,f as J,s as K,a as O,e as
|
|
2
|
-
`),n=
|
|
3
|
-
percentile:`),B=$(),
|
|
1
|
+
import{c as W,S as F,i as G,f as J,s as K,a as O,e as a,m as f,b as $,p as t,n as h,g as P,q as e,r as D,u as I,k as Q}from"./index2.js";import{s as R,j as U}from"./helpers.js";function V(l){O(l,"svelte-hkglp",".biological-age-rank.svelte-hkglp{font-family:inherit}.title.svelte-hkglp{margin:0 0 0.5rem 0;font-size:0.8rem;color:#575756;text-align:center;width:100%}.title-percentile.svelte-hkglp{font-weight:600;margin:0 0.15rem}.graph-card.svelte-hkglp{font-family:inherit;display:flex;flex-direction:column;justify-content:center;align-items:center;width:560px;height:133px;padding:52px 1.25rem 1rem;border-radius:8px;border:1px solid #e0e0e0;box-sizing:border-box}.bubble.svelte-hkglp{position:absolute;bottom:18px;display:inline-block;transform:translateX(-50%)}.bubble-text.svelte-hkglp{display:block;padding:0.35rem 0.75rem;background:#008f8c;color:#fff;font-weight:bold;font-size:0.875rem;border-radius:6px;white-space:nowrap;box-shadow:0 1px 3px rgba(0, 0, 0, 0.15)}.bubble-arrow.svelte-hkglp{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #008f8c}.bar-wrap.svelte-hkglp{position:relative;width:-moz-fit-content;width:fit-content;max-width:100%;margin-bottom:8px}.slider-bar.svelte-hkglp{display:flex;gap:2px;width:-moz-fit-content;width:fit-content}.colorBox.svelte-hkglp,.colorBoxShort.svelte-hkglp{height:7px;flex-shrink:0;border-radius:24px}.colorBoxShort.svelte-hkglp{width:16px}.colorBox.svelte-hkglp{width:64px}.seg-1.svelte-hkglp{background-color:#005566}.seg-2.svelte-hkglp{background-color:#005566}.seg-3.svelte-hkglp{background-color:#119999}.seg-4.svelte-hkglp,.seg-5.svelte-hkglp{background-color:#66CCAA}.seg-6.svelte-hkglp{background-color:#EE6600}.seg-7.svelte-hkglp{background-color:#DD2222}.seg-8.svelte-hkglp{background-color:#DD2222}.median-triangle.svelte-hkglp{position:absolute;bottom:-10px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:8px solid #5dade2;pointer-events:none;z-index:0}.marker-triangle.svelte-hkglp{position:absolute;bottom:-2px;transform:translateX(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;pointer-events:none;z-index:1}.labels.svelte-hkglp{display:flex;gap:2px;width:-moz-fit-content;width:fit-content;font-size:0.7rem;color:#9e9e9e;align-items:center}.label.svelte-hkglp{text-align:center;flex-shrink:0;box-sizing:border-box;border-left:1px solid #d0d0d0;padding:0 4px}.label-worse.svelte-hkglp{border-right:1px solid #d0d0d0}.label-better.svelte-hkglp{width:148px}.label-average.svelte-hkglp{width:130px}.label-worse.svelte-hkglp{width:148px}")}function Y(l){let r,o,k,n,d=Math.round(l[1])+"",x,m,c,B,g,p,b,u,y=Math.round(l[1])+"",X,A,j,C,E,H,z,L,w,T,v,q,M,S;return{c(){r=a("div"),o=a("p"),k=f(`Biological age ranks in the
|
|
2
|
+
`),n=a("span"),x=f(d),m=f(l[3]),c=f(`
|
|
3
|
+
percentile:`),B=$(),g=a("div"),p=a("div"),b=a("div"),u=a("span"),X=f(y),A=f(l[3]),j=f(" percentile"),C=$(),E=a("div"),H=$(),z=a("div"),z.innerHTML='<div class="colorBoxShort seg-1 svelte-hkglp"></div> <div class="colorBox seg-2 svelte-hkglp"></div> <div class="colorBox seg-3 svelte-hkglp"></div> <div class="colorBox seg-4 svelte-hkglp"></div> <div class="colorBox seg-5 svelte-hkglp"></div> <div class="colorBox seg-6 svelte-hkglp"></div> <div class="colorBox seg-7 svelte-hkglp"></div> <div class="colorBoxShort seg-8 svelte-hkglp"></div>',L=$(),w=a("div"),T=$(),v=a("div"),q=$(),M=a("div"),M.innerHTML='<span class="label label-better svelte-hkglp">Better than peers</span> <span class="label label-average svelte-hkglp">Average/Median</span> <span class="label label-worse svelte-hkglp">Worse than peers</span>',t(n,"class","title-percentile svelte-hkglp"),h(n,"color",l[2]),t(o,"class","title svelte-hkglp"),t(u,"class","bubble-text svelte-hkglp"),t(E,"class","bubble-arrow svelte-hkglp"),t(b,"class","bubble svelte-hkglp"),h(b,"left",l[0]+"%"),t(z,"class","slider-bar svelte-hkglp"),t(w,"class","median-triangle svelte-hkglp"),h(w,"left","50%"),t(w,"aria-hidden","true"),t(w,"title","50th percentile (median)"),t(v,"class","marker-triangle svelte-hkglp"),h(v,"left",l[0]+"%"),h(v,"border-bottom-color",l[2]),t(v,"aria-hidden","true"),t(p,"class","bar-wrap svelte-hkglp"),t(M,"class","labels svelte-hkglp"),t(g,"class","graph-card svelte-hkglp"),t(g,"role","img"),t(g,"aria-label",S="Biological age rank in the "+Math.round(l[1])+l[3]+" percentile, from better than peers to worse than peers"),t(r,"class","biological-age-rank svelte-hkglp")},m(s,i){P(s,r,i),e(r,o),e(o,k),e(o,n),e(n,x),e(n,m),e(o,c),e(r,B),e(r,g),e(g,p),e(p,b),e(b,u),e(u,X),e(u,A),e(u,j),e(b,C),e(b,E),e(p,H),e(p,z),e(p,L),e(p,w),e(p,T),e(p,v),e(g,q),e(g,M)},p(s,[i]){i&2&&d!==(d=Math.round(s[1])+"")&&D(x,d),i&8&&D(m,s[3]),i&4&&h(n,"color",s[2]),i&2&&y!==(y=Math.round(s[1])+"")&&D(X,y),i&8&&D(A,s[3]),i&1&&h(b,"left",s[0]+"%"),i&1&&h(v,"left",s[0]+"%"),i&4&&h(v,"border-bottom-color",s[2]),i&10&&S!==(S="Biological age rank in the "+Math.round(s[1])+s[3]+" percentile, from better than peers to worse than peers")&&t(g,"aria-label",S)},i:I,o:I,d(s){s&&Q(r)}}}function Z(l,r,o){let k,n,d,x,m,{percentile:c=50}=r;return l.$$set=B=>{"percentile"in B&&o(4,c=B.percentile)},l.$$.update=()=>{l.$$.dirty&16&&o(1,k=typeof c=="string"?parseInt(c,10):Number(c)),l.$$.dirty&2&&o(3,n=R(Math.round(k),"english")),l.$$.dirty&2&&o(0,d=U(k)),l.$$.dirty&1&&o(5,x=d<34.5?"better":d<64.5?"average":"worse"),l.$$.dirty&32&&o(2,m=x==="worse"?"#d92429":"#008f8c")},[d,k,m,n,c,x]}class N extends F{constructor(r){super(),G(this,r,Z,Y,K,{percentile:4},V)}get percentile(){return this.$$.ctx[4]}set percentile(r){this.$$set({percentile:r}),J()}}customElements.define("ga-biological-age-rank",W(N,{percentile:{}},[],[],!0));export{N as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{c as
|
|
1
|
+
import{c as W,S as M,i as O,f as D,s as G,e as b,b as T,n as t,p as L,g as k,q as f,u as C,k as P,o as I,A as B}from"./index2.js";import{g as H}from"./globals.js";import{f as g}from"./helpers.js";const{document:V}=H;function q(v){let o,x,h,s,d,e,i,y;return{c(){o=b("div"),x=b("div"),h=T(),s=b("div"),s.textContent="Age",d=T(),e=b("div"),e.textContent="Immune resilience index",i=T(),y=b("link"),t(x,"width","100%"),t(x,"height","100%"),t(s,"position","absolute"),t(s,"bottom","3px"),t(s,"left","50%"),t(s,"transform","translateX(-50%)"),t(s,"font-family","Sen, sans-serif"),t(s,"font-size","12px"),t(s,"color","#09341F"),t(s,"opacity","0.8"),t(e,"position","absolute"),t(e,"top","50%"),t(e,"right","83%"),t(e,"transform","translateY(-50%) rotate(-90deg)"),t(e,"font-family","Sen, sans-serif"),t(e,"font-size","12px"),t(e,"color","#09341F"),t(e,"opacity","0.8"),t(e,"white-space","nowrap"),t(o,"width","100%"),t(o,"height","100%"),t(o,"position","relative"),L(y,"href","https://fonts.googleapis.com/css2?family=Sen:wght@400..800&display=swap"),L(y,"rel","stylesheet")},m(n,w){k(n,o,w),f(o,x),v[2](x),f(o,h),f(o,s),f(o,d),f(o,e),k(n,i,w),f(V.head,y)},p:C,i:C,o:C,d(n){n&&(P(o),P(i)),v[2](null),P(y)}}}function Z(v,o,x){let{service:h=window.GaReportService}=o,s,d,e=0,i={},y="",n=0,w=0,$=0,u,a=0;function R(){u&&(i=echarts.init(u,null,{devicePixelRatio:4,renderer:"svg"}));const r=u.getBoundingClientRect();var m={textStyle:{fontFamily:"Sen, sans serif"},animation:!1,backgroundColor:"transparent",grid:{top:"5px",left:"50px",right:"45px",bottom:"40px"},dataset:[{source:d.data.map(c=>[c.x,c.y])}],tooltip:{show:!1},xAxis:{min:10,max:100,interval:20,nameTextStyle:{color:"#09341F",opacity:.8},axisLine:{show:!1,lineStyle:{color:"#09341F",opacity:.1},symbol:["none","arrow"],symbolSize:[5,10],symbolOffset:[8]},axisTick:{show:!1},axisLabel:{show:!0,color:"#09341F",opacity:.8,formatter(c){return c===0||c===100?"":c}},splitLine:{show:!0}},yAxis:{min:0,max:4.5,interval:.5,nameTextStyle:{color:"#09341F",opacity:.8},axisLine:{show:!1,lineStyle:{color:"#09341F",opacity:.1},symbol:["none","arrow"],symbolSize:[5,10],symbolOffset:[5]},axisTick:{show:!1},axisLabel:{show:!1,color:"#09341F",opacity:.8,formatter(c){return c===0||c===.6?"":c}},splitLine:{show:!0}},series:[{type:"scatter",tooltip:{},symbolSize:4,itemStyle:{color:"#09341F",opacity:.4,borderWidth:1,lineWidth:12}},{name:"Resilience index",type:"scatter",data:[{x:n,y:e}],itemStyle:{color:g(a)}}],graphic:[]};i.setOption(m),m.graphic.push({type:"line",shape:{x1:i.convertToPixel("xAxis",n),y1:i.convertToPixel("yAxis",0),x2:i.convertToPixel("xAxis",n),y2:i.convertToPixel("yAxis",e)},style:{stroke:g(a),lineDash:[8,8],lineWidth:1},z:8}),m.graphic.push({type:"line",shape:{x1:i.convertToPixel("xAxis",0),y1:i.convertToPixel("yAxis",e),x2:i.convertToPixel("xAxis",n),y2:i.convertToPixel("yAxis",e)},style:{stroke:g(a),lineDash:[8,8],lineWidth:1},z:8}),m.graphic.push({name:"Measured result",type:"circle",shape:{cx:i.convertToPixel("xAxis",n),cy:i.convertToPixel("yAxis",e),r:6},style:{fill:g(a),stroke:"#FFFFFF",lineWidth:1},z:15});const A=i.convertToPixel("xAxis",n),z=i.convertToPixel("yAxis",e),l=document.createElementNS("http://www.w3.org/2000/svg","svg"),p=document.createElement("div");l.setAttribute("width","71"),l.setAttribute("height","32"),l.setAttribute("viewBox","0 0 71 32"),l.setAttribute("fill","none"),l.setAttribute("xmlns","http://www.w3.org/2000/svg");const F=document.createElementNS("http://www.w3.org/2000/svg","path");F.setAttribute("d","M7 4C7 1.79086 8.79086 0 11 0H67C69.2091 0 71 1.79086 71 4V28C71 30.2091 69.2091 32 67 32H11C8.79086 32 7 30.2091 7 28V4Z"),F.setAttribute("fill",g(a));const S=document.createElementNS("http://www.w3.org/2000/svg","path");S.setAttribute("d","M1.13333 17.6C0.0666666 16.8 0.0666666 15.2 1.13333 14.4L7 10L7 22L1.13333 17.6Z"),S.setAttribute("fill",g(a)),l.appendChild(F),l.appendChild(S),l.style.position="absolute",l.style.left=`${r.left+A+10}px`,l.style.top=`${r.top+z-15}px`,l.style.zIndex="8",p.innerText=`${Number.parseFloat(e).toFixed(3)}`,p.style.position="absolute",p.style.left=`${r.left+A+28}px`,p.style.top=`${r.top+z-8}px`,p.style.font="bold 16px sans-serif",p.style.color="white",p.style.zIndex="999",p.style.fontFamily="Sen",document.body.appendChild(p),document.body.appendChild(l),i.setOption(m)}I(async()=>{s=await h.getReport(),y=s.sex,d=await h.getResilienceData(y),$=Number(s.G0yourscore),w=Number(s.G2yourscore),n=Number(s.chronologicalage),e=Number((w/$).toFixed(3));let r=d.data.filter(A=>A.y<e).length,m=d.data.length;a=Math.round(r/m*100),(a===100||a===0)&&(a=a===100?99:1),R()});function E(r){B[r?"unshift":"push"](()=>{u=r,x(0,u)})}return v.$$set=r=>{"service"in r&&x(1,h=r.service)},[u,h,E]}class N extends M{constructor(o){super(),O(this,o,Z,q,G,{service:1})}get service(){return this.$$.ctx[1]}set service(o){this.$$set({service:o}),D()}}customElements.define("ga-immune-resilience-index-scatter",W(N,{service:{}},[],[],!1));export{N as default};
|
package/dist/scatter-plot.wc.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{c as I,S as M,i as B,f as A,s as W,e as G,b as U,n as P,p as N,g as k,q as V,u as F,k as T,o as _,A as H}from"./index2.js";import{g as Z}from"./globals.js";import{
|
|
1
|
+
import{c as I,S as M,i as B,f as A,s as W,e as G,b as U,n as P,p as N,g as k,q as V,u as F,k as T,o as _,A as H}from"./index2.js";import{g as Z}from"./globals.js";import{a as v,f as q,h as X}from"./helpers.js";const{document:j}=Z;function J(h){let e,l,t;return{c(){e=G("div"),l=U(),t=G("link"),P(e,"width","100%"),P(e,"height","100%"),P(e,"position","relative"),N(t,"href","https://fonts.googleapis.com/css2?family=Sen:wght@400..800&display=swap"),N(t,"rel","stylesheet")},m(i,c){k(i,e,c),h[4](e),k(i,l,c),V(j.head,t)},p:F,i:F,o:F,d(i){i&&(T(e),T(l)),h[4](null),T(t)}}}function K(h,e,l){let{type:t}=e,{lang:i}=e,{service:c=window.GaReportService}=e,z=[{name:"mature",csvPerc:"G0percentile",csvScore:"G0yourscore"},{name:"youth",csvPerc:"G2percentile",csvScore:"G2yourscore"},{name:"shield",csvPerc:"Spercentile",csvScore:"Syourscore"},{name:"lifestyle",csvPerc:"Bpercentile",csvScore:"Byourscore"},{name:"median",csvPerc:"G1percentile",csvScore:"G1yourscore"}],u,$,C,g=0,p=0,o={},f="",y=0,x;const w=z.find(s=>s.name===t);function m(){if(t=="shield"||t=="youth"||t=="median")return q(g);if(t=="mature"||t=="lifestyle")return X(g)}function O(){x&&(o=echarts.init(x,null,{devicePixelRatio:4,renderer:"svg"}));const s=x.getBoundingClientRect();var d={textStyle:{fontFamily:"Sen, sans serif"},animation:!1,backgroundColor:"transparent",grid:{top:"65px",left:i==="slovenian"?"62px":"50px",right:i==="slovenian"?"50px":"55px",bottom:"40px"},dataset:[{source:$.data.map(n=>[n.x,n.y])},{source:C.data.map(n=>[n.x,n.y])}],tooltip:{show:!1},xAxis:{min:0,max:100,interval:20,name:v(i,"AGE"),nameTextStyle:{color:"#09341F",opacity:.8},axisLine:{show:!0,lineStyle:{color:"#09341F",opacity:.1},symbol:["none","arrow"],symbolSize:[5,10],symbolOffset:[8]},axisTick:{show:!1},axisLabel:{show:!0,color:"#09341F",opacity:.8,formatter(n){return n===0||n===100?"":n}},splitLine:{show:!0}},yAxis:{min:0,max:.6,name:v(i,"INDEX_SCORE"),nameTextStyle:{color:"#09341F",opacity:.8},axisLine:{show:!0,lineStyle:{color:"#09341F",opacity:.1},symbol:["none","arrow"],symbolSize:[5,10],symbolOffset:[5]},axisTick:{show:!1},axisLabel:{show:!0,color:"#09341F",opacity:.8,formatter(n){return n===0||n===.6?"":n}},splitLine:{show:!0}},series:[{type:"scatter",tooltip:{},itemStyle:{color:"#09341F",opacity:.1,borderWidth:1}},{name:v(i,"MEASURED_RESULT"),type:"scatter",data:[{x:y,y:p}],itemStyle:{color:m()}},{name:v(i,"POPULATION_AVERAGE"),type:"line",smooth:!0,datasetIndex:1,symbol:"line",lineStyle:{name:"line",type:"line",color:"#09341F",opacity:.5,symbol:"none",width:5},showSymbol:!1}],graphic:[],legend:{show:!0,right:"50%",top:"3%",left:i==="slovenian"?"67%":"70%",itemGap:.2,textStyle:{color:"#09341F",opacity:.8},selected:{"Measured result":!0,"Population average":!0},inactiveColor:"#fff"}};o.setOption(d),d.graphic.push({type:"line",shape:{x1:o.convertToPixel("xAxis",y),y1:o.convertToPixel("yAxis",0),x2:o.convertToPixel("xAxis",y),y2:o.convertToPixel("yAxis",p)},style:{stroke:m(),lineDash:[8,8],lineWidth:3},z:8}),d.graphic.push({type:"line",shape:{x1:o.convertToPixel("xAxis",0),y1:o.convertToPixel("yAxis",p),x2:o.convertToPixel("xAxis",y),y2:o.convertToPixel("yAxis",p)},style:{stroke:m(),lineDash:[8,8],lineWidth:3},z:8}),d.graphic.push({name:"Measured result",type:"circle",shape:{cx:o.convertToPixel("xAxis",y),cy:o.convertToPixel("yAxis",p),r:6},style:{fill:m(),stroke:"#FFFFFF",lineWidth:1},z:15});const E=o.convertToPixel("xAxis",y),L=o.convertToPixel("yAxis",p),r=document.createElementNS("http://www.w3.org/2000/svg","svg"),a=document.createElement("div");r.setAttribute("width","71"),r.setAttribute("height","32"),r.setAttribute("viewBox","0 0 71 32"),r.setAttribute("fill","none"),r.setAttribute("xmlns","http://www.w3.org/2000/svg");const b=document.createElementNS("http://www.w3.org/2000/svg","path");b.setAttribute("d","M7 4C7 1.79086 8.79086 0 11 0H67C69.2091 0 71 1.79086 71 4V28C71 30.2091 69.2091 32 67 32H11C8.79086 32 7 30.2091 7 28V4Z"),b.setAttribute("fill",m());const S=document.createElementNS("http://www.w3.org/2000/svg","path");S.setAttribute("d","M1.13333 17.6C0.0666666 16.8 0.0666666 15.2 1.13333 14.4L7 10L7 22L1.13333 17.6Z"),S.setAttribute("fill",m()),r.appendChild(b),r.appendChild(S),r.style.position="absolute",r.style.left=`${s.left+E+10}px`,r.style.top=`${s.top+L-15}px`,r.style.zIndex="8",a.innerText=`${Number.parseFloat(p).toFixed(3)}`,a.style.position="absolute",a.style.left=`${s.left+E+28}px`,a.style.top=`${s.top+L-8}px`,a.style.font="bold 16px sans-serif",a.style.color="white",a.style.zIndex="999",a.style.fontFamily="Sen",document.body.appendChild(a),document.body.appendChild(r),o.setOption(d)}_(async()=>{u=await c.getReport(),f=u.sex,$=await c.getScatterData(t,f),C=await c.getLineData(t,f),y=Number(u.chronologicalage),w&&(g=Number(u[w.csvPerc]),p=Number(u[w.csvScore])),O()});function D(s){H[s?"unshift":"push"](()=>{x=s,l(0,x)})}return h.$$set=s=>{"type"in s&&l(1,t=s.type),"lang"in s&&l(2,i=s.lang),"service"in s&&l(3,c=s.service)},[x,t,i,c,D]}class R extends M{constructor(e){super(),B(this,e,K,J,W,{type:1,lang:2,service:3})}get type(){return this.$$.ctx[1]}set type(e){this.$$set({type:e}),A()}get lang(){return this.$$.ctx[2]}set lang(e){this.$$set({lang:e}),A()}get service(){return this.$$.ctx[3]}set service(e){this.$$set({service:e}),A()}}customElements.define("ga-scatter-plot",I(R,{type:{},lang:{},service:{}},[],[],!1));export{R as default};
|