@undp/data-viz 1.3.0 → 1.4.0

package/dist/BeeSwarmChart.js

@@ -1,2 +1,1043 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index-BHm2KTjD-D8FylaKc.cjs"),xe=require("./index-CZbIGs8q.cjs"),u=require("react"),de=require("./Typography-CDR-DAHH.cjs"),he=require("./index-BXns0-ng.cjs"),me=require("./index-BczVvEBZ.cjs"),pe=require("./Modal-cQF2UQIa.cjs"),fe=require("./Spinner-UmN-KPe9.cjs"),ge=require("./numberFormattingFunction.js"),je=require("./Tooltip-BM18N_3l.cjs"),N=require("./checkIfNullOrUndefined.js"),ye=require("./getTextColorBasedOnBgColor.js"),ie=require("./Colors.js"),ve=require("./string2HTML-X4ZYX5jI.cjs"),we=require("./Axis-BlyBRMNw.cjs"),Se=require("./XTicksAndGridLines-DuK35ROS.cjs"),be=require("./ReferenceLine-Bsb5jeE4.cjs"),ae=require("./use-in-view-Dl1CsAIo.cjs"),Ee=require("./pow-B5-jkdHU.cjs"),Re=require("./linear-BVckp9RD.cjs"),le=require("./y-QcCbqrzx.cjs"),Me=require("./index-a2C2Bqn2.cjs"),Ce=require("./GraphFooter.js"),Oe=require("./GraphHeader.js"),ke=require("./ColorLegendWithMouseOver.js"),Ne=require("./EmptyState-BQguKAp5.cjs"),De=require("./YTicksAndGridLines-CtLvzExe.cjs");function $e(ce){const{data:s,circleColors:a,showTicks:M,leftMargin:oe,width:b,height:E,colorDomain:c,rightMargin:se,topMargin:U,bottomMargin:P,showLabels:F,tooltip:j,onSeriesMouseOver:L,refValues:h,selectedColor:G,startFromZero:W,radius:g,maxRadiusValue:X,maxValue:l,minValue:K,highlightedDataPoints:J,onSeriesMouseClick:Y,rtl:re,resetSelectionOnDoubleClick:Q,detailsOnClick:I,suffix:S,prefix:D,styles:y,classNames:q,noOfTicks:C,animate:f,dimmedOpacity:A,precision:O,customLayers:B}=ce,v=u.useRef(null),k=ae.useInView(v,{once:f.once,amount:f.amount}),[z,$]=u.useState(void 0),[T,_]=u.useState(void 0),[ee,m]=u.useState(null),[p,Z]=u.useState(void 0),[H,x]=u.useState(void 0),d={top:U,bottom:P,left:oe,right:se},ne=b-d.left-d.right,w=E-d.top-d.bottom,te=s.filter(e=>!N.checkIfNullOrUndefined(e.radius)).length===0?s:me.orderBy(s.filter(e=>!N.checkIfNullOrUndefined(e.radius)),"radius","desc"),R=N.checkIfNullOrUndefined(l)?Math.max(...s.filter(e=>!N.checkIfNullOrUndefined(e.position)).map(e=>e.position))<0&&!W?0:Math.max(...s.filter(e=>!N.checkIfNullOrUndefined(e.position)).map(e=>e.position)):l,r=N.checkIfNullOrUndefined(K)?Math.min(...s.filter(e=>!N.checkIfNullOrUndefined(e.position)).map(e=>e.position))>=0&&!W?0:Math.min(...s.filter(e=>!N.checkIfNullOrUndefined(e.position)).map(e=>e.position)):K,n=s.filter(e=>e.radius===void 0||e.radius===null).length!==s.length?Ee.sqrt().domain([0,N.checkIfNullOrUndefined(X)?Math.max(...s.map(e=>e.radius).filter(e=>e!=null)):X]).range([.25,g]).nice():void 0,V=Re.linear().domain([r,R]).range([0,ne]).nice(),t=V.ticks(C);return u.useEffect(()=>{m(null);const e=te.filter(o=>o.position);le.forceSimulation(e).force("x",le.forceX(o=>V(o.position)).strength(5)).force("y",le.forceY(o=>w/2).strength(1)).force("collide",le.forceCollide(o=>n?n(o.radius||0)+1:g+1)).force("charge",le.forceManyBody().strength(-15)).alphaDecay(.05).tick(1e4).on("tick",()=>{m(e)}).on("end",()=>{m(e)})},[s,g,w,ne,r,R,te,V,n]),i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[ee?i.jsxRuntimeExports.jsx(ae.motion.svg,{width:`${b}px`,height:`${E}px`,viewBox:`0 0 ${b} ${E}`,direction:"ltr",ref:v,children:i.jsxRuntimeExports.jsxs("g",{transform:`translate(${d.left},${d.top})`,children:[M?i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(we.Axis,{x1:V(r<0?0:r),x2:V(r<0?0:r),y1:0-d.top,y2:w+d.bottom,label:ge.numberFormattingFunction(r<0?0:r,"NA",O,D,S),labelPos:{x:V(r<0?0:r),y:0-U,dy:"0.75em",dx:3},classNames:{axis:q?.xAxis?.axis,label:q?.yAxis?.labels},styles:{axis:y?.xAxis?.axis,label:y?.yAxis?.labels}}),i.jsxRuntimeExports.jsx(Se.XTicksAndGridLines,{values:t.filter(e=>e!==0),x:t.filter(e=>e!==0).map(e=>V(e)),y1:0-U,y2:w+d.bottom,styles:{gridLines:y?.xAxis?.gridLines,labels:y?.xAxis?.labels},classNames:{gridLines:q?.xAxis?.gridLines,labels:q?.xAxis?.labels},suffix:S,prefix:D,labelType:"secondary",showGridLines:!0,precision:O})]}):null,B.filter(e=>e.position==="before").map(e=>e.layer),i.jsxRuntimeExports.jsxs(Me.AnimatePresence,{children:[ee.map(e=>i.jsxRuntimeExports.jsxs(ae.motion.g,{className:"undp-viz-g-with-hover",transform:`translate(${e.x},${e.y})`,variants:{initial:{opacity:0},whileInView:{opacity:G?e.color&&a[c.indexOf(e.color)]===G?1:A:J.length!==0?J.indexOf(e.label)!==-1?.85:A:.85,transition:{duration:f.duration}}},initial:"initial",animate:k?"whileInView":"initial",exit:{opacity:0,transition:{duration:f.duration}},onMouseEnter:o=>{$(e),x(o.clientY),Z(o.clientX),L?.(e)},onMouseMove:o=>{$(e),x(o.clientY),Z(o.clientX)},onClick:()=>{(Y||I)&&(he.isEqual(T,e)&&Q?(_(void 0),Y?.(void 0)):(_(e),Y?.(e)))},onMouseLeave:()=>{$(void 0),Z(void 0),x(void 0),L?.(void 0)},children:[i.jsxRuntimeExports.jsx(ae.motion.circle,{cx:0,cy:0,variants:{initial:{fill:s.filter(o=>o.color).length===0?a[0]:e.color?a[c.indexOf(e.color)]:ie.Colors.gray,opacity:0,radius:0},whileInView:{fill:s.filter(o=>o.color).length===0?a[0]:e.color?a[c.indexOf(e.color)]:ie.Colors.gray,opacity:1,radius:n?n(e.radius||0):g,transition:{duration:f.duration}}},initial:"initial",animate:k?"whileInView":"initial",exit:{opacity:0,radius:0,transition:{duration:f.duration}}}),(n?n(e.radius||0):g)>10&&F?i.jsxRuntimeExports.jsx(ae.motion.g,{variants:{initial:{opacity:0},whileInView:{opacity:1,transition:{duration:f.duration}}},initial:"initial",animate:k?"whileInView":"initial",exit:{opacity:0,transition:{duration:f.duration}},children:i.jsxRuntimeExports.jsx("foreignObject",{y:0-(n?n(e.radius||0):g),x:0-(n?n(e.radius||0):g),width:2*(n?n(e.radius||0):g),height:2*(n?n(e.radius||0):g),children:i.jsxRuntimeExports.jsx("div",{className:"flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-1.5",children:F?i.jsxRuntimeExports.jsx("p",{className:de.cnExports.cn("text-center leading-none m-0",q?.graphObjectValues),style:{fontSize:`${Math.min(Math.max(Math.round((n?n(e.radius||0):g)/4),10),Math.max(Math.round((n?n(e.radius||0):g)*12/`${e.label}`.length),10),20)}px`,color:ye.getTextColorBasedOnBgColor(s.filter(o=>o.color).length===0?a[0]:e.color?a[c.indexOf(e.color)]:ie.Colors.gray),hyphens:"auto",...y?.graphObjectValues||{}},children:e.label}):null})})}):null]},e.label)),h?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:h.map((e,o)=>i.jsxRuntimeExports.jsx(be.RefLineX,{text:e.text,color:e.color,x:V(e.value),y1:0-d.top,y2:w+d.bottom,textSide:V(e.value)>ne*.75||re?"left":"right",classNames:e.classNames,styles:e.styles,animate:f,isInView:k},o))}):null]}),B.filter(e=>e.position==="after").map(e=>e.layer)]})}):i.jsxRuntimeExports.jsx("div",{style:{width:`${b}px`,height:`${E}px`},children:i.jsxRuntimeExports.jsx("div",{className:"flex m-auto items-center justify-center p-0 leading-none text-base h-40",children:i.jsxRuntimeExports.jsx(fe.SpinnerExports.Spinner,{})})}),z&&j&&p&&H?i.jsxRuntimeExports.jsx(je.Tooltip,{data:z,body:j,xPos:p,yPos:H,backgroundStyle:y?.tooltip,className:q?.tooltip}):null,I&&T!==void 0?i.jsxRuntimeExports.jsx(pe.ModalExports.Modal,{open:T!==void 0,onClose:()=>{_(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof I=="string"?{__html:ve.string2HTML(I,T)}:void 0,children:typeof I=="function"?I(T):null})}):null]})}function Te(ce){const{data:s,graphTitle:a,backgroundColor:M=!1,topMargin:oe=25,bottomMargin:b=10,leftMargin:E=10,rightMargin:c=10,showLabels:se=!0,showTicks:U=!0,colors:P,sources:F,graphDescription:j,height:L,width:h,footNote:G,colorDomain:W,colorLegendTitle:g,padding:X,relativeHeight:l,tooltip:K,onSeriesMouseOver:J,refValues:Y,showColorScale:re,graphID:Q,radius:I=5,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q=[],onSeriesMouseClick:C,graphDownload:f=!1,dataDownload:A=!1,language:O="en",showNAColor:B=!0,minHeight:v=0,theme:k="light",ariaLabel:z,resetSelectionOnDoubleClick:$=!0,detailsOnClick:T,suffix:_="",prefix:ee="",styles:m,classNames:p,noOfTicks:Z,animate:H=!1,dimmedOpacity:x=.3,precision:d=2,customLayers:ne=[]}=ce,[w,te]=u.useState(0),[R,r]=u.useState(0),[n,V]=u.useState(void 0),t=u.useRef(null),e=u.useRef(null);return u.useEffect(()=>{const o=new ResizeObserver(ue=>{te(h||ue[0].target.clientWidth||620),r(L||ue[0].target.clientHeight||480)});return t.current&&(r(t.current.clientHeight||480),te(t.current.clientWidth||620),h||o.observe(t.current)),()=>o.disconnect()},[h,L]),i.jsxRuntimeExports.jsx("div",{className:`${k||"light"} flex  ${h?"w-fit grow-0":"w-full grow"}`,dir:O==="he"||O==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:de.cnExports.cn(`${M?M===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${O||"en"}`,p?.graphContainer),style:{...m?.graphContainer||{},...M&&M!==!0?{backgroundColor:M}:{}},id:Q,ref:e,"aria-label":z||`${a?`The graph shows ${a}. `:""}This is a bee swarm chart showing the distribution along the x-axes. ${j?` ${j}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:M?X||"1rem":X||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[a||j||f||A?i.jsxRuntimeExports.jsx(Oe.GraphHeader,{styles:{title:m?.title,description:m?.description},classNames:{title:p?.title,description:p?.description},graphTitle:a,graphDescription:j,width:h,graphDownload:f?e.current:void 0,dataDownload:A?s.map(o=>o.data).filter(o=>o!==void 0).length>0?s.map(o=>o.data).filter(o=>o!==void 0):s.filter(o=>o!==void 0):null}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:s.length===0?i.jsxRuntimeExports.jsx(Ne.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[re!==!1&&s.filter(o=>o.color).length!==0?i.jsxRuntimeExports.jsx(ke.ColorLegendWithMouseOver,{width:h,colorLegendTitle:g,colors:P||ie.Colors[k].categoricalColors.colors,colorDomain:W||xe.uniqBy(s.filter(o=>o.color),"color").map(o=>o.color),setSelectedColor:V,showNAColor:B??!0}):null,i.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center w-full leading-0",ref:t,"aria-label":"Graph area",children:(h||w)&&(L||R)?i.jsxRuntimeExports.jsx($e,{data:s,circleColors:s.filter(o=>o.color).length===0?P?[P]:[ie.Colors.primaryColors["blue-600"]]:P||ie.Colors[k].categoricalColors.colors,colorDomain:s.filter(o=>o.color).length===0?[]:W||xe.uniqBy(s.filter(o=>o.color),"color").map(o=>o.color),width:h||w,selectedColor:n,height:Math.max(v,L||(l?v?(h||w)*l>v?(h||w)*l:v:(h||w)*l:R)),showTicks:U,leftMargin:E,rightMargin:c,topMargin:oe,bottomMargin:b,showLabels:se,tooltip:K,onSeriesMouseOver:J,refValues:Y,startFromZero:!1,radius:I,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q,onSeriesMouseClick:C,rtl:O==="he"||O==="ar",resetSelectionOnDoubleClick:$,detailsOnClick:T,suffix:_,prefix:ee,styles:m,classNames:p,noOfTicks:Z||5,animate:H===!0?{duration:.5,once:!0,amount:.5}:H||{duration:0,once:!0,amount:0},dimmedOpacity:x,precision:d,customLayers:ne}):null})]})}),F||G?i.jsxRuntimeExports.jsx(Ce.GraphFooter,{styles:{footnote:m?.footnote,source:m?.source},classNames:{footnote:p?.footnote,source:p?.source},sources:F,footNote:G,width:h}):null]})})})})}function Ve(ce){const{data:s,circleColors:a,showTicks:M,leftMargin:oe,width:b,height:E,colorDomain:c,rightMargin:se,topMargin:U,bottomMargin:P,suffix:F,prefix:j,showLabels:L,tooltip:h,onSeriesMouseOver:G,refValues:W,selectedColor:g,startFromZero:X,radius:l,maxRadiusValue:K,maxValue:J,minValue:Y,highlightedDataPoints:re,onSeriesMouseClick:Q,resetSelectionOnDoubleClick:I,detailsOnClick:S,styles:D,classNames:y,noOfTicks:q,animate:C,dimmedOpacity:f,precision:A,customLayers:O}=ce,B=u.useRef(null),v=ae.useInView(B,{once:C.once,amount:C.amount}),[k,z]=u.useState(void 0),[$,T]=u.useState(void 0),[_,ee]=u.useState(null),[m,p]=u.useState(void 0),[Z,H]=u.useState(void 0),x={top:U,bottom:P,left:oe,right:se},d=b-x.left-x.right,ne=E-x.top-x.bottom,w=s.filter(t=>!N.checkIfNullOrUndefined(t.radius)).length===0?s:me.orderBy(s.filter(t=>!N.checkIfNullOrUndefined(t.radius)),"radius","desc"),te=N.checkIfNullOrUndefined(J)?Math.max(...s.filter(t=>!N.checkIfNullOrUndefined(t.position)).map(t=>t.position))<0&&!X?0:Math.max(...s.filter(t=>!N.checkIfNullOrUndefined(t.position)).map(t=>t.position)):J,R=N.checkIfNullOrUndefined(Y)?Math.min(...s.filter(t=>!N.checkIfNullOrUndefined(t.position)).map(t=>t.position))>=0&&!X?0:Math.min(...s.filter(t=>!N.checkIfNullOrUndefined(t.position)).map(t=>t.position)):Y,r=s.filter(t=>t.radius===void 0||t.radius===null).length!==s.length?Ee.sqrt().domain([0,N.checkIfNullOrUndefined(K)?Math.max(...s.map(t=>t.radius).filter(t=>t!=null)):K]).range([.25,l]).nice():void 0,n=Re.linear().domain([R,te]).range([ne,0]).nice(),V=n.ticks(q);return u.useEffect(()=>{ee(null);const t=w.filter(e=>e.position);le.forceSimulation(t).force("y",le.forceY(e=>n(e.position)).strength(5)).force("x",le.forceX(e=>d/2).strength(1)).force("collide",le.forceCollide(e=>r?r(e.radius||0)+1:l+1)).force("charge",le.forceManyBody().strength(-15)).alphaDecay(.05).tick(1e4).on("tick",()=>{ee(t)}).on("end",()=>{ee(t)})},[s,l,ne,d,R,te,w,n,r]),i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[_?i.jsxRuntimeExports.jsx(ae.motion.svg,{width:`${b}px`,height:`${E}px`,viewBox:`0 0 ${b} ${E}`,direction:"ltr",ref:B,children:i.jsxRuntimeExports.jsxs("g",{transform:`translate(${x.left},${x.top})`,children:[M?i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(we.Axis,{y1:n(R<0?0:R),y2:n(R<0?0:R),x1:0-x.left,x2:d+x.right,label:ge.numberFormattingFunction(R<0?0:R,"NA",A,j,F),labelPos:{x:0-x.left,y:n(R<0?0:R),dx:0,dy:te<0?"1em":-5},classNames:{axis:y?.xAxis?.axis,label:y?.yAxis?.labels},styles:{axis:D?.xAxis?.axis,label:D?.yAxis?.labels}}),i.jsxRuntimeExports.jsx(De.YTicksAndGridLines,{values:V.filter(t=>t!==0),y:V.filter(t=>t!==0).map(t=>n(t)),x1:0-x.left,x2:d+x.right,styles:{gridLines:D?.yAxis?.gridLines,labels:D?.yAxis?.labels},classNames:{gridLines:y?.yAxis?.gridLines,labels:y?.yAxis?.labels},suffix:F,prefix:j,labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:A})]}):null,O.filter(t=>t.position==="before").map(t=>t.layer),i.jsxRuntimeExports.jsxs(Me.AnimatePresence,{children:[_.map(t=>i.jsxRuntimeExports.jsxs(ae.motion.g,{className:"undp-viz-g-with-hover",transform:`translate(${t.x},${t.y})`,variants:{initial:{opacity:0},whileInView:{opacity:g?t.color&&a[c.indexOf(t.color)]===g?1:f:re.length!==0?re.indexOf(t.label)!==-1?.85:f:.85,transition:{duration:C.duration}}},initial:"initial",animate:v?"whileInView":"initial",exit:{opacity:0,transition:{duration:C.duration}},onMouseEnter:e=>{z(t),H(e.clientY),p(e.clientX),G?.(t)},onMouseMove:e=>{z(t),H(e.clientY),p(e.clientX)},onClick:()=>{(Q||S)&&(he.isEqual($,t)&&I?(T(void 0),Q?.(void 0)):(T(t),Q?.(t)))},onMouseLeave:()=>{z(void 0),p(void 0),H(void 0),G?.(void 0)},children:[i.jsxRuntimeExports.jsx(ae.motion.circle,{cx:0,cy:0,r:r?r(t.radius||0):l,variants:{initial:{fill:s.filter(e=>e.color).length===0?a[0]:t.color?a[c.indexOf(t.color)]:ie.Colors.gray,opacity:0,radius:0},whileInView:{fill:s.filter(e=>e.color).length===0?a[0]:t.color?a[c.indexOf(t.color)]:ie.Colors.gray,opacity:1,radius:r?r(t.radius||0):l,transition:{duration:C.duration}}},initial:"initial",animate:v?"whileInView":"initial",exit:{opacity:0,radius:0,transition:{duration:C.duration}}}),(r?r(t.radius||0):l)>10&&L?i.jsxRuntimeExports.jsx(ae.motion.g,{variants:{initial:{opacity:0},whileInView:{opacity:1,transition:{duration:C.duration}}},initial:"initial",animate:v?"whileInView":"initial",exit:{opacity:0,transition:{duration:C.duration}},children:i.jsxRuntimeExports.jsx("foreignObject",{y:0-(r?r(t.radius||0):l),x:0-(r?r(t.radius||0):l),width:2*(r?r(t.radius||0):l),height:2*(r?r(t.radius||0):l),children:i.jsxRuntimeExports.jsx("div",{className:"flex flex-col justify-center items-center h-inherit py-0 px-1.5",children:L?i.jsxRuntimeExports.jsx("p",{className:de.cnExports.cn("text-center leading-none m-0",y?.graphObjectValues),style:{fontSize:`${Math.min(Math.max(Math.round((r?r(t.radius||0):l)/4),10),Math.max(Math.round((r?r(t.radius||0):l)*12/`${t.label}`.length),10),20)}px`,hyphens:"auto",color:ye.getTextColorBasedOnBgColor(s.filter(e=>e.color).length===0?a[0]:t.color?a[c.indexOf(t.color)]:ie.Colors.gray),...D?.graphObjectValues||{}},children:t.label}):null})})}):null]},t.label)),W?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:W.map((t,e)=>i.jsxRuntimeExports.jsx(be.RefLineY,{text:t.text,color:t.color,y:n(t.value),x1:0-x.left,x2:d+x.right,classNames:t.classNames,styles:t.styles,animate:C,isInView:v},e))}):null]}),O.filter(t=>t.position==="after").map(t=>t.layer)]})}):i.jsxRuntimeExports.jsx("div",{style:{width:`${b}px`,height:`${E}px`},children:i.jsxRuntimeExports.jsx("div",{className:"flex m-auto items-center justify-center p-0 leading-none text-base h-40",children:i.jsxRuntimeExports.jsx(fe.SpinnerExports.Spinner,{})})}),k&&h&&m&&Z?i.jsxRuntimeExports.jsx(je.Tooltip,{data:k,body:h,xPos:m,yPos:Z,backgroundStyle:D?.tooltip,className:y?.tooltip}):null,S&&$!==void 0?i.jsxRuntimeExports.jsx(pe.ModalExports.Modal,{open:$!==void 0,onClose:()=>{T(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof S=="string"?{__html:ve.string2HTML(S,$)}:void 0,children:typeof S=="function"?S($):null})}):null]})}function Le(ce){const{data:s,graphTitle:a,colors:M,sources:oe,graphDescription:b,height:E,width:c,footNote:se,colorDomain:U,colorLegendTitle:P,padding:F,backgroundColor:j=!1,topMargin:L=25,bottomMargin:h=10,leftMargin:G=100,rightMargin:W=40,showLabels:g=!0,showTicks:X=!0,relativeHeight:l,tooltip:K,onSeriesMouseOver:J,refValues:Y,showColorScale:re,graphID:Q,radius:I=5,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q=[],onSeriesMouseClick:C,graphDownload:f=!1,dataDownload:A=!1,language:O="en",showNAColor:B=!0,minHeight:v=0,theme:k="light",ariaLabel:z,resetSelectionOnDoubleClick:$=!0,detailsOnClick:T,suffix:_="",prefix:ee="",styles:m,classNames:p,noOfTicks:Z,animate:H=!1,dimmedOpacity:x=.3,precision:d=2,customLayers:ne=[]}=ce,[w,te]=u.useState(0),[R,r]=u.useState(0),[n,V]=u.useState(void 0),t=u.useRef(null),e=u.useRef(null);return u.useEffect(()=>{const o=new ResizeObserver(ue=>{te(c||ue[0].target.clientWidth||620),r(E||ue[0].target.clientHeight||480)});return t.current&&(r(t.current.clientHeight||480),te(t.current.clientWidth||620),c||o.observe(t.current)),()=>o.disconnect()},[c,E]),i.jsxRuntimeExports.jsx("div",{className:`${k||"light"} flex  ${c?"w-fit grow-0":"w-full grow"}`,dir:O==="he"||O==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:de.cnExports.cn(`${j?j===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${O||"en"}`,p?.graphContainer),style:{...m?.graphContainer||{},...j&&j!==!0?{backgroundColor:j}:{}},id:Q,ref:e,"aria-label":z||`${a?`The graph shows ${a}. `:""}This is a bee swarm chart showing the distribution along the y-axes. ${b?` ${b}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:j?F||"1rem":F||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[a||b||f||A?i.jsxRuntimeExports.jsx(Oe.GraphHeader,{styles:{title:m?.title,description:m?.description},classNames:{title:p?.title,description:p?.description},graphTitle:a,graphDescription:b,width:c,graphDownload:f?e.current:void 0,dataDownload:A?s.map(o=>o.data).filter(o=>o!==void 0).length>0?s.map(o=>o.data).filter(o=>o!==void 0):s.filter(o=>o!==void 0):null}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:s.length===0?i.jsxRuntimeExports.jsx(Ne.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[re!==!1&&s.filter(o=>o.color).length!==0?i.jsxRuntimeExports.jsx(ke.ColorLegendWithMouseOver,{width:c,colorLegendTitle:P,colors:M||ie.Colors[k].categoricalColors.colors,colorDomain:U||xe.uniqBy(s.filter(o=>o.color),"color").map(o=>o.color),setSelectedColor:V,showNAColor:B}):null,i.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center w-full leading-0",ref:t,"aria-label":"Graph area",children:(c||w)&&(E||R)?i.jsxRuntimeExports.jsx(Ve,{data:s,circleColors:s.filter(o=>o.color).length===0?M?[M]:[ie.Colors.primaryColors["blue-600"]]:M||ie.Colors[k].categoricalColors.colors,colorDomain:s.filter(o=>o.color).length===0?[]:U||xe.uniqBy(s.filter(o=>o.color),"color").map(o=>o.color),width:c||w,selectedColor:n,height:Math.max(v,E||(l?v?(c||w)*l>v?(c||w)*l:v:(c||w)*l:R)),showTicks:X,leftMargin:G,rightMargin:W,topMargin:L,bottomMargin:h,showLabels:g,tooltip:K,onSeriesMouseOver:J,refValues:Y,startFromZero:!1,radius:I,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q,onSeriesMouseClick:C,resetSelectionOnDoubleClick:$,detailsOnClick:T,styles:m,classNames:p,suffix:_,prefix:ee,noOfTicks:Z||5,animate:H===!0?{duration:.5,once:!0,amount:.5}:H||{duration:0,once:!0,amount:0},dimmedOpacity:x,precision:d,customLayers:ne}):null})]})}),oe||se?i.jsxRuntimeExports.jsx(Ce.GraphFooter,{styles:{footnote:m?.footnote,source:m?.source},classNames:{footnote:p?.footnote,source:p?.source},sources:oe,footNote:se,width:c}):null]})})})})}function Ie(ce){const{data:s,graphTitle:a,backgroundColor:M,topMargin:oe,bottomMargin:b,leftMargin:E,rightMargin:c,showLabels:se,showTicks:U,colors:P,sources:F,graphDescription:j,height:L,width:h,footNote:G,colorDomain:W,colorLegendTitle:g,padding:X,relativeHeight:l,tooltip:K,onSeriesMouseOver:J,refValues:Y,showColorScale:re,graphID:Q,radius:I,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q,onSeriesMouseClick:C,graphDownload:f,dataDownload:A,language:O,showNAColor:B,minHeight:v,theme:k,ariaLabel:z,resetSelectionOnDoubleClick:$,detailsOnClick:T,noOfTicks:_,orientation:ee="vertical",styles:m,classNames:p,animate:Z,dimmedOpacity:H,precision:x,customLayers:d}=ce;return ee==="vertical"?i.jsxRuntimeExports.jsx(Le,{data:s,graphTitle:a,backgroundColor:M,topMargin:oe,bottomMargin:b,leftMargin:E,rightMargin:c,showLabels:se,showTicks:U,colors:P,sources:F,graphDescription:j,height:L,width:h,footNote:G,colorDomain:W,colorLegendTitle:g,padding:X,relativeHeight:l,tooltip:K,onSeriesMouseOver:J,refValues:Y,showColorScale:re,graphID:Q,radius:I,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q,onSeriesMouseClick:C,graphDownload:f,dataDownload:A,language:O,showNAColor:B,minHeight:v,theme:k,ariaLabel:z,resetSelectionOnDoubleClick:$,styles:m,detailsOnClick:T,classNames:p,noOfTicks:_,animate:Z,dimmedOpacity:H,precision:x,customLayers:d}):i.jsxRuntimeExports.jsx(Te,{data:s,graphTitle:a,backgroundColor:M,topMargin:oe,bottomMargin:b,leftMargin:E,rightMargin:c,showLabels:se,showTicks:U,colors:P,sources:F,graphDescription:j,height:L,width:h,footNote:G,colorDomain:W,colorLegendTitle:g,padding:X,relativeHeight:l,tooltip:K,onSeriesMouseOver:J,refValues:Y,showColorScale:re,graphID:Q,radius:I,maxRadiusValue:S,maxValue:D,minValue:y,highlightedDataPoints:q,onSeriesMouseClick:C,graphDownload:f,dataDownload:A,language:O,showNAColor:B,minHeight:v,theme:k,ariaLabel:z,resetSelectionOnDoubleClick:$,styles:m,detailsOnClick:T,classNames:p,noOfTicks:_,animate:Z,dimmedOpacity:H,precision:x,customLayers:d})}exports.BeeSwarmChart=Ie;
+import { j as i, m as he } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { u as ce } from "./index-CaAIPGZo.js";
+import { useRef as ae, useState as T, useEffect as de } from "react";
+import { i as ge } from "./index-27yTRcko.js";
+import { o as ue } from "./index-BLizQDlg.js";
+import { X as me } from "./Modal-CUU6ZK3U.js";
+import { y as fe } from "./Spinner-C85UF28E.js";
+import { n as xe } from "./numberFormattingFunction-14YCbkN2.js";
+import { T as pe } from "./Tooltip-DyM5snqx.js";
+import { c as D } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { g as ye } from "./getTextColorBasedOnBgColor-B6Nk2WBf.js";
+import { Colors as le } from "./Colors.js";
+import { s as ve } from "./string2HTML-CWHGfz_d.js";
+import { A as be } from "./Axis-Ddg-seDi.js";
+import { X as Te } from "./XTicksAndGridLines-Bn9u5gOM.js";
+import { a as Ve, R as Ae } from "./ReferenceLine-C1GpoG9d.js";
+import { s as we } from "./pow-e8zx3AQJ.js";
+import { a as je } from "./linear-DUdu7l2G.js";
+import { f as Me, b as Ce, a as Oe, c as De, d as ke } from "./y-D0sAaVii.js";
+import { GraphFooter as Ne } from "./GraphFooter.js";
+import { GraphHeader as $e } from "./GraphHeader.js";
+import { ColorLegendWithMouseOver as Se } from "./ColorLegendWithMouseOver.js";
+import { E as Le } from "./EmptyState-DdTp-Mdn.js";
+import { Y as He } from "./YTicksAndGridLines-B6ah7CRf.js";
+function Fe(se) {
+  const {
+    data: r,
+    circleColors: c,
+    showTicks: C,
+    leftMargin: ie,
+    width: b,
+    height: w,
+    colorDomain: n,
+    rightMargin: oe,
+    topMargin: X,
+    bottomMargin: Y,
+    showLabels: P,
+    tooltip: p,
+    onSeriesMouseOver: V,
+    refValues: u,
+    selectedColor: E,
+    startFromZero: W,
+    radius: x,
+    maxRadiusValue: B,
+    maxValue: a,
+    minValue: U,
+    highlightedDataPoints: J,
+    onSeriesMouseClick: G,
+    rtl: re,
+    resetSelectionOnDoubleClick: K,
+    detailsOnClick: A,
+    suffix: N,
+    prefix: $,
+    styles: y,
+    classNames: H,
+    noOfTicks: Q,
+    dimmedOpacity: F,
+    precision: R,
+    customLayers: k
+  } = se, z = ae(null), [j, v] = T(void 0), [S, I] = T(void 0), [_, Z] = T(null), [ee, m] = T(void 0), [f, h] = T(void 0), d = {
+    top: X,
+    bottom: Y,
+    left: ie,
+    right: oe
+  }, q = b - d.left - d.right, te = w - d.top - d.bottom, O = r.filter((e) => !D(e.radius)).length === 0 ? r : ue(
+    r.filter((e) => !D(e.radius)),
+    "radius",
+    "desc"
+  ), M = D(a) ? Math.max(...r.filter((e) => !D(e.position)).map((e) => e.position)) < 0 && !W ? 0 : Math.max(...r.filter((e) => !D(e.position)).map((e) => e.position)) : a, l = D(U) ? Math.min(...r.filter((e) => !D(e.position)).map((e) => e.position)) >= 0 && !W ? 0 : Math.min(...r.filter((e) => !D(e.position)).map((e) => e.position)) : U, s = r.filter((e) => e.radius === void 0 || e.radius === null).length !== r.length ? we().domain([
+    0,
+    D(B) ? Math.max(...r.map((e) => e.radius).filter((e) => e != null)) : B
+  ]).range([0.25, x]).nice() : void 0, L = je().domain([l, M]).range([0, q]).nice(), t = L.ticks(Q);
+  return de(() => {
+    Z(null);
+    const e = O.filter((g) => g.position);
+    Me(e).force("x", Ce((g) => L(g.position)).strength(5)).force("y", Oe((g) => te / 2).strength(1)).force(
+      "collide",
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      De((g) => s ? s(g.radius || 0) + 1 : x + 1)
+    ).force("charge", ke().strength(-15)).alphaDecay(0.05).tick(1e4).on("tick", () => {
+      Z(e);
+    }).on("end", () => {
+      Z(e);
+    });
+  }, [r, x, te, q, l, M, O, L, s]), /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+    _ ? /* @__PURE__ */ i.jsx(
+      "svg",
+      {
+        width: `${b}px`,
+        height: `${w}px`,
+        viewBox: `0 0 ${b} ${w}`,
+        direction: "ltr",
+        ref: z,
+        children: /* @__PURE__ */ i.jsxs("g", { transform: `translate(${d.left},${d.top})`, children: [
+          C ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            /* @__PURE__ */ i.jsx(
+              be,
+              {
+                x1: L(l < 0 ? 0 : l),
+                x2: L(l < 0 ? 0 : l),
+                y1: 0 - d.top,
+                y2: te + d.bottom,
+                label: xe(
+                  l < 0 ? 0 : l,
+                  "NA",
+                  R,
+                  $,
+                  N
+                ),
+                labelPos: {
+                  x: L(l < 0 ? 0 : l),
+                  y: 0 - X,
+                  dy: "0.75em",
+                  dx: 3
+                },
+                classNames: {
+                  axis: H?.xAxis?.axis,
+                  label: H?.yAxis?.labels
+                },
+                styles: {
+                  axis: y?.xAxis?.axis,
+                  label: y?.yAxis?.labels
+                }
+              }
+            ),
+            /* @__PURE__ */ i.jsx(
+              Te,
+              {
+                values: t.filter((e) => e !== 0),
+                x: t.filter((e) => e !== 0).map((e) => L(e)),
+                y1: 0 - X,
+                y2: te + d.bottom,
+                styles: {
+                  gridLines: y?.xAxis?.gridLines,
+                  labels: y?.xAxis?.labels
+                },
+                classNames: {
+                  gridLines: H?.xAxis?.gridLines,
+                  labels: H?.xAxis?.labels
+                },
+                suffix: N,
+                prefix: $,
+                labelType: "secondary",
+                showGridLines: !0,
+                precision: R
+              }
+            )
+          ] }) : null,
+          k.filter((e) => e.position === "before").map((e) => e.layer),
+          _.map((e) => /* @__PURE__ */ i.jsxs(
+            "g",
+            {
+              className: "undp-viz-g-with-hover",
+              transform: `translate(${e.x},${e.y})`,
+              opacity: E ? e.color && c[n.indexOf(e.color)] === E ? 1 : F : J.length !== 0 ? J.indexOf(e.label) !== -1 ? 0.85 : F : 0.85,
+              onMouseEnter: (g) => {
+                v(e), h(g.clientY), m(g.clientX), V?.(e);
+              },
+              onMouseMove: (g) => {
+                v(e), h(g.clientY), m(g.clientX);
+              },
+              onClick: () => {
+                (G || A) && (ge(S, e) && K ? (I(void 0), G?.(void 0)) : (I(e), G?.(e)));
+              },
+              onMouseLeave: () => {
+                v(void 0), m(void 0), h(void 0), V?.(void 0);
+              },
+              children: [
+                /* @__PURE__ */ i.jsx(
+                  "circle",
+                  {
+                    cx: 0,
+                    cy: 0,
+                    fill: r.filter((g) => g.color).length === 0 ? c[0] : e.color ? c[n.indexOf(e.color)] : le.gray,
+                    radius: s ? s(e.radius || 0) : x
+                  }
+                ),
+                (s ? s(e.radius || 0) : x) > 10 && P ? /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(
+                  "foreignObject",
+                  {
+                    y: 0 - (s ? s(e.radius || 0) : x),
+                    x: 0 - (s ? s(e.radius || 0) : x),
+                    width: 2 * (s ? s(e.radius || 0) : x),
+                    height: 2 * (s ? s(e.radius || 0) : x),
+                    children: /* @__PURE__ */ i.jsx("div", { className: "flex flex-col gap-0.5 justify-center items-center h-inherit py-0 px-1.5", children: P ? /* @__PURE__ */ i.jsx(
+                      "p",
+                      {
+                        className: he(
+                          "text-center leading-none m-0",
+                          H?.graphObjectValues
+                        ),
+                        style: {
+                          fontSize: `${Math.min(
+                            Math.max(
+                              Math.round(
+                                (s ? s(e.radius || 0) : x) / 4
+                              ),
+                              10
+                            ),
+                            Math.max(
+                              Math.round(
+                                (s ? s(e.radius || 0) : x) * 12 / `${e.label}`.length
+                              ),
+                              10
+                            ),
+                            20
+                          )}px`,
+                          color: ye(
+                            r.filter((g) => g.color).length === 0 ? c[0] : e.color ? c[n.indexOf(e.color)] : le.gray
+                          ),
+                          hyphens: "auto",
+                          ...y?.graphObjectValues || {}
+                        },
+                        children: e.label
+                      }
+                    ) : null })
+                  }
+                ) }) : null
+              ]
+            },
+            e.label
+          )),
+          u ? /* @__PURE__ */ i.jsx(i.Fragment, { children: u.map((e, g) => /* @__PURE__ */ i.jsx(
+            Ve,
+            {
+              text: e.text,
+              color: e.color,
+              x: L(e.value),
+              y1: 0 - d.top,
+              y2: te + d.bottom,
+              textSide: L(e.value) > q * 0.75 || re ? "left" : "right",
+              classNames: e.classNames,
+              styles: e.styles,
+              isInView: !0
+            },
+            g
+          )) }) : null,
+          k.filter((e) => e.position === "after").map((e) => e.layer)
+        ] })
+      }
+    ) : /* @__PURE__ */ i.jsx("div", { style: { width: `${b}px`, height: `${w}px` }, children: /* @__PURE__ */ i.jsx("div", { className: "flex m-auto items-center justify-center p-0 leading-none text-base h-40", children: /* @__PURE__ */ i.jsx(fe, {}) }) }),
+    j && p && ee && f ? /* @__PURE__ */ i.jsx(
+      pe,
+      {
+        data: j,
+        body: p,
+        xPos: ee,
+        yPos: f,
+        backgroundStyle: y?.tooltip,
+        className: H?.tooltip
+      }
+    ) : null,
+    A && S !== void 0 ? /* @__PURE__ */ i.jsx(
+      me,
+      {
+        open: S !== void 0,
+        onClose: () => {
+          I(void 0);
+        },
+        children: /* @__PURE__ */ i.jsx(
+          "div",
+          {
+            className: "graph-modal-content m-0",
+            dangerouslySetInnerHTML: typeof A == "string" ? { __html: ve(A, S) } : void 0,
+            children: typeof A == "function" ? A(S) : null
+          }
+        )
+      }
+    ) : null
+  ] });
+}
+function Pe(se) {
+  const {
+    data: r,
+    graphTitle: c,
+    backgroundColor: C = !1,
+    topMargin: ie = 25,
+    bottomMargin: b = 10,
+    leftMargin: w = 10,
+    rightMargin: n = 10,
+    showLabels: oe = !0,
+    showTicks: X = !0,
+    colors: Y,
+    sources: P,
+    graphDescription: p,
+    height: V,
+    width: u,
+    footNote: E,
+    colorDomain: W,
+    colorLegendTitle: x,
+    padding: B,
+    relativeHeight: a,
+    tooltip: U,
+    onSeriesMouseOver: J,
+    refValues: G,
+    showColorScale: re,
+    graphID: K,
+    radius: A = 5,
+    maxRadiusValue: N,
+    maxValue: $,
+    minValue: y,
+    highlightedDataPoints: H = [],
+    onSeriesMouseClick: Q,
+    graphDownload: F = !1,
+    dataDownload: R = !1,
+    language: k = "en",
+    showNAColor: z = !0,
+    minHeight: j = 0,
+    theme: v = "light",
+    ariaLabel: S,
+    resetSelectionOnDoubleClick: I = !0,
+    detailsOnClick: _,
+    suffix: Z = "",
+    prefix: ee = "",
+    styles: m,
+    classNames: f,
+    noOfTicks: h,
+    dimmedOpacity: d = 0.3,
+    precision: q = 2,
+    customLayers: te = []
+  } = se, [O, M] = T(0), [l, s] = T(0), [L, t] = T(void 0), e = ae(null), g = ae(null);
+  return de(() => {
+    const o = new ResizeObserver((ne) => {
+      M(u || ne[0].target.clientWidth || 620), s(V || ne[0].target.clientHeight || 480);
+    });
+    return e.current && (s(e.current.clientHeight || 480), M(e.current.clientWidth || 620), u || o.observe(e.current)), () => o.disconnect();
+  }, [u, V]), /* @__PURE__ */ i.jsx(
+    "div",
+    {
+      className: `${v || "light"} flex  ${u ? "w-fit grow-0" : "w-full grow"}`,
+      dir: k === "he" || k === "ar" ? "rtl" : void 0,
+      children: /* @__PURE__ */ i.jsx(
+        "div",
+        {
+          className: he(
+            `${C ? C === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${k || "en"}`,
+            f?.graphContainer
+          ),
+          style: {
+            ...m?.graphContainer || {},
+            ...C && C !== !0 ? { backgroundColor: C } : {}
+          },
+          id: K,
+          ref: g,
+          "aria-label": S || `${c ? `The graph shows ${c}. ` : ""}This is a bee swarm chart showing the distribution along the x-axes. ${p ? ` ${p}` : ""}`,
+          children: /* @__PURE__ */ i.jsx(
+            "div",
+            {
+              className: "flex grow",
+              style: { padding: C ? B || "1rem" : B || 0 },
+              children: /* @__PURE__ */ i.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
+                c || p || F || R ? /* @__PURE__ */ i.jsx(
+                  $e,
+                  {
+                    styles: {
+                      title: m?.title,
+                      description: m?.description
+                    },
+                    classNames: {
+                      title: f?.title,
+                      description: f?.description
+                    },
+                    graphTitle: c,
+                    graphDescription: p,
+                    width: u,
+                    graphDownload: F ? g.current : void 0,
+                    dataDownload: R ? r.map((o) => o.data).filter((o) => o !== void 0).length > 0 ? r.map((o) => o.data).filter((o) => o !== void 0) : r.filter((o) => o !== void 0) : null
+                  }
+                ) : null,
+                /* @__PURE__ */ i.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: r.length === 0 ? /* @__PURE__ */ i.jsx(Le, {}) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+                  re !== !1 && r.filter((o) => o.color).length !== 0 ? /* @__PURE__ */ i.jsx(
+                    Se,
+                    {
+                      width: u,
+                      colorLegendTitle: x,
+                      colors: Y || le[v].categoricalColors.colors,
+                      colorDomain: W || ce(
+                        r.filter((o) => o.color),
+                        "color"
+                      ).map((o) => o.color),
+                      setSelectedColor: t,
+                      showNAColor: z ?? !0
+                    }
+                  ) : null,
+                  /* @__PURE__ */ i.jsx(
+                    "div",
+                    {
+                      className: "flex flex-col grow justify-center w-full leading-0",
+                      ref: e,
+                      "aria-label": "Graph area",
+                      children: (u || O) && (V || l) ? /* @__PURE__ */ i.jsx(
+                        Fe,
+                        {
+                          data: r,
+                          circleColors: r.filter((o) => o.color).length === 0 ? Y ? [Y] : [le.primaryColors["blue-600"]] : Y || le[v].categoricalColors.colors,
+                          colorDomain: r.filter((o) => o.color).length === 0 ? [] : W || ce(
+                            r.filter((o) => o.color),
+                            "color"
+                          ).map((o) => o.color),
+                          width: u || O,
+                          selectedColor: L,
+                          height: Math.max(
+                            j,
+                            V || (a ? j ? (u || O) * a > j ? (u || O) * a : j : (u || O) * a : l)
+                          ),
+                          showTicks: X,
+                          leftMargin: w,
+                          rightMargin: n,
+                          topMargin: ie,
+                          bottomMargin: b,
+                          showLabels: oe,
+                          tooltip: U,
+                          onSeriesMouseOver: J,
+                          refValues: G,
+                          startFromZero: !1,
+                          radius: A,
+                          maxRadiusValue: N,
+                          maxValue: $,
+                          minValue: y,
+                          highlightedDataPoints: H,
+                          onSeriesMouseClick: Q,
+                          rtl: k === "he" || k === "ar",
+                          resetSelectionOnDoubleClick: I,
+                          detailsOnClick: _,
+                          suffix: Z,
+                          prefix: ee,
+                          styles: m,
+                          classNames: f,
+                          noOfTicks: h || 5,
+                          dimmedOpacity: d,
+                          precision: q,
+                          customLayers: te
+                        }
+                      ) : null
+                    }
+                  )
+                ] }) }),
+                P || E ? /* @__PURE__ */ i.jsx(
+                  Ne,
+                  {
+                    styles: { footnote: m?.footnote, source: m?.source },
+                    classNames: {
+                      footnote: f?.footnote,
+                      source: f?.source
+                    },
+                    sources: P,
+                    footNote: E,
+                    width: u
+                  }
+                ) : null
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function Re(se) {
+  const {
+    data: r,
+    circleColors: c,
+    showTicks: C,
+    leftMargin: ie,
+    width: b,
+    height: w,
+    colorDomain: n,
+    rightMargin: oe,
+    topMargin: X,
+    bottomMargin: Y,
+    suffix: P,
+    prefix: p,
+    showLabels: V,
+    tooltip: u,
+    onSeriesMouseOver: E,
+    refValues: W,
+    selectedColor: x,
+    startFromZero: B,
+    radius: a,
+    maxRadiusValue: U,
+    maxValue: J,
+    minValue: G,
+    highlightedDataPoints: re,
+    onSeriesMouseClick: K,
+    resetSelectionOnDoubleClick: A,
+    detailsOnClick: N,
+    styles: $,
+    classNames: y,
+    noOfTicks: H,
+    dimmedOpacity: Q,
+    precision: F,
+    customLayers: R
+  } = se, k = ae(null), [z, j] = T(void 0), [v, S] = T(void 0), [I, _] = T(null), [Z, ee] = T(void 0), [m, f] = T(void 0), h = {
+    top: X,
+    bottom: Y,
+    left: ie,
+    right: oe
+  }, d = b - h.left - h.right, q = w - h.top - h.bottom, te = r.filter((t) => !D(t.radius)).length === 0 ? r : ue(
+    r.filter((t) => !D(t.radius)),
+    "radius",
+    "desc"
+  ), O = D(J) ? Math.max(...r.filter((t) => !D(t.position)).map((t) => t.position)) < 0 && !B ? 0 : Math.max(...r.filter((t) => !D(t.position)).map((t) => t.position)) : J, M = D(G) ? Math.min(...r.filter((t) => !D(t.position)).map((t) => t.position)) >= 0 && !B ? 0 : Math.min(...r.filter((t) => !D(t.position)).map((t) => t.position)) : G, l = r.filter((t) => t.radius === void 0 || t.radius === null).length !== r.length ? we().domain([
+    0,
+    D(U) ? Math.max(...r.map((t) => t.radius).filter((t) => t != null)) : U
+  ]).range([0.25, a]).nice() : void 0, s = je().domain([M, O]).range([q, 0]).nice(), L = s.ticks(H);
+  return de(() => {
+    _(null);
+    const t = te.filter((e) => e.position);
+    Me(t).force("y", Oe((e) => s(e.position)).strength(5)).force("x", Ce((e) => d / 2).strength(1)).force(
+      "collide",
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      De((e) => l ? l(e.radius || 0) + 1 : a + 1)
+    ).force("charge", ke().strength(-15)).alphaDecay(0.05).tick(1e4).on("tick", () => {
+      _(t);
+    }).on("end", () => {
+      _(t);
+    });
+  }, [r, a, q, d, M, O, te, s, l]), /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+    I ? /* @__PURE__ */ i.jsx(
+      "svg",
+      {
+        width: `${b}px`,
+        height: `${w}px`,
+        viewBox: `0 0 ${b} ${w}`,
+        direction: "ltr",
+        ref: k,
+        children: /* @__PURE__ */ i.jsxs("g", { transform: `translate(${h.left},${h.top})`, children: [
+          C ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            /* @__PURE__ */ i.jsx(
+              be,
+              {
+                y1: s(M < 0 ? 0 : M),
+                y2: s(M < 0 ? 0 : M),
+                x1: 0 - h.left,
+                x2: d + h.right,
+                label: xe(
+                  M < 0 ? 0 : M,
+                  "NA",
+                  F,
+                  p,
+                  P
+                ),
+                labelPos: {
+                  x: 0 - h.left,
+                  y: s(M < 0 ? 0 : M),
+                  dx: 0,
+                  dy: O < 0 ? "1em" : -5
+                },
+                classNames: {
+                  axis: y?.xAxis?.axis,
+                  label: y?.yAxis?.labels
+                },
+                styles: {
+                  axis: $?.xAxis?.axis,
+                  label: $?.yAxis?.labels
+                }
+              }
+            ),
+            /* @__PURE__ */ i.jsx(
+              He,
+              {
+                values: L.filter((t) => t !== 0),
+                y: L.filter((t) => t !== 0).map((t) => s(t)),
+                x1: 0 - h.left,
+                x2: d + h.right,
+                styles: {
+                  gridLines: $?.yAxis?.gridLines,
+                  labels: $?.yAxis?.labels
+                },
+                classNames: {
+                  gridLines: y?.yAxis?.gridLines,
+                  labels: y?.yAxis?.labels
+                },
+                suffix: P,
+                prefix: p,
+                labelType: "secondary",
+                showGridLines: !0,
+                labelPos: "vertical",
+                precision: F
+              }
+            )
+          ] }) : null,
+          R.filter((t) => t.position === "before").map((t) => t.layer),
+          I.map((t) => /* @__PURE__ */ i.jsxs(
+            "g",
+            {
+              className: "undp-viz-g-with-hover",
+              transform: `translate(${t.x},${t.y})`,
+              opacity: x ? t.color && c[n.indexOf(t.color)] === x ? 1 : Q : re.length !== 0 ? re.indexOf(t.label) !== -1 ? 0.85 : Q : 0.85,
+              onMouseEnter: (e) => {
+                j(t), f(e.clientY), ee(e.clientX), E?.(t);
+              },
+              onMouseMove: (e) => {
+                j(t), f(e.clientY), ee(e.clientX);
+              },
+              onClick: () => {
+                (K || N) && (ge(v, t) && A ? (S(void 0), K?.(void 0)) : (S(t), K?.(t)));
+              },
+              onMouseLeave: () => {
+                j(void 0), ee(void 0), f(void 0), E?.(void 0);
+              },
+              children: [
+                /* @__PURE__ */ i.jsx(
+                  "circle",
+                  {
+                    cx: 0,
+                    cy: 0,
+                    r: l ? l(t.radius || 0) : a,
+                    fill: r.filter((e) => e.color).length === 0 ? c[0] : t.color ? c[n.indexOf(t.color)] : le.gray
+                  }
+                ),
+                (l ? l(t.radius || 0) : a) > 10 && V ? /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(
+                  "foreignObject",
+                  {
+                    y: 0 - (l ? l(t.radius || 0) : a),
+                    x: 0 - (l ? l(t.radius || 0) : a),
+                    width: 2 * (l ? l(t.radius || 0) : a),
+                    height: 2 * (l ? l(t.radius || 0) : a),
+                    children: /* @__PURE__ */ i.jsx("div", { className: "flex flex-col justify-center items-center h-inherit py-0 px-1.5", children: V ? /* @__PURE__ */ i.jsx(
+                      "p",
+                      {
+                        className: he(
+                          "text-center leading-none m-0",
+                          y?.graphObjectValues
+                        ),
+                        style: {
+                          fontSize: `${Math.min(
+                            Math.max(
+                              Math.round(
+                                (l ? l(t.radius || 0) : a) / 4
+                              ),
+                              10
+                            ),
+                            Math.max(
+                              Math.round(
+                                (l ? l(t.radius || 0) : a) * 12 / `${t.label}`.length
+                              ),
+                              10
+                            ),
+                            20
+                          )}px`,
+                          hyphens: "auto",
+                          color: ye(
+                            r.filter((e) => e.color).length === 0 ? c[0] : t.color ? c[n.indexOf(t.color)] : le.gray
+                          ),
+                          ...$?.graphObjectValues || {}
+                        },
+                        children: t.label
+                      }
+                    ) : null })
+                  }
+                ) }) : null
+              ]
+            },
+            t.label
+          )),
+          W ? /* @__PURE__ */ i.jsx(i.Fragment, { children: W.map((t, e) => /* @__PURE__ */ i.jsx(
+            Ae,
+            {
+              text: t.text,
+              color: t.color,
+              y: s(t.value),
+              x1: 0 - h.left,
+              x2: d + h.right,
+              classNames: t.classNames,
+              styles: t.styles,
+              isInView: !0
+            },
+            e
+          )) }) : null,
+          R.filter((t) => t.position === "after").map((t) => t.layer)
+        ] })
+      }
+    ) : /* @__PURE__ */ i.jsx("div", { style: { width: `${b}px`, height: `${w}px` }, children: /* @__PURE__ */ i.jsx("div", { className: "flex m-auto items-center justify-center p-0 leading-none text-base h-40", children: /* @__PURE__ */ i.jsx(fe, {}) }) }),
+    z && u && Z && m ? /* @__PURE__ */ i.jsx(
+      pe,
+      {
+        data: z,
+        body: u,
+        xPos: Z,
+        yPos: m,
+        backgroundStyle: $?.tooltip,
+        className: y?.tooltip
+      }
+    ) : null,
+    N && v !== void 0 ? /* @__PURE__ */ i.jsx(
+      me,
+      {
+        open: v !== void 0,
+        onClose: () => {
+          S(void 0);
+        },
+        children: /* @__PURE__ */ i.jsx(
+          "div",
+          {
+            className: "graph-modal-content m-0",
+            dangerouslySetInnerHTML: typeof N == "string" ? { __html: ve(N, v) } : void 0,
+            children: typeof N == "function" ? N(v) : null
+          }
+        )
+      }
+    ) : null
+  ] });
+}
+function Xe(se) {
+  const {
+    data: r,
+    graphTitle: c,
+    colors: C,
+    sources: ie,
+    graphDescription: b,
+    height: w,
+    width: n,
+    footNote: oe,
+    colorDomain: X,
+    colorLegendTitle: Y,
+    padding: P,
+    backgroundColor: p = !1,
+    topMargin: V = 25,
+    bottomMargin: u = 10,
+    leftMargin: E = 100,
+    rightMargin: W = 40,
+    showLabels: x = !0,
+    showTicks: B = !0,
+    relativeHeight: a,
+    tooltip: U,
+    onSeriesMouseOver: J,
+    refValues: G,
+    showColorScale: re,
+    graphID: K,
+    radius: A = 5,
+    maxRadiusValue: N,
+    maxValue: $,
+    minValue: y,
+    highlightedDataPoints: H = [],
+    onSeriesMouseClick: Q,
+    graphDownload: F = !1,
+    dataDownload: R = !1,
+    language: k = "en",
+    showNAColor: z = !0,
+    minHeight: j = 0,
+    theme: v = "light",
+    ariaLabel: S,
+    resetSelectionOnDoubleClick: I = !0,
+    detailsOnClick: _,
+    suffix: Z = "",
+    prefix: ee = "",
+    styles: m,
+    classNames: f,
+    noOfTicks: h,
+    dimmedOpacity: d = 0.3,
+    precision: q = 2,
+    customLayers: te = []
+  } = se, [O, M] = T(0), [l, s] = T(0), [L, t] = T(void 0), e = ae(null), g = ae(null);
+  return de(() => {
+    const o = new ResizeObserver((ne) => {
+      M(n || ne[0].target.clientWidth || 620), s(w || ne[0].target.clientHeight || 480);
+    });
+    return e.current && (s(e.current.clientHeight || 480), M(e.current.clientWidth || 620), n || o.observe(e.current)), () => o.disconnect();
+  }, [n, w]), /* @__PURE__ */ i.jsx(
+    "div",
+    {
+      className: `${v || "light"} flex  ${n ? "w-fit grow-0" : "w-full grow"}`,
+      dir: k === "he" || k === "ar" ? "rtl" : void 0,
+      children: /* @__PURE__ */ i.jsx(
+        "div",
+        {
+          className: he(
+            `${p ? p === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${k || "en"}`,
+            f?.graphContainer
+          ),
+          style: {
+            ...m?.graphContainer || {},
+            ...p && p !== !0 ? { backgroundColor: p } : {}
+          },
+          id: K,
+          ref: g,
+          "aria-label": S || `${c ? `The graph shows ${c}. ` : ""}This is a bee swarm chart showing the distribution along the y-axes. ${b ? ` ${b}` : ""}`,
+          children: /* @__PURE__ */ i.jsx(
+            "div",
+            {
+              className: "flex grow",
+              style: { padding: p ? P || "1rem" : P || 0 },
+              children: /* @__PURE__ */ i.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
+                c || b || F || R ? /* @__PURE__ */ i.jsx(
+                  $e,
+                  {
+                    styles: {
+                      title: m?.title,
+                      description: m?.description
+                    },
+                    classNames: {
+                      title: f?.title,
+                      description: f?.description
+                    },
+                    graphTitle: c,
+                    graphDescription: b,
+                    width: n,
+                    graphDownload: F ? g.current : void 0,
+                    dataDownload: R ? r.map((o) => o.data).filter((o) => o !== void 0).length > 0 ? r.map((o) => o.data).filter((o) => o !== void 0) : r.filter((o) => o !== void 0) : null
+                  }
+                ) : null,
+                /* @__PURE__ */ i.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: r.length === 0 ? /* @__PURE__ */ i.jsx(Le, {}) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+                  re !== !1 && r.filter((o) => o.color).length !== 0 ? /* @__PURE__ */ i.jsx(
+                    Se,
+                    {
+                      width: n,
+                      colorLegendTitle: Y,
+                      colors: C || le[v].categoricalColors.colors,
+                      colorDomain: X || ce(
+                        r.filter((o) => o.color),
+                        "color"
+                      ).map((o) => o.color),
+                      setSelectedColor: t,
+                      showNAColor: z
+                    }
+                  ) : null,
+                  /* @__PURE__ */ i.jsx(
+                    "div",
+                    {
+                      className: "flex flex-col grow justify-center w-full leading-0",
+                      ref: e,
+                      "aria-label": "Graph area",
+                      children: (n || O) && (w || l) ? /* @__PURE__ */ i.jsx(
+                        Re,
+                        {
+                          data: r,
+                          circleColors: r.filter((o) => o.color).length === 0 ? C ? [C] : [le.primaryColors["blue-600"]] : C || le[v].categoricalColors.colors,
+                          colorDomain: r.filter((o) => o.color).length === 0 ? [] : X || ce(
+                            r.filter((o) => o.color),
+                            "color"
+                          ).map((o) => o.color),
+                          width: n || O,
+                          selectedColor: L,
+                          height: Math.max(
+                            j,
+                            w || (a ? j ? (n || O) * a > j ? (n || O) * a : j : (n || O) * a : l)
+                          ),
+                          showTicks: B,
+                          leftMargin: E,
+                          rightMargin: W,
+                          topMargin: V,
+                          bottomMargin: u,
+                          showLabels: x,
+                          tooltip: U,
+                          onSeriesMouseOver: J,
+                          refValues: G,
+                          startFromZero: !1,
+                          radius: A,
+                          maxRadiusValue: N,
+                          maxValue: $,
+                          minValue: y,
+                          highlightedDataPoints: H,
+                          onSeriesMouseClick: Q,
+                          resetSelectionOnDoubleClick: I,
+                          detailsOnClick: _,
+                          styles: m,
+                          classNames: f,
+                          suffix: Z,
+                          prefix: ee,
+                          noOfTicks: h || 5,
+                          dimmedOpacity: d,
+                          precision: q,
+                          customLayers: te
+                        }
+                      ) : null
+                    }
+                  )
+                ] }) }),
+                ie || oe ? /* @__PURE__ */ i.jsx(
+                  Ne,
+                  {
+                    styles: { footnote: m?.footnote, source: m?.source },
+                    classNames: {
+                      footnote: f?.footnote,
+                      source: f?.source
+                    },
+                    sources: ie,
+                    footNote: oe,
+                    width: n
+                  }
+                ) : null
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
+}
+function ht(se) {
+  const {
+    data: r,
+    graphTitle: c,
+    backgroundColor: C,
+    topMargin: ie,
+    bottomMargin: b,
+    leftMargin: w,
+    rightMargin: n,
+    showLabels: oe,
+    showTicks: X,
+    colors: Y,
+    sources: P,
+    graphDescription: p,
+    height: V,
+    width: u,
+    footNote: E,
+    colorDomain: W,
+    colorLegendTitle: x,
+    padding: B,
+    relativeHeight: a,
+    tooltip: U,
+    onSeriesMouseOver: J,
+    refValues: G,
+    showColorScale: re,
+    graphID: K,
+    radius: A,
+    maxRadiusValue: N,
+    maxValue: $,
+    minValue: y,
+    highlightedDataPoints: H,
+    onSeriesMouseClick: Q,
+    graphDownload: F,
+    dataDownload: R,
+    language: k,
+    showNAColor: z,
+    minHeight: j,
+    theme: v,
+    ariaLabel: S,
+    resetSelectionOnDoubleClick: I,
+    detailsOnClick: _,
+    noOfTicks: Z,
+    orientation: ee = "vertical",
+    styles: m,
+    classNames: f,
+    dimmedOpacity: h,
+    precision: d,
+    customLayers: q
+  } = se;
+  return ee === "vertical" ? /* @__PURE__ */ i.jsx(
+    Xe,
+    {
+      data: r,
+      graphTitle: c,
+      backgroundColor: C,
+      topMargin: ie,
+      bottomMargin: b,
+      leftMargin: w,
+      rightMargin: n,
+      showLabels: oe,
+      showTicks: X,
+      colors: Y,
+      sources: P,
+      graphDescription: p,
+      height: V,
+      width: u,
+      footNote: E,
+      colorDomain: W,
+      colorLegendTitle: x,
+      padding: B,
+      relativeHeight: a,
+      tooltip: U,
+      onSeriesMouseOver: J,
+      refValues: G,
+      showColorScale: re,
+      graphID: K,
+      radius: A,
+      maxRadiusValue: N,
+      maxValue: $,
+      minValue: y,
+      highlightedDataPoints: H,
+      onSeriesMouseClick: Q,
+      graphDownload: F,
+      dataDownload: R,
+      language: k,
+      showNAColor: z,
+      minHeight: j,
+      theme: v,
+      ariaLabel: S,
+      resetSelectionOnDoubleClick: I,
+      styles: m,
+      detailsOnClick: _,
+      classNames: f,
+      noOfTicks: Z,
+      dimmedOpacity: h,
+      precision: d,
+      customLayers: q
+    }
+  ) : /* @__PURE__ */ i.jsx(
+    Pe,
+    {
+      data: r,
+      graphTitle: c,
+      backgroundColor: C,
+      topMargin: ie,
+      bottomMargin: b,
+      leftMargin: w,
+      rightMargin: n,
+      showLabels: oe,
+      showTicks: X,
+      colors: Y,
+      sources: P,
+      graphDescription: p,
+      height: V,
+      width: u,
+      footNote: E,
+      colorDomain: W,
+      colorLegendTitle: x,
+      padding: B,
+      relativeHeight: a,
+      tooltip: U,
+      onSeriesMouseOver: J,
+      refValues: G,
+      showColorScale: re,
+      graphID: K,
+      radius: A,
+      maxRadiusValue: N,
+      maxValue: $,
+      minValue: y,
+      highlightedDataPoints: H,
+      onSeriesMouseClick: Q,
+      graphDownload: F,
+      dataDownload: R,
+      language: k,
+      showNAColor: z,
+      minHeight: j,
+      theme: v,
+      ariaLabel: S,
+      resetSelectionOnDoubleClick: I,
+      styles: m,
+      detailsOnClick: _,
+      classNames: f,
+      noOfTicks: Z,
+      dimmedOpacity: h,
+      precision: d,
+      customLayers: q
+    }
+  );
+}
+export {
+  ht as BeeSwarmChart
+};
 //# sourceMappingURL=BeeSwarmChart.js.map