gf-components 0.1.163 → 0.1.165

package/dist/index.cjs.js

@@ -612,11 +612,11 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
   font-size: 10px;
   line-height: ${NE}px;
 `,L7e=(e,t=12)=>{const r=document.createElement("canvas").getContext("2d");return r.font=`${t}px Roboto, sans-serif`,r.measureText(e)},N2={"Biomassa en voedsel":"hsla(205, 40%, 79%, 1)",Kunststoffen:"hsla(83, 47%, 73%, 1)",Bouwmaterialen:"hsla(4, 55%, 75%, 1)",Consumptiegoederen:"hsla(35, 74%, 73%, 1)",Overig:"hsla(269, 24%, 77%, 1)",Maakindustrie:"hsla(26, 74%, 58%, 1)"},j7e=({data:e,height:t=500,padding:n=.2,keys:r=Object.keys(N2),indexBy:i="year",margin:o={},axisBottom:a={},axisLeft:s={},color:l={},tooltip:c=null,label:u=null})=>{const d=({bar:m})=>{const v=(u==null?void 0:u(m.data))||"label",b=L7e(v,10),y=b.width,x=b.fontBoundingBoxAscent+b.fontBoundingBoxDescent;if(x>=m.height)return p.jsx(p.Fragment,{});const $=m.x+m.width/2-y/2,w=m.y+m.height/2+x/2;return p.jsx("g",{transform:`translate(${$}, ${w})`,children:p.jsx("text",{style:{display:"flex",flexDirection:"column",justifyContent:"center",alignmentBaseline:"middle"},children:p.jsx(T7e,{style:{fontSize:10},children:v})})})},f=({bars:m})=>m.map((g,v)=>p.jsx(d,{bar:g},`bar-inner-label-${v}`)),h=({data:m,keys:g})=>{const v=g==null?void 0:g.map(b=>({name:b,color:N2[b]}));return p.jsx(qt,{gap:16,className:"gf-full",justify:"center",wrap:!0,children:v.map((b,y)=>p.jsxs(qt,{gap:8,align:"center",children:[p.jsx("div",{style:{minWidth:16,minHeight:16,backgroundColor:b.color}}),p.jsx(k7e,{children:b.name})]},`legend-${y}`))})};return p.jsxs(p.Fragment,{children:[p.jsx(mn,{}),p.jsxs(qt,{vertical:!0,gap:8,style:{width:"100%"},children:[p.jsx("div",{style:{height:t},children:p.jsx(Ml,{data:e,keys:r,indexBy:i,colors:({id:m,data:g})=>N2[m]||"orange",enableLabel:!1,margin:{left:50,bottom:50,top:10,right:50,...o},padding:n,axisBottom:{tickSize:5,legendPosition:"middle",legendOffset:40,...a},axisLeft:{tickSize:5,legendPosition:"middle",legendOffset:-40,...s},layers:["grid","axes","bars",f],tooltip:m=>p.jsx(Zn,{body:(c==null?void 0:c(m))||p.jsx("span",{children:"Tooltip"})})})}),p.jsx(h,{data:e,keys:r})]})]})},Dp={goodsRenewable:"#36CFC9",goodsNotRenewable:"#BDE7E3",goodsMixed:"#00474F",wasteRenewable:"#FFA940",wasteNotRenewable:"#EEDBBB",wasteMixed:"#873800"},F2={goodsRenewable:"Goederen - Hernieuwbare materialen",goodsNotRenewable:"Goederen - Niet-hernieuwbare materialen",goodsMixed:"Goederen - Gemengde materialen",wasteRenewable:"Afval - Hernieuwbare materialen",wasteNotRenewable:"Afval - Niet-hernieuwbare materialen",wasteMixed:"Afval - Gemengde materialen"},P7e=({data:e,height:t=400,colorMap:n=Dp,margin:r={},padding:i=.3,innerPadding:o=4,tooltip:a=null,axisBottom:s={},axisLeft:l={}})=>{const c=d=>d.bars.map((f,h)=>{const m=f.data.id,g=f.data.data,v=m==null?void 0:m.replace("Total",""),b=g==null?void 0:g[`${v}Total`],y=(g==null?void 0:g[`${v}Renewable`])||0,x=(g==null?void 0:g[`${v}NotRenewable`])||0,$=(g==null?void 0:g[`${v}Mixed`])||0,w=b?f.height*y/b:0,M=b?f.height*x/b:0,R=b?f.height*$/b:0;return p.jsxs("g",{children:[p.jsx("rect",{x:f.x,y:f.y+M+R,width:f.width,height:w,fill:n[`${v}Renewable`]}),p.jsx("rect",{x:f.x,y:f.y+R,width:f.width,height:M,fill:n[`${v}NotRenewable`]}),p.jsx("rect",{x:f.x,y:f.y,width:f.width,height:R,fill:n[`${v}Mixed`]})]},h)}),u=()=>p.jsx(qt,{justify:"center",gap:16,wrap:!0,children:Object.entries(Dp).map(([d,f],h)=>p.jsxs(qt,{align:"center",gap:8,children:[p.jsx("div",{style:{width:16,height:16,background:f}}),p.jsx("span",{style:{fontSize:12},children:F2==null?void 0:F2[d]})]},h))});return console.log(e),p.jsxs(qt,{vertical:!0,gap:8,children:[p.jsx("div",{style:{position:"relative",height:t,width:"100%",overflow:"visible"},children:p.jsx(Ml,{data:e,keys:["goodsTotal","wasteTotal"],indexBy:"year",groupMode:"grouped",padding:i,innerPadding:o,enableLabel:!1,colors:d=>"rgba(0, 0, 0, 0)",margin:{top:50,right:0,bottom:50,left:60,...r},axisLeft:{legend:"Gewicht (Mt)",legendPosition:"middle",legendOffset:-40,...l},axisBottom:{legend:"Jaar",legendPosition:"middle",legendOffset:40,...s},layers:["axes","grid",c,"bars"],tooltip:d=>p.jsx(Zn,{body:(a==null?void 0:a(d))||p.jsx("span",{children:"Tooltip"})})})}),p.jsx(u,{})]})},I7e=yt.span`
-    font: var(--gf-label-md-default);
-    font-size: 14px;
-    line-height: 22px;
-    font-weight: 400;
-    color: var(--gf-color-button-primary);
-    transition: color 150ms ease, font-weight 150ms ease;
-`,A7e=({items:e,width:t=226,offset:n=0,rootMargin:r=80,containerStyle:i={}})=>{const[o,a]=S.useState(0),s=S.useRef(!1),l=S.useRef(null),c=d=>{s.current=!0,l.current&&clearTimeout(l.current),l.current=setTimeout(()=>{s.current=!1},d)},u=d=>{var m,g;a(d),c(800);const f=(g=(m=e==null?void 0:e[d])==null?void 0:m.href)==null?void 0:g.current;if(!f)return;const h=f.getBoundingClientRect().top+window.pageYOffset-n;window.scrollTo({top:h,behavior:"smooth"})};return S.useEffect(()=>{const d=(e||[]).map((h,m)=>{var g;return{key:m,el:(g=h.href)==null?void 0:g.current}}).filter(h=>h.el);if(!d.length)return;const f=new IntersectionObserver(h=>{if(s.current)return;const m=h.filter(v=>v.isIntersecting).sort((v,b)=>v.boundingClientRect.top-b.boundingClientRect.top)[0];if(!m)return;const g=d.find(v=>v.el===m.target);g&&g.key!==void 0&&a(g.key)},{root:null,threshold:[.1,.2,.3],rootMargin:`-${n}px 0px -${r}% 0px`});return d.forEach(({el:h})=>f.observe(h)),()=>{f.disconnect(),l.current&&clearTimeout(l.current)}},[e]),p.jsxs(p.Fragment,{children:[p.jsx(mn,{}),p.jsxs(qt,{align:"stretch",children:[p.jsxs(qt,{gap:8,vertical:!0,align:"flex-start",style:{width:t,height:"fit-content",paddingTop:48,top:n,position:"sticky",paddingRight:8,...i},children:[p.jsx("span",{style:{fontSize:12},children:"Inhoudsopgave".toUpperCase()}),e==null?void 0:e.map((d,f)=>{const h=f===o;return p.jsx("div",{onClick:()=>u(f),style:{width:"100%",boxSizing:"border-box",padding:8,cursor:"pointer",background:h?"#F0F6FF":"transparent",transition:"background 150ms ease"},children:p.jsx(I7e,{children:d==null?void 0:d.name})},f)})]}),p.jsx("div",{style:{borderRight:"1px solid #DAE1ED"}})]})]})};exports.AddressLink=eD;exports.Anchor=A7e;exports.BarChart=E5e;exports.BenchmarkSankey=A2e;exports.ButtonControls=kF;exports.CrmValueChart=V7e;exports.CustomToolTip=Zn;exports.Description=iD;exports.DomRawChart=S5e;exports.DownloadButton=cx;exports.EmailLink=JF;exports.ExpandButton=ux;exports.GFButton=a6;exports.GFCard=Qs;exports.GFMetricsGrid=oD;exports.GoalChart=M7e;exports.ImpactTrend=j7e;exports.Link=Kd;exports.LocationIcon=bx;exports.MailIcon=px;exports.MaterialHeatmap=S7e;exports.Metrics=vx;exports.NavCard=IF;exports.PhoneIcon=mx;exports.PhoneLink=tD;exports.PieChart=Cle;exports.QuickNavCard=WF;exports.RenewableTrend=P7e;exports.Sankey=Ise;exports.ScatterPlot=mde;exports.TabCard=ZF;exports.Title=gx;exports.TreeMap=c2e;exports.Trends=L2e;exports.VisSelectors=P2e;exports.WasteOverview=C5e;
+  font: var(--gf-label-md-default);
+  font-size: 14px;
+  line-height: 22px;
+  font-weight: 400;
+  color: var(--gf-color-button-primary);
+  transition: color 150ms ease, font-weight 150ms ease;
+`,A7e=({items:e,width:t=226,offset:n=0,rootMargin:r=80,containerStyle:i={}})=>{const[o,a]=S.useState(0),s=S.useRef(0);S.useEffect(()=>{s.current=o},[o]);const l=S.useRef(!1),c=S.useRef(null),u=f=>{l.current=!0,c.current&&clearTimeout(c.current),c.current=setTimeout(()=>{l.current=!1},f)},d=f=>{var g,v;a(f),u(800);const h=(v=(g=e==null?void 0:e[f])==null?void 0:g.href)==null?void 0:v.current;if(!h)return;const m=h.getBoundingClientRect().top+window.pageYOffset-n;window.scrollTo({top:m,behavior:"smooth"})};return S.useEffect(()=>{const f=(e||[]).map((g,v)=>{var b;return{key:v,el:(b=g.href)==null?void 0:b.current}}).filter(g=>g.el);if(!f.length)return;const h=new Map,m=new IntersectionObserver(g=>{if(l.current)return;for(const y of g)h.set(y.target,{is:y.isIntersecting,top:y.boundingClientRect.top,ratio:y.intersectionRatio});const v=[];for(const{key:y,el:x}of f){const $=h.get(x);$!=null&&$.is&&v.push({key:y,el:x,...$})}if(!v.length)return;const b=v.sort((y,x)=>Math.abs(y.top-n)-Math.abs(x.top-n)||x.ratio-y.ratio)[0];b&&b.key!==s.current&&a(b.key)},{root:null,threshold:[0,.01,.1,.2],rootMargin:`-${n}px 0px -${r}% 0px`});return f.forEach(({el:g})=>m.observe(g)),()=>{m.disconnect(),c.current&&clearTimeout(c.current)}},[e,n,r]),p.jsxs(p.Fragment,{children:[p.jsx(mn,{}),p.jsxs(qt,{align:"stretch",children:[p.jsxs(qt,{gap:8,vertical:!0,align:"flex-start",style:{width:t,height:"fit-content",paddingTop:48,top:n,position:"sticky",paddingRight:8,...i},children:[p.jsx("span",{style:{fontSize:12},children:"Inhoudsopgave".toUpperCase()}),e==null?void 0:e.map((f,h)=>{const m=h===o;return p.jsx("div",{onClick:()=>d(h),style:{width:"100%",boxSizing:"border-box",padding:8,cursor:"pointer",background:m?"#F0F6FF":"transparent",transition:"background 150ms ease"},children:p.jsx(I7e,{children:f==null?void 0:f.name})},h)})]}),p.jsx("div",{style:{borderRight:"1px solid #DAE1ED"}})]})]})};exports.AddressLink=eD;exports.Anchor=A7e;exports.BarChart=E5e;exports.BenchmarkSankey=A2e;exports.ButtonControls=kF;exports.CrmValueChart=V7e;exports.CustomToolTip=Zn;exports.Description=iD;exports.DomRawChart=S5e;exports.DownloadButton=cx;exports.EmailLink=JF;exports.ExpandButton=ux;exports.GFButton=a6;exports.GFCard=Qs;exports.GFMetricsGrid=oD;exports.GoalChart=M7e;exports.ImpactTrend=j7e;exports.Link=Kd;exports.LocationIcon=bx;exports.MailIcon=px;exports.MaterialHeatmap=S7e;exports.Metrics=vx;exports.NavCard=IF;exports.PhoneIcon=mx;exports.PhoneLink=tD;exports.PieChart=Cle;exports.QuickNavCard=WF;exports.RenewableTrend=P7e;exports.Sankey=Ise;exports.ScatterPlot=mde;exports.TabCard=ZF;exports.Title=gx;exports.TreeMap=c2e;exports.Trends=L2e;exports.VisSelectors=P2e;exports.WasteOverview=C5e;
 //# sourceMappingURL=index.cjs.js.map