@undp/data-viz 1.4.1 → 1.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AreaChart.cjs +1 -1
- package/dist/AreaChart.js +21 -21
- package/dist/BarGraph.cjs +1 -1
- package/dist/BarGraph.js +7 -7
- package/dist/BeeSwarmChart.cjs +1 -1
- package/dist/BeeSwarmChart.js +2 -2
- package/dist/BiVariateChoroplethMap.cjs +1 -1
- package/dist/BiVariateChoroplethMap.js +5 -5
- package/dist/BulletChart.cjs +1 -1
- package/dist/BulletChart.js +14 -14
- package/dist/ButterflyChart.cjs +1 -1
- package/dist/ButterflyChart.js +9 -9
- package/dist/ChoroplethMap.cjs +1 -1
- package/dist/ChoroplethMap.js +9 -9
- package/dist/CirclePackingGraph.cjs +1 -1
- package/dist/CirclePackingGraph.js +1 -1
- package/dist/CopyTextButton.cjs +7 -7
- package/dist/CopyTextButton.cjs.map +1 -1
- package/dist/CopyTextButton.js +4 -4
- package/dist/CopyTextButton.js.map +1 -1
- package/dist/DataCards.cjs +9 -9
- package/dist/DataCards.cjs.map +1 -1
- package/dist/DataCards.js +93 -93
- package/dist/DataCards.js.map +1 -1
- package/dist/DifferenceLineChart.cjs +1 -1
- package/dist/DifferenceLineChart.js +18 -18
- package/dist/DonutChart.cjs +1 -1
- package/dist/DonutChart.js +1 -1
- package/dist/DotDensityMap.cjs +1 -1
- package/dist/DotDensityMap.js +8 -8
- package/dist/{DropdownSelect-0I2QxaVy.cjs → DropdownSelect-BmE5JaeE.cjs} +6 -6
- package/dist/{DropdownSelect-0I2QxaVy.cjs.map → DropdownSelect-BmE5JaeE.cjs.map} +1 -1
- package/dist/{DropdownSelect-CDC9lEqU.js → DropdownSelect-CeHog_ih.js} +4 -4
- package/dist/{DropdownSelect-CDC9lEqU.js.map → DropdownSelect-CeHog_ih.js.map} +1 -1
- package/dist/DualAxisLineChart.cjs +1 -1
- package/dist/DualAxisLineChart.js +15 -15
- package/dist/DumbbellChart.cjs +1 -1
- package/dist/DumbbellChart.js +13 -13
- package/dist/GeoHubMap.cjs +1 -1
- package/dist/GeoHubMap.js +2 -2
- package/dist/GeoHubMapWithLayerSelection.cjs +1 -1
- package/dist/GeoHubMapWithLayerSelection.js +2 -2
- package/dist/{GraphEl-B6SoGRFW.cjs → GraphEl-B5gAX1IQ.cjs} +2 -2
- package/dist/{GraphEl-B6SoGRFW.cjs.map → GraphEl-B5gAX1IQ.cjs.map} +1 -1
- package/dist/{GraphEl-Cw2tDUb3.js → GraphEl-BdIyscdt.js} +3 -3
- package/dist/{GraphEl-Cw2tDUb3.js.map → GraphEl-BdIyscdt.js.map} +1 -1
- package/dist/GriddedGraphs.cjs +1 -1
- package/dist/GriddedGraphs.js +4 -4
- package/dist/GriddedGraphsFromConfig.cjs +1 -1
- package/dist/GriddedGraphsFromConfig.js +1 -1
- package/dist/HeatMap.cjs +1 -1
- package/dist/HeatMap.js +10 -10
- package/dist/Histogram.cjs +1 -1
- package/dist/Histogram.js +1 -1
- package/dist/LineChartWithConfidenceInterval.cjs +1 -1
- package/dist/LineChartWithConfidenceInterval.js +21 -21
- package/dist/{Modal-CUU6ZK3U.js → Modal-DVVwpKhP.js} +2 -2
- package/dist/{Modal-CUU6ZK3U.js.map → Modal-DVVwpKhP.js.map} +1 -1
- package/dist/{Modal-C_dl0EtQ.cjs → Modal-tXZlLE5s.cjs} +4 -4
- package/dist/{Modal-C_dl0EtQ.cjs.map → Modal-tXZlLE5s.cjs.map} +1 -1
- package/dist/MultiGraphDashboard.cjs +1 -1
- package/dist/MultiGraphDashboard.js +3 -3
- package/dist/MultiGraphDashboardFromConfig.cjs +1 -1
- package/dist/MultiGraphDashboardFromConfig.js +1 -1
- package/dist/MultiGraphDashboardWideToLongFormat.cjs +1 -1
- package/dist/MultiGraphDashboardWideToLongFormat.js +3 -3
- package/dist/MultiGraphDashboardWideToLongFormatFromConfig.cjs +1 -1
- package/dist/MultiGraphDashboardWideToLongFormatFromConfig.js +1 -1
- package/dist/MultiLineAltChart.cjs +1 -1
- package/dist/MultiLineAltChart.js +21 -21
- package/dist/MultiLineChart.cjs +1 -1
- package/dist/MultiLineChart.js +19 -19
- package/dist/ParetoChart.cjs +1 -1
- package/dist/ParetoChart.js +12 -12
- package/dist/PerformanceIntensiveMultiGraphDashboard.cjs +1 -1
- package/dist/PerformanceIntensiveMultiGraphDashboard.js +3 -3
- package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.cjs +1 -1
- package/dist/PerformanceIntensiveMultiGraphDashboardFromConfig.js +1 -1
- package/dist/PerformanceIntensiveScrollStory.cjs +1 -1
- package/dist/PerformanceIntensiveScrollStory.js +2 -2
- package/dist/RadarChart.cjs +1 -1
- package/dist/RadarChart.js +8 -8
- package/dist/{ReferenceLine-CuFMk0cI.cjs → ReferenceLine-CFVBBN__.cjs} +2 -2
- package/dist/{ReferenceLine-CuFMk0cI.cjs.map → ReferenceLine-CFVBBN__.cjs.map} +1 -1
- package/dist/{ReferenceLine-C1GpoG9d.js → ReferenceLine-CfAW3vKJ.js} +2 -2
- package/dist/{ReferenceLine-C1GpoG9d.js.map → ReferenceLine-CfAW3vKJ.js.map} +1 -1
- package/dist/{RegressionLine-BFwDCTUU.js → RegressionLine-mH7UKOPi.js} +3 -3
- package/dist/{RegressionLine-BFwDCTUU.js.map → RegressionLine-mH7UKOPi.js.map} +1 -1
- package/dist/{RegressionLine-7_rKTHN_.cjs → RegressionLine-xKdiJ8sw.cjs} +2 -2
- package/dist/{RegressionLine-7_rKTHN_.cjs.map → RegressionLine-xKdiJ8sw.cjs.map} +1 -1
- package/dist/SankeyChart.cjs +1 -1
- package/dist/SankeyChart.js +4 -4
- package/dist/ScatterPlot.cjs +1 -1
- package/dist/ScatterPlot.js +13 -13
- package/dist/ScrollStory.cjs +1 -1
- package/dist/ScrollStory.js +2 -2
- package/dist/SimpleLineChart.cjs +1 -1
- package/dist/SimpleLineChart.js +20 -20
- package/dist/SingleGraphDashboard.cjs +1 -1
- package/dist/SingleGraphDashboard.js +4 -4
- package/dist/SingleGraphDashboardFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardFromConfig.js +1 -1
- package/dist/SingleGraphDashboardGeoHubMapsFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardGeoHubMapsFromConfig.js +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.cjs +1 -1
- package/dist/SingleGraphDashboardThreeDGraphs.js +3 -3
- package/dist/SingleGraphDashboardThreeDGraphsFromConfig.cjs +1 -1
- package/dist/SingleGraphDashboardThreeDGraphsFromConfig.js +1 -1
- package/dist/SlopeChart.cjs +1 -1
- package/dist/SlopeChart.js +7 -7
- package/dist/StripChart.cjs +1 -1
- package/dist/StripChart.js +9 -9
- package/dist/ThreeDGlobe.cjs +1 -1
- package/dist/ThreeDGlobe.js +2 -2
- package/dist/TreeMapGraph.cjs +1 -1
- package/dist/TreeMapGraph.js +4 -4
- package/dist/UnitChart.cjs +1 -1
- package/dist/UnitChart.js +3 -3
- package/dist/{XAxesLabels-DQFo_z2R.js → XAxesLabels-CaV2q-6H.js} +2 -2
- package/dist/{XAxesLabels-DQFo_z2R.js.map → XAxesLabels-CaV2q-6H.js.map} +1 -1
- package/dist/{XAxesLabels-CJMQbfVy.cjs → XAxesLabels-OjBNl_lS.cjs} +2 -2
- package/dist/{XAxesLabels-CJMQbfVy.cjs.map → XAxesLabels-OjBNl_lS.cjs.map} +1 -1
- package/dist/{YAxesLabels-H5-002X5.js → YAxesLabels-CPGZjmZJ.js} +2 -2
- package/dist/{YAxesLabels-H5-002X5.js.map → YAxesLabels-CPGZjmZJ.js.map} +1 -1
- package/dist/{YAxesLabels-BXLTX7AI.cjs → YAxesLabels-D8IydyZj.cjs} +2 -2
- package/dist/{YAxesLabels-BXLTX7AI.cjs.map → YAxesLabels-D8IydyZj.cjs.map} +1 -1
- package/dist/{checkIfMultiple-Do4kADNr.cjs → checkIfMultiple-BXbHUCWM.cjs} +6 -6
- package/dist/{checkIfMultiple-Do4kADNr.cjs.map → checkIfMultiple-BXbHUCWM.cjs.map} +1 -1
- package/dist/{checkIfMultiple-CYp3vADF.js → checkIfMultiple-ChTJk2Tk.js} +5 -5
- package/dist/{checkIfMultiple-CYp3vADF.js.map → checkIfMultiple-ChTJk2Tk.js.map} +1 -1
- package/dist/{customArea-CaxScFmW.js → customArea-B-dWU0zZ.js} +2 -2
- package/dist/{customArea-CaxScFmW.js.map → customArea-B-dWU0zZ.js.map} +1 -1
- package/dist/{customArea-BYNyxAkm.cjs → customArea-CK768gCn.cjs} +2 -2
- package/dist/{customArea-BYNyxAkm.cjs.map → customArea-CK768gCn.cjs.map} +1 -1
- package/dist/{fetchAndParseData-Bcmr659B.js → fetchAndParseData-4gsYTy6_.js} +3 -3
- package/dist/fetchAndParseData-4gsYTy6_.js.map +1 -0
- package/dist/{fetchAndParseData-DmgQtB9n.cjs → fetchAndParseData-CQyVGCul.cjs} +6 -6
- package/dist/fetchAndParseData-CQyVGCul.cjs.map +1 -0
- package/dist/fetchAndParseData.cjs +1 -1
- package/dist/fetchAndParseData.js +1 -1
- package/dist/index-BW8iNx7E.cjs +10 -0
- package/dist/index-BW8iNx7E.cjs.map +1 -0
- package/dist/index-CNvov0eg.js +122 -0
- package/dist/index-CNvov0eg.js.map +1 -0
- package/dist/{index-D_n8aamX.cjs → index-CZLvTu6p.cjs} +2 -2
- package/dist/{index-D_n8aamX.cjs.map → index-CZLvTu6p.cjs.map} +1 -1
- package/dist/{index-n_RI8T0n.js → index-Cdcfp4nk.js} +2 -2
- package/dist/{index-n_RI8T0n.js.map → index-Cdcfp4nk.js.map} +1 -1
- package/dist/{index-BVnYktl4.js → index-DGAaLNu9.js} +2 -2
- package/dist/{index-BVnYktl4.js.map → index-DGAaLNu9.js.map} +1 -1
- package/dist/{index-CylX-pWB.cjs → index-DNj994Pv.cjs} +2 -2
- package/dist/{index-CylX-pWB.cjs.map → index-DNj994Pv.cjs.map} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +3 -3
- package/dist/proxy-BHRoeZgd.cjs +2 -0
- package/dist/proxy-BHRoeZgd.cjs.map +1 -0
- package/dist/{proxy-DJxJg1kD.js → proxy-CkpFesk1.js} +4123 -4075
- package/dist/proxy-CkpFesk1.js.map +1 -0
- package/dist/style.css +1 -1
- package/dist/transformData.cjs +1 -1
- package/dist/transformData.js +2 -2
- package/dist/{transformDataForGraphFromFile-D9G3ToQf.cjs → transformDataForGraphFromFile-B1A0AS-Z.cjs} +2 -2
- package/dist/{transformDataForGraphFromFile-D9G3ToQf.cjs.map → transformDataForGraphFromFile-B1A0AS-Z.cjs.map} +1 -1
- package/dist/{transformDataForGraphFromFile-CA0rw80A.js → transformDataForGraphFromFile-BCjsizvb.js} +2 -2
- package/dist/{transformDataForGraphFromFile-CA0rw80A.js.map → transformDataForGraphFromFile-BCjsizvb.js.map} +1 -1
- package/dist/{use-in-view-BCmzDU2O.cjs → use-in-view-sQJZ_xDO.cjs} +2 -2
- package/dist/use-in-view-sQJZ_xDO.cjs.map +1 -0
- package/dist/{use-in-view-BAHrBy6b.js → use-in-view-yS6jzJAp.js} +2 -2
- package/dist/use-in-view-yS6jzJAp.js.map +1 -0
- package/dist/x-BBpi7a_7-Dz2vKSfu.cjs +27 -0
- package/dist/x-BBpi7a_7-Dz2vKSfu.cjs.map +1 -0
- package/dist/x-BBpi7a_7-WVdj1j6r.js +106 -0
- package/dist/x-BBpi7a_7-WVdj1j6r.js.map +1 -0
- package/package.json +50 -51
- package/dist/fetchAndParseData-Bcmr659B.js.map +0 -1
- package/dist/fetchAndParseData-DmgQtB9n.cjs.map +0 -1
- package/dist/index-BxAUvrua.js +0 -120
- package/dist/index-BxAUvrua.js.map +0 -1
- package/dist/index-DVOJ7vxH.cjs +0 -10
- package/dist/index-DVOJ7vxH.cjs.map +0 -1
- package/dist/proxy-DJxJg1kD.js.map +0 -1
- package/dist/proxy-PQd2AItT.cjs +0 -2
- package/dist/proxy-PQd2AItT.cjs.map +0 -1
- package/dist/use-in-view-BAHrBy6b.js.map +0 -1
- package/dist/use-in-view-BCmzDU2O.cjs.map +0 -1
- package/dist/x-CnsEH4Ox-CGGXQl4M.cjs +0 -27
- package/dist/x-CnsEH4Ox-CGGXQl4M.cjs.map +0 -1
- package/dist/x-CnsEH4Ox-DDvAJndW.js +0 -101
- package/dist/x-CnsEH4Ox-DDvAJndW.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-CHPV5EwG-DDoeWRVt.cjs"),d=require("react"),F=require("./parse-hMnG_lRV.cjs"),ke=require("./index-BzeLQvXk.cjs"),ne=require("./numberFormattingFunction-02t-wJta.cjs"),Ne=require("./Tooltip-n8z5bfav.cjs"),g=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),Ie=require("./XTicksAndGridLines-CCzXIV8d.cjs"),pe=require("./Axis-DE7dSn1_.cjs"),ve=require("./AxisTitle-CK9YeovX.cjs"),Oe=require("./index-CylX-pWB.cjs"),Le=require("./use-in-view-BCmzDU2O.cjs"),qe=require("./time-Byw_jYQ7.cjs"),we=require("./linear-BVckp9RD.cjs"),ye=require("./line-DHV4JwCR.cjs"),re=require("./step-BZ3C8QFW.cjs"),De=require("./select-Bnfk0lJx.cjs"),b=require("./proxy-PQd2AItT.cjs"),Se=require("./init-DU0ybBc_.cjs"),Me=require("./pointer-Dkq5NV1q.cjs"),Te=require("./GraphFooter.cjs"),Ve=require("./GraphHeader.cjs"),$e=require("./ColorLegend.cjs"),Ee=require("./Colors.cjs"),Fe=require("./EmptyState-d8_8SxeW.cjs");function Ce(ae){const{data:k,width:R,height:S,lineColors:n,labels:h,sameAxes:c,dateFormat:j,showValues:G,noOfXTicks:oe,rightMargin:le,leftMargin:W,topMargin:X,bottomMargin:xe,tooltip:v,highlightAreaSettings:ce,onSeriesMouseOver:C,animate:s,strokeWidth:Y,showDots:P,noOfYTicks:B,lineSuffixes:M,linePrefixes:T,minDate:z,maxDate:N,curveType:V,styles:o,classNames:r,precision:A,customLayers:H}=ae,J=d.useRef(null),p=Le.useInView(J,{once:s.once,amount:s.amount}),[m,ue]=d.useState(!1);d.useEffect(()=>{if(p&&!m){const e=setTimeout(()=>{ue(!0)},(s.duration+.5)*1e3);return()=>clearTimeout(e)}},[p,m,s.duration]);const I=V==="linear"?ye.curveLinear:V==="step"?re.curveStep:V==="stepAfter"?re.stepAfter:V==="stepBefore"?re.stepBefore:re.monotoneX,[O,K]=d.useState(void 0),[Q,Z]=d.useState(void 0),[_,ee]=d.useState(void 0),f={top:X,bottom:xe,left:W+50,right:le+65},w=d.useRef(null),i=ke.sortBy(k.map(e=>({...e,date:F.parse(`${e.date}`,j,new Date)})),"date"),me=ce.map(e=>({...e,coordinates:[e.coordinates[0]===null?null:F.parse(`${e.coordinates[0]}`,j,new Date),e.coordinates[1]===null?null:F.parse(`${e.coordinates[1]}`,j,new Date)]})),u=R-f.left-f.right,a=S-f.top-f.bottom,te=z?F.parse(`${z}`,j,new Date):i[0].date,ie=N?F.parse(`${N}`,j,new Date):i[i.length-1].date,$=Math.min(...i.map(e=>e.y1).filter(e=>e!=null))!==1/0?Math.min(...i.map(e=>e.y2).filter(e=>e!=null))>0?0:Math.min(...i.map(e=>e.y1).filter(e=>e!=null)):0,E=Math.min(...i.map(e=>e.y2).filter(e=>e!=null))!==1/0?Math.min(...i.map(e=>e.y2).filter(e=>e!=null))>0?0:Math.min(...i.map(e=>e.y2).filter(e=>e!=null)):0,L=Math.max(...i.map(e=>e.y1).filter(e=>e!=null))!==1/0?Math.max(...i.map(e=>e.y1).filter(e=>e!=null)):0,l=Math.max(...i.map(e=>e.y2).filter(e=>e!=null))!==1/0?Math.max(...i.map(e=>e.y2).filter(e=>e!=null)):0,U=$<E?$:E,se=L>l?L:l,x=qe.time().domain([te,ie]).range([0,u]),q=we.linear().domain([c?U:$,c?se>0?se:0:L>0?L:0]).range([a,0]).nice(),y=we.linear().domain([c?U:E,c?se>0?se:0:l>0?l:0]).range([a,0]).nice(),ge=ye.line().defined(e=>!g.checkIfNullOrUndefined(e.y1)).x(e=>x(e.date)).y(e=>q(e.y1)).curve(I),de=ye.line().defined(e=>!g.checkIfNullOrUndefined(e.y2)).x(e=>x(e.date)).y(e=>y(e.y2)).curve(I),Re=q.ticks(B),Ae=y.ticks(B),fe=x.ticks(oe);return d.useEffect(()=>{const e=he=>{const je=i[Se.bisectCenter(i.map(be=>be.date),x.invert(Me.pointer(he)[0]),1)];K(je||i[i.length-1]),C?.(je||i[i.length-1]),ee(he.clientY),Z(he.clientX)},D=()=>{K(void 0),Z(void 0),ee(void 0),C?.(void 0)};De.select(w.current).on("mousemove",e).on("mouseout",D)},[x,i,C]),t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(b.motion.svg,{width:`${R}px`,height:`${S}px`,viewBox:`0 0 ${R} ${S}`,direction:"ltr",ref:J,children:t.jsxRuntimeExports.jsxs("g",{transform:`translate(${f.left},${f.top})`,children:[t.jsxRuntimeExports.jsx(Oe.HighlightArea,{areaSettings:me,width:u,height:a,scale:x,animate:s,isInView:p}),t.jsxRuntimeExports.jsxs("g",{children:[Re.map((e,D)=>t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx("line",{y1:q(e),y2:q(e),x1:-15,x2:-20,style:{stroke:n[0],strokeWidth:1,...o?.yAxis?.gridLines||{}},className:r?.yAxis?.gridLines}),t.jsxRuntimeExports.jsx("text",{x:-25,y:q(e),dy:"0.33em",className:t.mo("text-xs",r?.yAxis?.labels),style:{textAnchor:"end",fill:n[0],...o?.yAxis?.labels||{}},children:ne.numberFormattingFunction(e,"NA",A,T[0],M[0])})]},D)),t.jsxRuntimeExports.jsx(pe.Axis,{y1:0,y2:a,x1:-15,x2:-15,classNames:{axis:r?.xAxis?.axis},styles:{axis:{stroke:n[0],...o?.xAxis?.axis||{}}}}),t.jsxRuntimeExports.jsx(ve.AxisTitle,{x:10-f.left,y:a/2,style:{fill:n[0],...o?.yAxis?.title||{}},className:r?.yAxis?.title,text:h[0].length>100?`${h[0].substring(0,100)}...`:h[0],rotate90:!0})]}),t.jsxRuntimeExports.jsxs("g",{children:[Ae.map((e,D)=>t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx("line",{y1:y(e),y2:y(e),x1:u+15,x2:u+20,style:{stroke:n[1],strokeWidth:1,...o?.yAxis?.gridLines||{}},className:r?.yAxis?.gridLines}),t.jsxRuntimeExports.jsx("text",{x:u+25,y:y(e),dy:"0.33em",dx:-2,style:{textAnchor:"start",fill:n[1],...o?.yAxis?.labels||{}},className:t.mo("text-xs",r?.yAxis?.labels),children:ne.numberFormattingFunction(e,"NA",A,T[1],M[1])})]},D)),t.jsxRuntimeExports.jsx(pe.Axis,{y1:0,y2:a,x1:u+15,x2:u+15,classNames:{axis:r?.xAxis?.axis},styles:{axis:{stroke:n[1],...o?.xAxis?.axis||{}}}}),t.jsxRuntimeExports.jsx(ve.AxisTitle,{x:u+f.right-15,y:a/2,style:{fill:n[1],...o?.yAxis?.title||{}},className:r?.yAxis?.title,text:h[1].length>100?`${h[1].substring(0,100)}...`:h[1],rotate90:!0})]}),t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx(pe.Axis,{y1:a,y2:a,x1:-15,x2:u+15,classNames:{axis:r?.xAxis?.axis},styles:{axis:o?.xAxis?.axis}}),t.jsxRuntimeExports.jsx(Ie.XTicksAndGridLines,{values:fe.map(e=>F.format(e,j)),x:fe.map(e=>x(e)),y1:0,y2:a,styles:{gridLines:o?.xAxis?.gridLines,labels:o?.xAxis?.labels},classNames:{gridLines:t.mo("opacity-0",r?.xAxis?.gridLines),labels:t.mo("fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",r?.xAxis?.labels)},labelType:"primary",showGridLines:!0,precision:A})]}),H.filter(e=>e.position==="before").map(e=>e.layer),t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx(b.motion.path,{style:{stroke:n[0],strokeWidth:Y,fill:"none"},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{pathLength:0,d:ge(i.filter(e=>!g.checkIfNullOrUndefined(e.y1)))||"",opacity:1},whileInView:{pathLength:1,d:ge(i.filter(e=>!g.checkIfNullOrUndefined(e.y1)))||"",opacity:1,transition:{duration:s.duration}}},initial:"initial",animate:p?"whileInView":"initial"}),t.jsxRuntimeExports.jsx(b.motion.path,{d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",style:{stroke:n[1],strokeWidth:Y,fill:"none"},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{pathLength:0,d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",opacity:1},whileInView:{pathLength:1,d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",opacity:1,transition:{duration:s.duration}}},initial:"initial",animate:p?"whileInView":"initial"}),O?t.jsxRuntimeExports.jsx("line",{y1:0,y2:a,x1:x(O.date),x2:x(O.date),className:t.mo("undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",r?.mouseOverLine),style:o?.mouseOverLine}):null]}),t.jsxRuntimeExports.jsx("g",{children:i.map((e,D)=>t.jsxRuntimeExports.jsxs(b.motion.g,{children:[g.checkIfNullOrUndefined(e.y1)?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[P?t.jsxRuntimeExports.jsx(b.motion.circle,{r:u/i.length<5?0:u/i.length<20?2:4,style:{fill:n[0]},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,cx:x(e.date),cy:q(e.y1)},whileInView:{opacity:1,transition:{duration:m?s.duration:.5,delay:m?0:s.duration},cx:x(e.date),cy:q(e.y1)}},initial:"initial",animate:p?"whileInView":"initial"}):null,G?t.jsxRuntimeExports.jsx(b.motion.text,{dy:g.checkIfNullOrUndefined(e.y2)||e.y2<e.y1?-8:"1em",style:{fill:n[0],textAnchor:"middle",...o?.graphObjectValues||{}},className:t.mo("graph-value graph-value-line-1 text-xs font-bold",r?.graphObjectValues),exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,x:x(e.date),y:y(e.y1)},whileInView:{opacity:1,x:x(e.date),y:y(e.y1),transition:{duration:m?s.duration:.5,delay:m?0:s.duration}}},initial:"initial",animate:p?"whileInView":"initial",children:ne.numberFormattingFunction(e.y1,"NA",A,T[0],M[0])}):null]}),g.checkIfNullOrUndefined(e.y2)?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[P?t.jsxRuntimeExports.jsx(b.motion.circle,{r:u/i.length<5?0:u/i.length<20?2:4,style:{fill:n[1]},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,cx:x(e.date),cy:y(e.y2)},whileInView:{opacity:1,transition:{duration:m?s.duration:.5,delay:m?0:s.duration},cx:x(e.date),cy:y(e.y2)}},initial:"initial",animate:p?"whileInView":"initial"}):null,G?t.jsxRuntimeExports.jsx(b.motion.text,{dy:g.checkIfNullOrUndefined(e.y1)||e.y1<e.y2?-8:"1em",style:{fill:n[1],textAnchor:"middle",...o?.graphObjectValues||{}},className:t.mo("graph-value graph-value-line-2 text-xs font-bold",r?.graphObjectValues),exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,x:x(e.date),y:y(e.y2)},whileInView:{opacity:1,x:x(e.date),y:y(e.y2),transition:{duration:m?s.duration:.5,delay:m?0:s.duration}}},initial:"initial",animate:p?"whileInView":"initial",children:ne.numberFormattingFunction(e.y2,"NA",A,T[1],M[1])}):null]})]},D))}),H.filter(e=>e.position==="after").map(e=>e.layer),t.jsxRuntimeExports.jsx("rect",{ref:w,style:{fill:"none",pointerEvents:"all"},width:u,height:a})]})}),O&&v&&Q&&_?t.jsxRuntimeExports.jsx(Ne.Tooltip,{data:O,body:v,xPos:Q,yPos:_,backgroundStyle:o?.tooltip,className:r?.tooltip}):null]})}function Pe(ae){const{data:k,graphTitle:R,sources:S,graphDescription:n,height:h,width:c,footNote:j,noOfXTicks:G=10,dateFormat:oe="yyyy",showValues:le=!1,padding:W,lineColors:X=[Ee.Colors.light.categoricalColors.colors[0],Ee.Colors.light.categoricalColors.colors[1]],sameAxes:xe=!1,backgroundColor:v=!1,leftMargin:ce=80,rightMargin:C=80,topMargin:s=20,bottomMargin:Y=25,labels:P,lineSuffixes:B=["",""],linePrefixes:M=["",""],tooltip:T,highlightAreaSettings:z=[],relativeHeight:N,onSeriesMouseOver:V,graphID:o,graphDownload:r=!1,dataDownload:A=!1,animate:H=!1,strokeWidth:J=2,showDots:p=!0,language:m="en",showColorScale:ue=!0,minHeight:I=0,colorLegendTitle:O,theme:K="light",ariaLabel:Q,noOfYTicks:Z=5,maxDate:_,minDate:ee,curveType:f="curve",styles:w,classNames:i,precision:me=2,customLayers:u=[]}=ae,[a,te]=d.useState(0),[ie,$]=d.useState(0),E=d.useRef(null),L=d.useRef(null);return d.useEffect(()=>{const l=new ResizeObserver(U=>{te(c||U[0].target.clientWidth||620),$(h||U[0].target.clientHeight||480)});return E.current&&($(E.current.clientHeight||480),te(E.current.clientWidth||620),c||l.observe(E.current)),()=>l.disconnect()},[c,h]),t.jsxRuntimeExports.jsx("div",{className:`${K||"light"} flex ${c?"w-fit grow-0":"w-full grow"}`,dir:m==="he"||m==="ar"?"rtl":void 0,children:t.jsxRuntimeExports.jsx("div",{className:t.mo(`${v?v===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${m||"en"}`,i?.graphContainer),style:{...w?.graphContainer||{},...v&&v!==!0?{backgroundColor:v}:{}},id:o,ref:L,"aria-label":Q||`${R?`The graph shows ${R}. `:""}This is a line chart that show trends for two datasets over time.${n?` ${n}`:""}`,children:t.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:v?W||"1rem":W||0},children:t.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[R||n||r||A?t.jsxRuntimeExports.jsx(Ve.GraphHeader,{styles:{title:w?.title,description:w?.description},classNames:{title:i?.title,description:i?.description},graphTitle:R,graphDescription:n,width:c,graphDownload:r?L.current:void 0,dataDownload:A?k.map(l=>l.data).filter(l=>l!==void 0).length>0?k.map(l=>l.data).filter(l=>l!==void 0):k.filter(l=>l!==void 0):null}):null,t.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:k.length===0?t.jsxRuntimeExports.jsx(Fe.EmptyState,{}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[ue?null:t.jsxRuntimeExports.jsx($e.ColorLegend,{colorDomain:P,colorLegendTitle:O,colors:X,showNAColor:!1}),t.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:E,"aria-label":"Graph area",children:(c||a)&&(h||ie)?t.jsxRuntimeExports.jsx(Ce,{data:k,sameAxes:xe,lineColors:X,width:c||a,height:Math.max(I,h||(N?I?(c||a)*N>I?(c||a)*N:I:(c||a)*N:ie)),dateFormat:oe,showValues:le,noOfXTicks:G,leftMargin:ce,rightMargin:C,topMargin:s,bottomMargin:Y,labels:P,highlightAreaSettings:z,tooltip:T,onSeriesMouseOver:V,animate:H===!0?{duration:.5,once:!0,amount:.5}:H||{duration:0,once:!0,amount:0},strokeWidth:J,showDots:p,noOfYTicks:Z,lineSuffixes:B,linePrefixes:M,minDate:ee,maxDate:_,curveType:f,styles:w,classNames:i,precision:me,customLayers:u}):null})]})}),S||j?t.jsxRuntimeExports.jsx(Te.GraphFooter,{styles:{footnote:w?.footnote,source:w?.source},classNames:{footnote:i?.footnote,source:i?.source},sources:S,footNote:j,width:c}):null]})})})})}exports.DualAxisLineChart=Pe;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-CHPV5EwG-DDoeWRVt.cjs"),d=require("react"),F=require("./parse-hMnG_lRV.cjs"),ke=require("./index-BzeLQvXk.cjs"),ne=require("./numberFormattingFunction-02t-wJta.cjs"),Ne=require("./Tooltip-n8z5bfav.cjs"),g=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),Ie=require("./XTicksAndGridLines-CCzXIV8d.cjs"),pe=require("./Axis-DE7dSn1_.cjs"),ve=require("./AxisTitle-CK9YeovX.cjs"),Oe=require("./index-DNj994Pv.cjs"),Le=require("./time-Byw_jYQ7.cjs"),we=require("./linear-BVckp9RD.cjs"),ye=require("./line-DHV4JwCR.cjs"),re=require("./step-BZ3C8QFW.cjs"),qe=require("./select-Bnfk0lJx.cjs"),De=require("./init-DU0ybBc_.cjs"),Se=require("./pointer-Dkq5NV1q.cjs"),Me=require("./use-in-view-sQJZ_xDO.cjs"),b=require("./proxy-BHRoeZgd.cjs"),Te=require("./GraphFooter.cjs"),Ve=require("./GraphHeader.cjs"),$e=require("./ColorLegend.cjs"),Ee=require("./Colors.cjs"),Fe=require("./EmptyState-d8_8SxeW.cjs");function Ce(ae){const{data:k,width:R,height:S,lineColors:n,labels:h,sameAxes:c,dateFormat:j,showValues:G,noOfXTicks:oe,rightMargin:le,leftMargin:W,topMargin:X,bottomMargin:xe,tooltip:v,highlightAreaSettings:ce,onSeriesMouseOver:C,animate:s,strokeWidth:Y,showDots:P,noOfYTicks:B,lineSuffixes:M,linePrefixes:T,minDate:z,maxDate:N,curveType:V,styles:o,classNames:r,precision:A,customLayers:H}=ae,J=d.useRef(null),p=Me.useInView(J,{once:s.once,amount:s.amount}),[m,ue]=d.useState(!1);d.useEffect(()=>{if(p&&!m){const e=setTimeout(()=>{ue(!0)},(s.duration+.5)*1e3);return()=>clearTimeout(e)}},[p,m,s.duration]);const I=V==="linear"?ye.curveLinear:V==="step"?re.curveStep:V==="stepAfter"?re.stepAfter:V==="stepBefore"?re.stepBefore:re.monotoneX,[O,K]=d.useState(void 0),[Q,Z]=d.useState(void 0),[_,ee]=d.useState(void 0),f={top:X,bottom:xe,left:W+50,right:le+65},w=d.useRef(null),i=ke.sortBy(k.map(e=>({...e,date:F.parse(`${e.date}`,j,new Date)})),"date"),me=ce.map(e=>({...e,coordinates:[e.coordinates[0]===null?null:F.parse(`${e.coordinates[0]}`,j,new Date),e.coordinates[1]===null?null:F.parse(`${e.coordinates[1]}`,j,new Date)]})),u=R-f.left-f.right,a=S-f.top-f.bottom,te=z?F.parse(`${z}`,j,new Date):i[0].date,ie=N?F.parse(`${N}`,j,new Date):i[i.length-1].date,$=Math.min(...i.map(e=>e.y1).filter(e=>e!=null))!==1/0?Math.min(...i.map(e=>e.y2).filter(e=>e!=null))>0?0:Math.min(...i.map(e=>e.y1).filter(e=>e!=null)):0,E=Math.min(...i.map(e=>e.y2).filter(e=>e!=null))!==1/0?Math.min(...i.map(e=>e.y2).filter(e=>e!=null))>0?0:Math.min(...i.map(e=>e.y2).filter(e=>e!=null)):0,L=Math.max(...i.map(e=>e.y1).filter(e=>e!=null))!==1/0?Math.max(...i.map(e=>e.y1).filter(e=>e!=null)):0,l=Math.max(...i.map(e=>e.y2).filter(e=>e!=null))!==1/0?Math.max(...i.map(e=>e.y2).filter(e=>e!=null)):0,U=$<E?$:E,se=L>l?L:l,x=Le.time().domain([te,ie]).range([0,u]),q=we.linear().domain([c?U:$,c?se>0?se:0:L>0?L:0]).range([a,0]).nice(),y=we.linear().domain([c?U:E,c?se>0?se:0:l>0?l:0]).range([a,0]).nice(),ge=ye.line().defined(e=>!g.checkIfNullOrUndefined(e.y1)).x(e=>x(e.date)).y(e=>q(e.y1)).curve(I),de=ye.line().defined(e=>!g.checkIfNullOrUndefined(e.y2)).x(e=>x(e.date)).y(e=>y(e.y2)).curve(I),Re=q.ticks(B),Ae=y.ticks(B),fe=x.ticks(oe);return d.useEffect(()=>{const e=he=>{const je=i[De.bisectCenter(i.map(be=>be.date),x.invert(Se.pointer(he)[0]),1)];K(je||i[i.length-1]),C?.(je||i[i.length-1]),ee(he.clientY),Z(he.clientX)},D=()=>{K(void 0),Z(void 0),ee(void 0),C?.(void 0)};qe.select(w.current).on("mousemove",e).on("mouseout",D)},[x,i,C]),t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(b.motion.svg,{width:`${R}px`,height:`${S}px`,viewBox:`0 0 ${R} ${S}`,direction:"ltr",ref:J,children:t.jsxRuntimeExports.jsxs("g",{transform:`translate(${f.left},${f.top})`,children:[t.jsxRuntimeExports.jsx(Oe.HighlightArea,{areaSettings:me,width:u,height:a,scale:x,animate:s,isInView:p}),t.jsxRuntimeExports.jsxs("g",{children:[Re.map((e,D)=>t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx("line",{y1:q(e),y2:q(e),x1:-15,x2:-20,style:{stroke:n[0],strokeWidth:1,...o?.yAxis?.gridLines||{}},className:r?.yAxis?.gridLines}),t.jsxRuntimeExports.jsx("text",{x:-25,y:q(e),dy:"0.33em",className:t.mo("text-xs",r?.yAxis?.labels),style:{textAnchor:"end",fill:n[0],...o?.yAxis?.labels||{}},children:ne.numberFormattingFunction(e,"NA",A,T[0],M[0])})]},D)),t.jsxRuntimeExports.jsx(pe.Axis,{y1:0,y2:a,x1:-15,x2:-15,classNames:{axis:r?.xAxis?.axis},styles:{axis:{stroke:n[0],...o?.xAxis?.axis||{}}}}),t.jsxRuntimeExports.jsx(ve.AxisTitle,{x:10-f.left,y:a/2,style:{fill:n[0],...o?.yAxis?.title||{}},className:r?.yAxis?.title,text:h[0].length>100?`${h[0].substring(0,100)}...`:h[0],rotate90:!0})]}),t.jsxRuntimeExports.jsxs("g",{children:[Ae.map((e,D)=>t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx("line",{y1:y(e),y2:y(e),x1:u+15,x2:u+20,style:{stroke:n[1],strokeWidth:1,...o?.yAxis?.gridLines||{}},className:r?.yAxis?.gridLines}),t.jsxRuntimeExports.jsx("text",{x:u+25,y:y(e),dy:"0.33em",dx:-2,style:{textAnchor:"start",fill:n[1],...o?.yAxis?.labels||{}},className:t.mo("text-xs",r?.yAxis?.labels),children:ne.numberFormattingFunction(e,"NA",A,T[1],M[1])})]},D)),t.jsxRuntimeExports.jsx(pe.Axis,{y1:0,y2:a,x1:u+15,x2:u+15,classNames:{axis:r?.xAxis?.axis},styles:{axis:{stroke:n[1],...o?.xAxis?.axis||{}}}}),t.jsxRuntimeExports.jsx(ve.AxisTitle,{x:u+f.right-15,y:a/2,style:{fill:n[1],...o?.yAxis?.title||{}},className:r?.yAxis?.title,text:h[1].length>100?`${h[1].substring(0,100)}...`:h[1],rotate90:!0})]}),t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx(pe.Axis,{y1:a,y2:a,x1:-15,x2:u+15,classNames:{axis:r?.xAxis?.axis},styles:{axis:o?.xAxis?.axis}}),t.jsxRuntimeExports.jsx(Ie.XTicksAndGridLines,{values:fe.map(e=>F.format(e,j)),x:fe.map(e=>x(e)),y1:0,y2:a,styles:{gridLines:o?.xAxis?.gridLines,labels:o?.xAxis?.labels},classNames:{gridLines:t.mo("opacity-0",r?.xAxis?.gridLines),labels:t.mo("fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",r?.xAxis?.labels)},labelType:"primary",showGridLines:!0,precision:A})]}),H.filter(e=>e.position==="before").map(e=>e.layer),t.jsxRuntimeExports.jsxs("g",{children:[t.jsxRuntimeExports.jsx(b.motion.path,{style:{stroke:n[0],strokeWidth:Y,fill:"none"},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{pathLength:0,d:ge(i.filter(e=>!g.checkIfNullOrUndefined(e.y1)))||"",opacity:1},whileInView:{pathLength:1,d:ge(i.filter(e=>!g.checkIfNullOrUndefined(e.y1)))||"",opacity:1,transition:{duration:s.duration}}},initial:"initial",animate:p?"whileInView":"initial"}),t.jsxRuntimeExports.jsx(b.motion.path,{d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",style:{stroke:n[1],strokeWidth:Y,fill:"none"},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{pathLength:0,d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",opacity:1},whileInView:{pathLength:1,d:de(i.filter(e=>!g.checkIfNullOrUndefined(e.y2)))||"",opacity:1,transition:{duration:s.duration}}},initial:"initial",animate:p?"whileInView":"initial"}),O?t.jsxRuntimeExports.jsx("line",{y1:0,y2:a,x1:x(O.date),x2:x(O.date),className:t.mo("undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",r?.mouseOverLine),style:o?.mouseOverLine}):null]}),t.jsxRuntimeExports.jsx("g",{children:i.map((e,D)=>t.jsxRuntimeExports.jsxs(b.motion.g,{children:[g.checkIfNullOrUndefined(e.y1)?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[P?t.jsxRuntimeExports.jsx(b.motion.circle,{r:u/i.length<5?0:u/i.length<20?2:4,style:{fill:n[0]},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,cx:x(e.date),cy:q(e.y1)},whileInView:{opacity:1,transition:{duration:m?s.duration:.5,delay:m?0:s.duration},cx:x(e.date),cy:q(e.y1)}},initial:"initial",animate:p?"whileInView":"initial"}):null,G?t.jsxRuntimeExports.jsx(b.motion.text,{dy:g.checkIfNullOrUndefined(e.y2)||e.y2<e.y1?-8:"1em",style:{fill:n[0],textAnchor:"middle",...o?.graphObjectValues||{}},className:t.mo("graph-value graph-value-line-1 text-xs font-bold",r?.graphObjectValues),exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,x:x(e.date),y:y(e.y1)},whileInView:{opacity:1,x:x(e.date),y:y(e.y1),transition:{duration:m?s.duration:.5,delay:m?0:s.duration}}},initial:"initial",animate:p?"whileInView":"initial",children:ne.numberFormattingFunction(e.y1,"NA",A,T[0],M[0])}):null]}),g.checkIfNullOrUndefined(e.y2)?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[P?t.jsxRuntimeExports.jsx(b.motion.circle,{r:u/i.length<5?0:u/i.length<20?2:4,style:{fill:n[1]},exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,cx:x(e.date),cy:y(e.y2)},whileInView:{opacity:1,transition:{duration:m?s.duration:.5,delay:m?0:s.duration},cx:x(e.date),cy:y(e.y2)}},initial:"initial",animate:p?"whileInView":"initial"}):null,G?t.jsxRuntimeExports.jsx(b.motion.text,{dy:g.checkIfNullOrUndefined(e.y1)||e.y1<e.y2?-8:"1em",style:{fill:n[1],textAnchor:"middle",...o?.graphObjectValues||{}},className:t.mo("graph-value graph-value-line-2 text-xs font-bold",r?.graphObjectValues),exit:{opacity:0,transition:{duration:s.duration}},variants:{initial:{opacity:0,x:x(e.date),y:y(e.y2)},whileInView:{opacity:1,x:x(e.date),y:y(e.y2),transition:{duration:m?s.duration:.5,delay:m?0:s.duration}}},initial:"initial",animate:p?"whileInView":"initial",children:ne.numberFormattingFunction(e.y2,"NA",A,T[1],M[1])}):null]})]},D))}),H.filter(e=>e.position==="after").map(e=>e.layer),t.jsxRuntimeExports.jsx("rect",{ref:w,style:{fill:"none",pointerEvents:"all"},width:u,height:a})]})}),O&&v&&Q&&_?t.jsxRuntimeExports.jsx(Ne.Tooltip,{data:O,body:v,xPos:Q,yPos:_,backgroundStyle:o?.tooltip,className:r?.tooltip}):null]})}function Pe(ae){const{data:k,graphTitle:R,sources:S,graphDescription:n,height:h,width:c,footNote:j,noOfXTicks:G=10,dateFormat:oe="yyyy",showValues:le=!1,padding:W,lineColors:X=[Ee.Colors.light.categoricalColors.colors[0],Ee.Colors.light.categoricalColors.colors[1]],sameAxes:xe=!1,backgroundColor:v=!1,leftMargin:ce=80,rightMargin:C=80,topMargin:s=20,bottomMargin:Y=25,labels:P,lineSuffixes:B=["",""],linePrefixes:M=["",""],tooltip:T,highlightAreaSettings:z=[],relativeHeight:N,onSeriesMouseOver:V,graphID:o,graphDownload:r=!1,dataDownload:A=!1,animate:H=!1,strokeWidth:J=2,showDots:p=!0,language:m="en",showColorScale:ue=!0,minHeight:I=0,colorLegendTitle:O,theme:K="light",ariaLabel:Q,noOfYTicks:Z=5,maxDate:_,minDate:ee,curveType:f="curve",styles:w,classNames:i,precision:me=2,customLayers:u=[]}=ae,[a,te]=d.useState(0),[ie,$]=d.useState(0),E=d.useRef(null),L=d.useRef(null);return d.useEffect(()=>{const l=new ResizeObserver(U=>{te(c||U[0].target.clientWidth||620),$(h||U[0].target.clientHeight||480)});return E.current&&($(E.current.clientHeight||480),te(E.current.clientWidth||620),c||l.observe(E.current)),()=>l.disconnect()},[c,h]),t.jsxRuntimeExports.jsx("div",{className:`${K||"light"} flex ${c?"w-fit grow-0":"w-full grow"}`,dir:m==="he"||m==="ar"?"rtl":void 0,children:t.jsxRuntimeExports.jsx("div",{className:t.mo(`${v?v===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${m||"en"}`,i?.graphContainer),style:{...w?.graphContainer||{},...v&&v!==!0?{backgroundColor:v}:{}},id:o,ref:L,"aria-label":Q||`${R?`The graph shows ${R}. `:""}This is a line chart that show trends for two datasets over time.${n?` ${n}`:""}`,children:t.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:v?W||"1rem":W||0},children:t.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[R||n||r||A?t.jsxRuntimeExports.jsx(Ve.GraphHeader,{styles:{title:w?.title,description:w?.description},classNames:{title:i?.title,description:i?.description},graphTitle:R,graphDescription:n,width:c,graphDownload:r?L.current:void 0,dataDownload:A?k.map(l=>l.data).filter(l=>l!==void 0).length>0?k.map(l=>l.data).filter(l=>l!==void 0):k.filter(l=>l!==void 0):null}):null,t.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:k.length===0?t.jsxRuntimeExports.jsx(Fe.EmptyState,{}):t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[ue?null:t.jsxRuntimeExports.jsx($e.ColorLegend,{colorDomain:P,colorLegendTitle:O,colors:X,showNAColor:!1}),t.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:E,"aria-label":"Graph area",children:(c||a)&&(h||ie)?t.jsxRuntimeExports.jsx(Ce,{data:k,sameAxes:xe,lineColors:X,width:c||a,height:Math.max(I,h||(N?I?(c||a)*N>I?(c||a)*N:I:(c||a)*N:ie)),dateFormat:oe,showValues:le,noOfXTicks:G,leftMargin:ce,rightMargin:C,topMargin:s,bottomMargin:Y,labels:P,highlightAreaSettings:z,tooltip:T,onSeriesMouseOver:V,animate:H===!0?{duration:.5,once:!0,amount:.5}:H||{duration:0,once:!0,amount:0},strokeWidth:J,showDots:p,noOfYTicks:Z,lineSuffixes:B,linePrefixes:M,minDate:ee,maxDate:_,curveType:f,styles:w,classNames:i,precision:me,customLayers:u}):null})]})}),S||j?t.jsxRuntimeExports.jsx(Te.GraphFooter,{styles:{footnote:w?.footnote,source:w?.source},classNames:{footnote:i?.footnote,source:i?.source},sources:S,footNote:j,width:c}):null]})})})})}exports.DualAxisLineChart=Pe;
|
|
2
2
|
//# sourceMappingURL=DualAxisLineChart.cjs.map
|
|
@@ -8,16 +8,16 @@ import { c as p } from "./checkIfNullOrUndefined-DmfiKkNw.js";
|
|
|
8
8
|
import { X as Tt } from "./XTicksAndGridLines-Bn9u5gOM.js";
|
|
9
9
|
import { A as pt } from "./Axis-Ddg-seDi.js";
|
|
10
10
|
import { A as jt } from "./AxisTitle-BmHLMRJZ.js";
|
|
11
|
-
import { H as Vt } from "./index-
|
|
12
|
-
import {
|
|
13
|
-
import { t as St } from "./time-BzJP5SPC.js";
|
|
11
|
+
import { H as Vt } from "./index-Cdcfp4nk.js";
|
|
12
|
+
import { t as Ot } from "./time-BzJP5SPC.js";
|
|
14
13
|
import { a as At } from "./linear-DUdu7l2G.js";
|
|
15
|
-
import { l as bt, c as
|
|
16
|
-
import { c as
|
|
17
|
-
import { s as
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
14
|
+
import { l as bt, c as St } from "./line-CPfhohvF.js";
|
|
15
|
+
import { c as Ct, s as Ft, a as Ht, m as Pt } from "./step-BrDul-H4.js";
|
|
16
|
+
import { s as Wt } from "./select-DKy99ogv.js";
|
|
17
|
+
import { a as Xt } from "./init-BhZylTFx.js";
|
|
18
|
+
import { p as Et } from "./pointer-CWRWOsrb.js";
|
|
19
|
+
import { u as Yt } from "./use-in-view-yS6jzJAp.js";
|
|
20
|
+
import { m as N } from "./proxy-CkpFesk1.js";
|
|
21
21
|
import { GraphFooter as Gt } from "./GraphFooter.js";
|
|
22
22
|
import { GraphHeader as Rt } from "./GraphHeader.js";
|
|
23
23
|
import { ColorLegend as Bt } from "./ColorLegend.js";
|
|
@@ -54,7 +54,7 @@ function Ut(ot) {
|
|
|
54
54
|
classNames: n,
|
|
55
55
|
precision: b,
|
|
56
56
|
customLayers: E
|
|
57
|
-
} = ot, K = rt(null), d =
|
|
57
|
+
} = ot, K = rt(null), d = Yt(K, {
|
|
58
58
|
once: a.once,
|
|
59
59
|
amount: a.amount
|
|
60
60
|
}), [h, ht] = P(!1);
|
|
@@ -69,7 +69,7 @@ function Ut(ot) {
|
|
|
69
69
|
return () => clearTimeout(t);
|
|
70
70
|
}
|
|
71
71
|
}, [d, h, a.duration]);
|
|
72
|
-
const M = F === "linear" ?
|
|
72
|
+
const M = F === "linear" ? St : F === "step" ? Ct : F === "stepAfter" ? Ft : F === "stepBefore" ? Ht : Pt, [$, Q] = P(void 0), [Z, _] = P(void 0), [tt, it] = P(void 0), g = {
|
|
73
73
|
top: z,
|
|
74
74
|
bottom: mt,
|
|
75
75
|
left: B + 50,
|
|
@@ -86,7 +86,7 @@ function Ut(ot) {
|
|
|
86
86
|
t.coordinates[0] === null ? null : G(`${t.coordinates[0]}`, f, /* @__PURE__ */ new Date()),
|
|
87
87
|
t.coordinates[1] === null ? null : G(`${t.coordinates[1]}`, f, /* @__PURE__ */ new Date())
|
|
88
88
|
]
|
|
89
|
-
})), x = A - g.left - g.right, r = O - g.top - g.bottom, et = J ? G(`${J}`, f, /* @__PURE__ */ new Date()) : e[0].date, at = L ? G(`${L}`, f, /* @__PURE__ */ new Date()) : e[e.length - 1].date, H = Math.min(...e.map((t) => t.y1).filter((t) => t != null)) !== 1 / 0 ? Math.min(...e.map((t) => t.y2).filter((t) => t != null)) > 0 ? 0 : Math.min(...e.map((t) => t.y1).filter((t) => t != null)) : 0, j = Math.min(...e.map((t) => t.y2).filter((t) => t != null)) !== 1 / 0 ? Math.min(...e.map((t) => t.y2).filter((t) => t != null)) > 0 ? 0 : Math.min(...e.map((t) => t.y2).filter((t) => t != null)) : 0, I = Math.max(...e.map((t) => t.y1).filter((t) => t != null)) !== 1 / 0 ? Math.max(...e.map((t) => t.y1).filter((t) => t != null)) : 0, l = Math.max(...e.map((t) => t.y2).filter((t) => t != null)) !== 1 / 0 ? Math.max(...e.map((t) => t.y2).filter((t) => t != null)) : 0, Y = H < j ? H : j, st = I > l ? I : l, c =
|
|
89
|
+
})), x = A - g.left - g.right, r = O - g.top - g.bottom, et = J ? G(`${J}`, f, /* @__PURE__ */ new Date()) : e[0].date, at = L ? G(`${L}`, f, /* @__PURE__ */ new Date()) : e[e.length - 1].date, H = Math.min(...e.map((t) => t.y1).filter((t) => t != null)) !== 1 / 0 ? Math.min(...e.map((t) => t.y2).filter((t) => t != null)) > 0 ? 0 : Math.min(...e.map((t) => t.y1).filter((t) => t != null)) : 0, j = Math.min(...e.map((t) => t.y2).filter((t) => t != null)) !== 1 / 0 ? Math.min(...e.map((t) => t.y2).filter((t) => t != null)) > 0 ? 0 : Math.min(...e.map((t) => t.y2).filter((t) => t != null)) : 0, I = Math.max(...e.map((t) => t.y1).filter((t) => t != null)) !== 1 / 0 ? Math.max(...e.map((t) => t.y1).filter((t) => t != null)) : 0, l = Math.max(...e.map((t) => t.y2).filter((t) => t != null)) !== 1 / 0 ? Math.max(...e.map((t) => t.y2).filter((t) => t != null)) : 0, Y = H < j ? H : j, st = I > l ? I : l, c = Ot().domain([et, at]).range([0, x]), T = At().domain([
|
|
90
90
|
m ? Y : H,
|
|
91
91
|
m ? st > 0 ? st : 0 : I > 0 ? I : 0
|
|
92
92
|
]).range([r, 0]).nice(), u = At().domain([
|
|
@@ -95,16 +95,16 @@ function Ut(ot) {
|
|
|
95
95
|
]).range([r, 0]).nice(), ft = bt().defined((t) => !p(t.y1)).x((t) => c(t.date)).y((t) => T(t.y1)).curve(M), dt = bt().defined((t) => !p(t.y2)).x((t) => c(t.date)).y((t) => u(t.y2)).curve(M), kt = T.ticks(q), Dt = u.ticks(q), vt = c.ticks(lt);
|
|
96
96
|
return gt(() => {
|
|
97
97
|
const t = (ut) => {
|
|
98
|
-
const wt = e[
|
|
98
|
+
const wt = e[Xt(
|
|
99
99
|
e.map((Lt) => Lt.date),
|
|
100
|
-
c.invert(
|
|
100
|
+
c.invert(Et(ut)[0]),
|
|
101
101
|
1
|
|
102
102
|
)];
|
|
103
103
|
Q(wt || e[e.length - 1]), W?.(wt || e[e.length - 1]), it(ut.clientY), _(ut.clientX);
|
|
104
104
|
}, V = () => {
|
|
105
105
|
Q(void 0), _(void 0), it(void 0), W?.(void 0);
|
|
106
106
|
};
|
|
107
|
-
|
|
107
|
+
Wt(w.current).on("mousemove", t).on("mouseout", V);
|
|
108
108
|
}, [c, e, W]), /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
|
|
109
109
|
/* @__PURE__ */ i.jsx(
|
|
110
110
|
N.svg,
|
package/dist/DumbbellChart.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index-CHPV5EwG-DDoeWRVt.cjs"),x=require("react"),Oe=require("./index-BzeLQvXk.cjs"),we=require("./parse-hMnG_lRV.cjs"),je=require("./getSliderMarks-CtsEXiLV.cjs"),Te=require("./index-CZbIGs8q.cjs"),Le=require("./index-BXns0-ng.cjs"),Ve=require("./Modal-C_dl0EtQ.cjs"),Se=require("./numberFormattingFunction-02t-wJta.cjs"),$e=require("./Tooltip-n8z5bfav.cjs"),A=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),Ae=require("./string2HTML-D2Avudmb.cjs"),Ke=require("./XTicksAndGridLines-CCzXIV8d.cjs"),Fe=require("./AxisTitle-CK9YeovX.cjs"),Qe=require("./YAxesLabels-BXLTX7AI.cjs"),qe=require("./YTicksAndGridLines-DBDuz6vb.cjs"),Pe=require("./ReferenceLine-CuFMk0cI.cjs"),Be=require("./use-in-view-BCmzDU2O.cjs"),He=require("./linear-BVckp9RD.cjs"),We=require("./band-CAApY4Pd.cjs"),le=require("./proxy-PQd2AItT.cjs"),Ue=require("./index-DVOJ7vxH.cjs"),Ge=require("./GraphHeader.cjs"),Xe=require("./GraphFooter.cjs"),Ye=require("./ColorLegendWithMouseOver.cjs"),_e=require("./Colors.cjs"),ze=require("./EmptyState-d8_8SxeW.cjs"),Me=require("./index-BW_-wD2k.cjs"),ke=require("./ensureCompleteData-DqWQ2Zbi.cjs"),Je=require("./init-DU0ybBc_.cjs"),Ze=require("./Axis-DE7dSn1_.cjs"),et=require("./XAxesLabels-CJMQbfVy.cjs");function tt(ye){const{data:o,dotColors:p,suffix:_,prefix:z,barPadding:v,showValues:ue,showTicks:Z,leftMargin:ee,truncateBy:xe,width:te,height:ie,rightMargin:J,topMargin:N,bottomMargin:s,radius:F,showLabels:ce,tooltip:O,onSeriesMouseOver:q,maxValue:E,minValue:ae,onSeriesMouseClick:B,selectedColor:I,arrowConnector:R,connectorStrokeWidth:pe,maxBarThickness:re,minBarThickness:ne,resetSelectionOnDoubleClick:ge,detailsOnClick:w,axisTitle:U,noOfTicks:fe,valueColor:se,styles:c,classNames:m,labelOrder:D,refValues:oe,rtl:y,animate:l,precision:M,customLayers:G,highlightedDataPoints:X,dimmedOpacity:L}=ye,j=x.useRef(null),h=Be.useInView(j,{once:l.once,amount:l.amount}),d={top:U?N+25:N,bottom:s,left:ee,right:J},H=te-d.left-d.right,W=ie-d.top-d.bottom,[K,P]=x.useState(void 0),[C,b]=x.useState(void 0),[S,Q]=x.useState(void 0),[V,$]=x.useState(void 0),Y=o.map((t,n)=>({...t,id:D?`${t.label}`:`${n}`})),k=D||Y.map(t=>`${t.id}`),g=He.linear().domain([ae,E]).range([0,H]).nice(),T=We.band().domain(k).range([0,ne?Math.max(W,ne*Y.length):re?Math.min(W,re*Y.length):W]).paddingInner(v),a=g.ticks(fe);return i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsxs(le.motion.svg,{width:`${te}px`,height:`${ie}px`,viewBox:`0 0 ${te} ${ie}`,direction:"ltr",ref:j,children:[R?i.jsxRuntimeExports.jsx("defs",{children:i.jsxRuntimeExports.jsx("marker",{id:"arrow",viewBox:"0 0 10 10",refX:"10",refY:"5",markerWidth:"6",markerHeight:"6",orient:"auto-start-reverse",children:i.jsxRuntimeExports.jsx("path",{d:"M 0 0 L 10 5 L 0 10 z",className:"fill-primary-gray-600 dark:fill-primary-gray-300"})})}):null,i.jsxRuntimeExports.jsxs("g",{transform:`translate(${d.left},${d.top})`,children:[Z?i.jsxRuntimeExports.jsx(Ke.XTicksAndGridLines,{values:a.filter((t,n)=>n!==0),x:a.filter((t,n)=>n!==0).map(t=>g(t)),y1:0-N,y2:W+d.bottom,styles:{gridLines:c?.xAxis?.gridLines,labels:c?.xAxis?.labels},classNames:{gridLines:m?.xAxis?.gridLines,labels:m?.xAxis?.labels},suffix:_,prefix:z,labelType:"secondary",showGridLines:!0,precision:M}):null,i.jsxRuntimeExports.jsx(Fe.AxisTitle,{x:H/2,y:0-d.top+15,style:c?.xAxis?.title,className:m?.xAxis?.title,text:U}),i.jsxRuntimeExports.jsx(qe.YTicksAndGridLines,{y:Y.map(t=>T(`${t.id}`)+T.bandwidth()/2),x1:0,x2:H,styles:{gridLines:c?.yAxis?.gridLines},classNames:{gridLines:m?.yAxis?.gridLines},labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:M}),G.filter(t=>t.position==="before").map(t=>t.layer),i.jsxRuntimeExports.jsxs(Ue.AnimatePresence,{children:[Y.map(t=>i.jsxRuntimeExports.jsxs(le.motion.g,{className:"undp-viz-g-with-hover",variants:{initial:{x:0,y:T(`${t.id}`)+T.bandwidth()/2,opacity:X.length!==0?X.indexOf(t.label)!==-1?.85:L:.85},whileInView:{x:0,y:T(`${t.id}`)+T.bandwidth()/2,opacity:X.length!==0?X.indexOf(t.label)!==-1?.85:L:.85,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",exit:{opacity:0,transition:{duration:l.duration}},children:[ce?i.jsxRuntimeExports.jsx(Qe.YAxesLabels,{value:`${t.label}`.length<xe?`${t.label}`:`${`${t.label}`.substring(0,xe)}...`,y:0-T.bandwidth()/2,x:0-d.left,width:d.left,height:T.bandwidth(),alignment:"right",style:c?.yAxis?.labels,className:m?.yAxis?.labels,animate:l,isInView:h}):null,i.jsxRuntimeExports.jsx(le.motion.line,{y1:0,y2:0,style:{strokeWidth:pe,...c?.dataConnectors||{},opacity:I?.3:1},className:i.mo("stroke-primary-gray-600 dark:stroke-primary-gray-300",m?.dataConnectors),markerEnd:R&&t.x.indexOf(Math.min(...t.x.filter(n=>n!==null)))===0?"url(#arrow)":"",markerStart:R&&t.x.indexOf(Math.min(...t.x.filter(n=>n!==null)))===t.x.length-1?"url(#arrow)":"",exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{x1:0,x2:0},whileInView:{x1:g(Math.min(...t.x.filter(n=>n!==null)))+F,x2:g(Math.max(...t.x.filter(n=>n!==null)))-F,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial"}),t.x.map((n,f)=>i.jsxRuntimeExports.jsx(le.motion.g,{onMouseEnter:de=>{P({...t,xIndex:f}),$(de.clientY),Q(de.clientX),q?.({...t,xIndex:f})},onClick:()=>{(B||w)&&(Le.isEqual(C,{...t,xIndex:f})&&ge?(b(void 0),B?.(void 0)):(b({...t,xIndex:f}),B&&B({...t,xIndex:f})))},onMouseMove:de=>{P({...t,xIndex:f}),$(de.clientY),Q(de.clientX)},onMouseLeave:()=>{P(void 0),Q(void 0),$(void 0),q?.(void 0)},exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{opacity:I?p[f]===I?1:.3:1},whileInView:{opacity:I?p[f]===I?1:.3:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",children:A.checkIfNullOrUndefined(n)?null:i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(le.motion.circle,{cy:0,r:F,style:{fill:p[f],fillOpacity:.85,stroke:p[f],strokeWidth:1,opacity:A.checkIfNullOrUndefined(n)?0:1},exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{cx:g(0),opacity:0},whileInView:{cx:g(n||0),opacity:A.checkIfNullOrUndefined(n)?0:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial"}),ue?i.jsxRuntimeExports.jsx(le.motion.text,{y:0,style:{fill:se||p[f],textAnchor:"middle",...c?.graphObjectValues||{}},dx:0,dy:0-F-3,className:i.mo("graph-value text-sm font-bold",A.checkIfNullOrUndefined(n)?"0opacity-0":"opacity-100",m?.graphObjectValues),exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{x:g(0),opacity:0},whileInView:{x:g(n||0),opacity:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",children:Se.numberFormattingFunction(n,"NA",M,z,_)}):null]})},f))]},t.label)),oe?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:oe.map((t,n)=>i.jsxRuntimeExports.jsx(Pe.RefLineX,{text:t.text,color:t.color,x:g(t.value),y1:0-d.top,y2:W+d.bottom,textSide:g(t.value)>H*.75||y?"left":"right",classNames:t.classNames,styles:t.styles,animate:l,isInView:h},n))}):null]}),G.filter(t=>t.position==="after").map(t=>t.layer)]})]}),K&&O&&S&&V?i.jsxRuntimeExports.jsx($e.Tooltip,{data:K,body:O,xPos:S,yPos:V,backgroundStyle:c?.tooltip,className:m?.tooltip}):null,w&&C!==void 0?i.jsxRuntimeExports.jsx(Ve.X,{open:C!==void 0,onClose:()=>{b(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof w=="string"?{__html:Ae.string2HTML(w,C)}:void 0,children:typeof w=="function"?w(C):null})}):null]})}function it(ye){const{data:o,graphTitle:p,colors:_=_e.Colors.light.categoricalColors.colors,sources:z,graphDescription:v,barPadding:ue=.25,showTicks:Z=!0,leftMargin:ee=100,rightMargin:xe=40,topMargin:te=20,bottomMargin:ie=10,truncateBy:J=999,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E=!1,radius:ae=3,showLabels:B=!0,tooltip:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne="",prefix:ge="",maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se=!1,dataDownload:c=!1,showValues:m=!0,sortParameter:D,arrowConnector:oe=!1,connectorStrokeWidth:y=2,language:l="en",minHeight:M=0,theme:G="light",labelOrder:X,maxBarThickness:L,maxNumberOfBars:j,minBarThickness:h,ariaLabel:d,resetSelectionOnDoubleClick:H=!0,detailsOnClick:W,axisTitle:K,noOfTicks:P=5,valueColor:C,styles:b,classNames:S,refValues:Q,filterNA:V=!0,animate:$=!1,precision:Y=2,customLayers:k=[],showColorScale:g=!0,highlightedDataPoints:T=[],dimmedOpacity:a=.3,timeline:t={enabled:!1,autoplay:!1,showOnlyActiveDate:!0}}=ye,[n,f]=x.useState(0),[de,Ee]=x.useState(0),[me,Ne]=x.useState(t.autoplay),u=je.sort(Te.uniqBy(o.filter(e=>e.date!==void 0&&e.date!==null),e=>e.date).map(e=>we.parse(`${e.date}`,t.dateFormat||"yyyy",new Date).getTime()),(e,r)=>Je.ascending(e,r)),[be,ve]=x.useState(t.autoplay?0:u.length-1),[Ie,De]=x.useState(void 0),he=x.useRef(null),Re=x.useRef(null);x.useEffect(()=>{const e=new ResizeObserver(r=>{f(s||r[0].target.clientWidth||620),Ee(N||r[0].target.clientHeight||480)});return he.current&&(Ee(he.current.clientHeight||480),f(he.current.clientWidth||620),s||e.observe(he.current)),()=>e.disconnect()},[s,N]),x.useEffect(()=>{const e=setInterval(()=>{ve(r=>r<u.length-1?r+1:0)},(t.speed||2)*1e3);return me||clearInterval(e),()=>clearInterval(e)},[u,me,t.speed]);const Ce=je.getSliderMarks(u,be,t.showOnlyActiveDate,t.dateFormat||"yyyy");return i.jsxRuntimeExports.jsx("div",{className:`${G||"light"} flex ${s?"w-fit grow-0":"w-full grow"}`,dir:l==="he"||l==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:i.mo(`${E?E===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l||"en"}`,S?.graphContainer),style:{...b?.graphContainer||{},...E&&E!==!0?{backgroundColor:E}:{}},id:re,ref:Re,"aria-label":d||`${p?`The graph shows ${p}. `:""}This is a dumbbell chart that shows comparisons between two or more data points across categories. ${v?` ${v}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:E?q||"1rem":q||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[p||v||se||c?i.jsxRuntimeExports.jsx(Ge.GraphHeader,{styles:{title:b?.title,description:b?.description},classNames:{title:S?.title,description:S?.description},graphTitle:p,graphDescription:v,width:s,graphDownload:se?Re.current:void 0,dataDownload:c?o.map(e=>e.data).filter(e=>e!==void 0).length>0?o.map(e=>e.data).filter(e=>e!==void 0):o.filter(e=>e!==void 0):null}):null,t.enabled&&u.length>0&&Ce?i.jsxRuntimeExports.jsxs("div",{className:"flex gap-6 items-center",dir:"ltr",children:[i.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Ne(!me)},className:"p-0 border-0 cursor-pointer bg-transparent","aria-label":me?"Click to pause animation":"Click to play animation",children:me?i.jsxRuntimeExports.jsx(Me.Pause,{}):i.jsxRuntimeExports.jsx(Me.Play,{})}),i.jsxRuntimeExports.jsx(je.xr,{min:u[0],max:u[u.length-1],marks:Ce,step:null,defaultValue:u[u.length-1],value:u[be],onChangeComplete:e=>{ve(u.indexOf(e))},onChange:e=>{ve(u.indexOf(e))},"aria-label":"Time slider. Use arrow keys to adjust selected time period."})]}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:o.length===0?i.jsxRuntimeExports.jsx(ze.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[g?i.jsxRuntimeExports.jsx(Ye.ColorLegendWithMouseOver,{width:s,colorDomain:ce,colors:_,colorLegendTitle:O,setSelectedColor:De,showNAColor:!1}):null,i.jsxRuntimeExports.jsx("div",{className:"flex grow w-full justify-center leading-0",ref:he,"aria-label":"Graph area",children:(s||n)&&(N||de)?i.jsxRuntimeExports.jsx(tt,{data:D!==void 0?D==="diff"?Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[e.x.length-1])||A.checkIfNullOrUndefined(e.x[0])?-1/0:e.x[e.x.length-1]-e.x[0]).reverse().filter((e,r)=>j?r<j:!0):Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[D])?-1/0:e.x[D]).reverse().filter((e,r)=>j?r<j:!0):ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>V?!e.x.every(r=>r==null):e).filter((e,r)=>j?r<j:!0),dotColors:_,width:s||n,height:Math.max(M,N||(R?M?(s||n)*R>M?(s||n)*R:M:(s||n)*R:de)),suffix:ne,prefix:ge,radius:ae,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,showLabels:B,showValues:m,tooltip:I,onSeriesMouseOver:pe,maxValue:A.checkIfNullOrUndefined(w)?Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null))))<0?0:Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null)))):w,minValue:A.checkIfNullOrUndefined(U)?Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null))))>0?0:Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null)))):U,onSeriesMouseClick:fe,selectedColor:Ie,arrowConnector:oe,connectorStrokeWidth:y,maxBarThickness:L,minBarThickness:h,resetSelectionOnDoubleClick:H,detailsOnClick:W,axisTitle:K,noOfTicks:P,valueColor:C,styles:b,classNames:S,labelOrder:X,refValues:Q,rtl:l==="he"||l==="ar",animate:$===!0?{duration:.5,once:!0,amount:.5}:$||{duration:0,once:!0,amount:0},precision:Y,customLayers:k,highlightedDataPoints:T,dimmedOpacity:a}):null})]})}),z||F?i.jsxRuntimeExports.jsx(Xe.GraphFooter,{styles:{footnote:b?.footnote,source:b?.source},classNames:{footnote:S?.footnote,source:S?.source},sources:z,footNote:F,width:s}):null]})})})})}function at(ye){const{data:o,dotColors:p,barPadding:_,showTicks:z,leftMargin:v,truncateBy:ue,width:Z,height:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,radius:J,showLabels:N,tooltip:s,onSeriesMouseOver:F,maxValue:ce,minValue:O,onSeriesMouseClick:q,showValues:E,suffix:ae,prefix:B,selectedColor:I,arrowConnector:R,connectorStrokeWidth:pe,maxBarThickness:re,minBarThickness:ne,resetSelectionOnDoubleClick:ge,detailsOnClick:w,axisTitle:U,noOfTicks:fe,valueColor:se,styles:c,classNames:m,labelOrder:D,refValues:oe,animate:y,precision:l,customLayers:M,highlightedDataPoints:G,dimmedOpacity:X}=ye,L=x.useRef(null),j=Be.useInView(L,{once:y.once,amount:y.amount}),h={top:te,bottom:ie,left:U?v+30:v,right:xe},d=Z-h.left-h.right,H=ee-h.top-h.bottom,[W,K]=x.useState(void 0),[P,C]=x.useState(void 0),[b,S]=x.useState(void 0),[Q,V]=x.useState(void 0),$=o.map((a,t)=>({...a,id:D?`${a.label}`:`${t}`})),Y=D||$.map(a=>`${a.id}`),k=He.linear().domain([O,ce]).range([H,0]).nice(),g=We.band().domain(Y).range([0,ne?Math.max(d,ne*$.length):re?Math.min(d,re*$.length):d]).paddingInner(_),T=k.ticks(fe);return i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsxs(le.motion.svg,{width:`${Z}px`,height:`${ee}px`,viewBox:`0 0 ${Z} ${ee}`,direction:"ltr",ref:L,children:[R?i.jsxRuntimeExports.jsx("defs",{children:i.jsxRuntimeExports.jsx("marker",{id:"arrow",viewBox:"0 0 10 10",refX:"10",refY:"5",markerWidth:"6",markerHeight:"6",orient:"auto-start-reverse",children:i.jsxRuntimeExports.jsx("path",{d:"M 0 0 L 10 5 L 0 10 z",className:"fill-primary-gray-600 dark:fill-primary-gray-300"})})}):null,i.jsxRuntimeExports.jsxs("g",{transform:`translate(${h.left},${h.top})`,children:[i.jsxRuntimeExports.jsx(Ze.Axis,{y1:k(O<0?0:O),y2:k(O<0?0:O),x1:0-v,x2:d+h.right,label:Se.numberFormattingFunction(O<0?0:O,"NA",l,B,ae),labelPos:{x:0-v,dx:0,dy:ce<0?"1em":-5,y:k(O<0?0:O)},classNames:{axis:m?.xAxis?.axis,label:m?.yAxis?.labels},styles:{axis:c?.xAxis?.axis,label:c?.yAxis?.labels}}),z?i.jsxRuntimeExports.jsx(qe.YTicksAndGridLines,{values:T.filter(a=>a!==0),y:T.filter(a=>a!==0).map(a=>k(a)),x1:0-v,x2:d+h.right,styles:{gridLines:c?.yAxis?.gridLines,labels:c?.yAxis?.labels},classNames:{gridLines:m?.yAxis?.gridLines,labels:m?.yAxis?.labels},suffix:ae,prefix:B,labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:l}):null,i.jsxRuntimeExports.jsx(Fe.AxisTitle,{x:0-v-15,y:H/2,style:c?.yAxis?.title,className:m?.yAxis?.title,text:U,rotate90:!0}),M.filter(a=>a.position==="before").map(a=>a.layer),i.jsxRuntimeExports.jsxs(Ue.AnimatePresence,{children:[$.map(a=>i.jsxRuntimeExports.jsxs(le.motion.g,{className:"undp-viz-g-with-hover",variants:{initial:{x:g(`${a.id}`)+g.bandwidth()/2,y:0,opacity:G.length!==0?G.indexOf(a.label)!==-1?.85:X:.85},whileInView:{x:g(`${a.id}`)+g.bandwidth()/2,y:0,opacity:G.length!==0?G.indexOf(a.label)!==-1?.85:X:.85,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",exit:{opacity:0,transition:{duration:y.duration}},children:[N?i.jsxRuntimeExports.jsx(et.XAxesLabels,{value:`${a.label}`.length<ue?`${a.label}`:`${`${a.label}`.substring(0,ue)}...`,y:H+5,x:0-g.bandwidth()/2,width:g.bandwidth(),height:h.bottom,style:c?.xAxis?.labels,className:m?.xAxis?.labels,alignment:"top",animate:y,isInView:j}):null,i.jsxRuntimeExports.jsx(le.motion.line,{x1:0,x2:0,style:{strokeWidth:pe,...c?.dataConnectors||{},opacity:I?.3:1},className:i.mo("stroke-primary-gray-600 dark:stroke-primary-gray-300",m?.dataConnectors),markerEnd:R&&a.x.indexOf(Math.min(...a.x.filter(t=>t!==null)))===0?"url(#arrow)":"",markerStart:R&&a.x.indexOf(Math.min(...a.x.filter(t=>t!==null)))===a.x.length-1?"url(#arrow)":"",exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{y1:0,y2:0},whileInView:{y1:k(Math.min(...a.x.filter(t=>t!==null)))+J,y2:k(Math.max(...a.x.filter(t=>t!==null)))-J,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial"}),a.x.map((t,n)=>i.jsxRuntimeExports.jsx(le.motion.g,{onMouseEnter:f=>{K({...a,xIndex:n}),V(f.clientY),S(f.clientX),F?.({...a,xIndex:n})},onClick:()=>{(q||w)&&(Le.isEqual(P,{...a,xIndex:n})&&ge?(C(void 0),q?.(void 0)):(C({...a,xIndex:n}),q&&q({...a,xIndex:n})))},onMouseMove:f=>{K({...a,xIndex:n}),V(f.clientY),S(f.clientX)},onMouseLeave:()=>{K(void 0),S(void 0),V(void 0),F?.(void 0)},exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{opacity:I?p[n]===I?1:.3:1},whileInView:{opacity:I?p[n]===I?1:.3:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",children:A.checkIfNullOrUndefined(t)?null:i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(le.motion.circle,{cx:0,r:J,style:{fill:p[n],fillOpacity:.85,stroke:p[n],strokeWidth:1},exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{cy:k(0),opacity:0},whileInView:{cy:k(t||0),opacity:A.checkIfNullOrUndefined(t)?0:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial"}),E?i.jsxRuntimeExports.jsx(le.motion.text,{x:0,style:{fill:se||p[n],textAnchor:"start",...c?.graphObjectValues||{}},className:i.mo("graph-value text-sm font-bold",A.checkIfNullOrUndefined(t)?"opacity-0":"opacity-100",m?.graphObjectValues),dx:J+3,dy:"0.33em",exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{y:k(0),opacity:0},whileInView:{y:k(t||0),opacity:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",children:Se.numberFormattingFunction(t,"NA",l,B,ae)}):null]})},n))]},a.label)),oe?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:oe.map((a,t)=>i.jsxRuntimeExports.jsx(Pe.RefLineY,{text:a.text,color:a.color,y:k(a.value),x1:0-v,x2:d+h.right,classNames:a.classNames,styles:a.styles,animate:y,isInView:j},t))}):null]}),M.filter(a=>a.position==="after").map(a=>a.layer)]})]}),W&&s&&b&&Q?i.jsxRuntimeExports.jsx($e.Tooltip,{data:W,body:s,xPos:b,yPos:Q,backgroundStyle:c?.tooltip,className:m?.tooltip}):null,w&&P!==void 0?i.jsxRuntimeExports.jsx(Ve.X,{open:P!==void 0,onClose:()=>{C(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof w=="string"?{__html:Ae.string2HTML(w,P)}:void 0,children:typeof w=="function"?w(P):null})}):null]})}function rt(ye){const{data:o,graphTitle:p,colors:_=_e.Colors.light.categoricalColors.colors,sources:z,graphDescription:v,barPadding:ue=.25,showTicks:Z=!0,leftMargin:ee=20,rightMargin:xe=20,topMargin:te=20,bottomMargin:ie=25,truncateBy:J=999,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E=!1,radius:ae=3,tooltip:B,showLabels:I=!0,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne="",prefix:ge="",maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se=!1,dataDownload:c=!1,showValues:m=!0,sortParameter:D,arrowConnector:oe=!1,connectorStrokeWidth:y=2,language:l="en",minHeight:M=0,theme:G="light",maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d=!0,detailsOnClick:H,axisTitle:W,noOfTicks:K=5,valueColor:P,styles:C,classNames:b,labelOrder:S,refValues:Q,filterNA:V=!0,animate:$=!1,precision:Y=2,customLayers:k=[],showColorScale:g=!0,highlightedDataPoints:T=[],dimmedOpacity:a=.3,timeline:t={enabled:!1,autoplay:!1,showOnlyActiveDate:!0}}=ye,[n,f]=x.useState(0),[de,Ee]=x.useState(0),[me,Ne]=x.useState(t.autoplay),u=je.sort(Te.uniqBy(o.filter(e=>e.date!==void 0&&e.date!==null),e=>e.date).map(e=>we.parse(`${e.date}`,t.dateFormat||"yyyy",new Date).getTime()),(e,r)=>Je.ascending(e,r)),[be,ve]=x.useState(t.autoplay?0:u.length-1),[Ie,De]=x.useState(void 0),he=x.useRef(null),Re=x.useRef(null);x.useEffect(()=>{const e=new ResizeObserver(r=>{f(s||r[0].target.clientWidth||620),Ee(N||r[0].target.clientHeight||480)});return he.current&&(Ee(he.current.clientHeight||480),f(he.current.clientWidth||620),s||e.observe(he.current)),()=>e.disconnect()},[s,N]),x.useEffect(()=>{const e=setInterval(()=>{ve(r=>r<u.length-1?r+1:0)},(t.speed||2)*1e3);return me||clearInterval(e),()=>clearInterval(e)},[u,me,t.speed]);const Ce=je.getSliderMarks(u,be,t.showOnlyActiveDate,t.dateFormat||"yyyy");return i.jsxRuntimeExports.jsx("div",{className:`${G||"light"} flex ${s?"w-fit grow-0":"w-full grow"}`,dir:l==="he"||l==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:i.mo(`${E?E===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l||"en"}`,b?.graphContainer),style:{...C?.graphContainer||{},...E&&E!==!0?{backgroundColor:E}:{}},id:re,ref:Re,"aria-label":h||`${p?`The graph shows ${p}. `:""}This is a dumbbell chart that shows comparisons between two or more data points across categories. ${v?` ${v}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:E?q||"1rem":q||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[p||v||se||c?i.jsxRuntimeExports.jsx(Ge.GraphHeader,{styles:{title:C?.title,description:C?.description},classNames:{title:b?.title,description:b?.description},graphTitle:p,graphDescription:v,width:s,graphDownload:se?Re.current:void 0,dataDownload:c?o.map(e=>e.data).filter(e=>e!==void 0).length>0?o.map(e=>e.data).filter(e=>e!==void 0):o.filter(e=>e!==void 0):null}):null,t.enabled&&u.length>0&&Ce?i.jsxRuntimeExports.jsxs("div",{className:"flex gap-6 items-center",dir:"ltr",children:[i.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Ne(!me)},className:"p-0 border-0 cursor-pointer bg-transparent","aria-label":me?"Click to pause animation":"Click to play animation",children:me?i.jsxRuntimeExports.jsx(Me.Pause,{}):i.jsxRuntimeExports.jsx(Me.Play,{})}),i.jsxRuntimeExports.jsx(je.xr,{min:u[0],max:u[u.length-1],marks:Ce,step:null,defaultValue:u[u.length-1],value:u[be],onChangeComplete:e=>{ve(u.indexOf(e))},onChange:e=>{ve(u.indexOf(e))},"aria-label":"Time slider. Use arrow keys to adjust selected time period."})]}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:o.length===0?i.jsxRuntimeExports.jsx(ze.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[g?i.jsxRuntimeExports.jsx(Ye.ColorLegendWithMouseOver,{width:s,colorDomain:ce,colors:_,colorLegendTitle:O,setSelectedColor:De,showNAColor:!1}):null,i.jsxRuntimeExports.jsx("div",{className:"flex grow w-full justify-center leading-0",ref:he,"aria-label":"Graph area",children:(s||n)&&(N||de)?i.jsxRuntimeExports.jsx(at,{data:D!==void 0?D==="diff"?Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[e.x.length-1])||A.checkIfNullOrUndefined(e.x[0])?-1/0:e.x[e.x.length-1]-e.x[0]).filter((e,r)=>L?r<L:!0):Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[D])?-1/0:e.x[D]).filter((e,r)=>L?r<L:!0):ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>V?!e.x.every(r=>r==null):e).filter((e,r)=>L?r<L:!0),dotColors:_,width:s||n,height:Math.max(M,N||(R?M?(s||n)*R>M?(s||n)*R:M:(s||n)*R:de)),radius:ae,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,showLabels:I,showValues:m,tooltip:B,suffix:ne,prefix:ge,onSeriesMouseOver:pe,maxValue:A.checkIfNullOrUndefined(w)?Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null))))<0?0:Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null)))):w,minValue:A.checkIfNullOrUndefined(U)?Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null))))>0?0:Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null)))):U,onSeriesMouseClick:fe,selectedColor:Ie,arrowConnector:oe,connectorStrokeWidth:y,maxBarThickness:X,minBarThickness:j,resetSelectionOnDoubleClick:d,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,styles:C,classNames:b,labelOrder:S,refValues:Q,animate:$===!0?{duration:.5,once:!0,amount:.5}:$||{duration:0,once:!0,amount:0},precision:Y,customLayers:k,highlightedDataPoints:T,dimmedOpacity:a}):null})]})}),z||F?i.jsxRuntimeExports.jsx(Xe.GraphFooter,{styles:{footnote:C?.footnote,source:C?.source},classNames:{footnote:b?.footnote,source:b?.source},sources:z,footNote:F,width:s}):null]})})})})}function nt(ye){const{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,orientation:C="vertical",styles:b,classNames:S,labelOrder:Q,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n}=ye;return C==="vertical"?i.jsxRuntimeExports.jsx(rt,{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,styles:b,detailsOnClick:H,axisTitle:W,noOfTicks:K,labelOrder:Q,valueColor:P,classNames:S,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n}):i.jsxRuntimeExports.jsx(it,{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,styles:b,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,classNames:S,labelOrder:Q,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n})}exports.DumbbellChart=nt;
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("./index-CHPV5EwG-DDoeWRVt.cjs"),x=require("react"),Oe=require("./index-BzeLQvXk.cjs"),we=require("./parse-hMnG_lRV.cjs"),je=require("./getSliderMarks-CtsEXiLV.cjs"),Te=require("./index-CZbIGs8q.cjs"),Le=require("./index-BXns0-ng.cjs"),Ve=require("./Modal-tXZlLE5s.cjs"),Se=require("./numberFormattingFunction-02t-wJta.cjs"),$e=require("./Tooltip-n8z5bfav.cjs"),A=require("./checkIfNullOrUndefined-BCW3Y1ML.cjs"),Ae=require("./string2HTML-D2Avudmb.cjs"),Ke=require("./XTicksAndGridLines-CCzXIV8d.cjs"),Fe=require("./AxisTitle-CK9YeovX.cjs"),Qe=require("./YAxesLabels-D8IydyZj.cjs"),qe=require("./YTicksAndGridLines-DBDuz6vb.cjs"),Pe=require("./ReferenceLine-CFVBBN__.cjs"),Be=require("./linear-BVckp9RD.cjs"),He=require("./band-CAApY4Pd.cjs"),We=require("./use-in-view-sQJZ_xDO.cjs"),le=require("./proxy-BHRoeZgd.cjs"),Ue=require("./index-BW8iNx7E.cjs"),Ge=require("./GraphHeader.cjs"),Xe=require("./GraphFooter.cjs"),Ye=require("./ColorLegendWithMouseOver.cjs"),_e=require("./Colors.cjs"),ze=require("./EmptyState-d8_8SxeW.cjs"),Me=require("./index-BW_-wD2k.cjs"),ke=require("./ensureCompleteData-DqWQ2Zbi.cjs"),Je=require("./init-DU0ybBc_.cjs"),Ze=require("./Axis-DE7dSn1_.cjs"),et=require("./XAxesLabels-OjBNl_lS.cjs");function tt(ye){const{data:o,dotColors:p,suffix:_,prefix:z,barPadding:v,showValues:ue,showTicks:Z,leftMargin:ee,truncateBy:xe,width:te,height:ie,rightMargin:J,topMargin:N,bottomMargin:s,radius:F,showLabels:ce,tooltip:O,onSeriesMouseOver:q,maxValue:E,minValue:ae,onSeriesMouseClick:B,selectedColor:I,arrowConnector:R,connectorStrokeWidth:pe,maxBarThickness:re,minBarThickness:ne,resetSelectionOnDoubleClick:ge,detailsOnClick:w,axisTitle:U,noOfTicks:fe,valueColor:se,styles:c,classNames:m,labelOrder:D,refValues:oe,rtl:y,animate:l,precision:M,customLayers:G,highlightedDataPoints:X,dimmedOpacity:L}=ye,j=x.useRef(null),h=We.useInView(j,{once:l.once,amount:l.amount}),d={top:U?N+25:N,bottom:s,left:ee,right:J},H=te-d.left-d.right,W=ie-d.top-d.bottom,[K,P]=x.useState(void 0),[C,b]=x.useState(void 0),[S,Q]=x.useState(void 0),[V,$]=x.useState(void 0),Y=o.map((t,n)=>({...t,id:D?`${t.label}`:`${n}`})),k=D||Y.map(t=>`${t.id}`),g=Be.linear().domain([ae,E]).range([0,H]).nice(),T=He.band().domain(k).range([0,ne?Math.max(W,ne*Y.length):re?Math.min(W,re*Y.length):W]).paddingInner(v),a=g.ticks(fe);return i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsxs(le.motion.svg,{width:`${te}px`,height:`${ie}px`,viewBox:`0 0 ${te} ${ie}`,direction:"ltr",ref:j,children:[R?i.jsxRuntimeExports.jsx("defs",{children:i.jsxRuntimeExports.jsx("marker",{id:"arrow",viewBox:"0 0 10 10",refX:"10",refY:"5",markerWidth:"6",markerHeight:"6",orient:"auto-start-reverse",children:i.jsxRuntimeExports.jsx("path",{d:"M 0 0 L 10 5 L 0 10 z",className:"fill-primary-gray-600 dark:fill-primary-gray-300"})})}):null,i.jsxRuntimeExports.jsxs("g",{transform:`translate(${d.left},${d.top})`,children:[Z?i.jsxRuntimeExports.jsx(Ke.XTicksAndGridLines,{values:a.filter((t,n)=>n!==0),x:a.filter((t,n)=>n!==0).map(t=>g(t)),y1:0-N,y2:W+d.bottom,styles:{gridLines:c?.xAxis?.gridLines,labels:c?.xAxis?.labels},classNames:{gridLines:m?.xAxis?.gridLines,labels:m?.xAxis?.labels},suffix:_,prefix:z,labelType:"secondary",showGridLines:!0,precision:M}):null,i.jsxRuntimeExports.jsx(Fe.AxisTitle,{x:H/2,y:0-d.top+15,style:c?.xAxis?.title,className:m?.xAxis?.title,text:U}),i.jsxRuntimeExports.jsx(qe.YTicksAndGridLines,{y:Y.map(t=>T(`${t.id}`)+T.bandwidth()/2),x1:0,x2:H,styles:{gridLines:c?.yAxis?.gridLines},classNames:{gridLines:m?.yAxis?.gridLines},labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:M}),G.filter(t=>t.position==="before").map(t=>t.layer),i.jsxRuntimeExports.jsxs(Ue.AnimatePresence,{children:[Y.map(t=>i.jsxRuntimeExports.jsxs(le.motion.g,{className:"undp-viz-g-with-hover",variants:{initial:{x:0,y:T(`${t.id}`)+T.bandwidth()/2,opacity:X.length!==0?X.indexOf(t.label)!==-1?.85:L:.85},whileInView:{x:0,y:T(`${t.id}`)+T.bandwidth()/2,opacity:X.length!==0?X.indexOf(t.label)!==-1?.85:L:.85,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",exit:{opacity:0,transition:{duration:l.duration}},children:[ce?i.jsxRuntimeExports.jsx(Qe.YAxesLabels,{value:`${t.label}`.length<xe?`${t.label}`:`${`${t.label}`.substring(0,xe)}...`,y:0-T.bandwidth()/2,x:0-d.left,width:d.left,height:T.bandwidth(),alignment:"right",style:c?.yAxis?.labels,className:m?.yAxis?.labels,animate:l,isInView:h}):null,i.jsxRuntimeExports.jsx(le.motion.line,{y1:0,y2:0,style:{strokeWidth:pe,...c?.dataConnectors||{},opacity:I?.3:1},className:i.mo("stroke-primary-gray-600 dark:stroke-primary-gray-300",m?.dataConnectors),markerEnd:R&&t.x.indexOf(Math.min(...t.x.filter(n=>n!==null)))===0?"url(#arrow)":"",markerStart:R&&t.x.indexOf(Math.min(...t.x.filter(n=>n!==null)))===t.x.length-1?"url(#arrow)":"",exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{x1:0,x2:0},whileInView:{x1:g(Math.min(...t.x.filter(n=>n!==null)))+F,x2:g(Math.max(...t.x.filter(n=>n!==null)))-F,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial"}),t.x.map((n,f)=>i.jsxRuntimeExports.jsx(le.motion.g,{onMouseEnter:de=>{P({...t,xIndex:f}),$(de.clientY),Q(de.clientX),q?.({...t,xIndex:f})},onClick:()=>{(B||w)&&(Le.isEqual(C,{...t,xIndex:f})&&ge?(b(void 0),B?.(void 0)):(b({...t,xIndex:f}),B&&B({...t,xIndex:f})))},onMouseMove:de=>{P({...t,xIndex:f}),$(de.clientY),Q(de.clientX)},onMouseLeave:()=>{P(void 0),Q(void 0),$(void 0),q?.(void 0)},exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{opacity:I?p[f]===I?1:.3:1},whileInView:{opacity:I?p[f]===I?1:.3:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",children:A.checkIfNullOrUndefined(n)?null:i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(le.motion.circle,{cy:0,r:F,style:{fill:p[f],fillOpacity:.85,stroke:p[f],strokeWidth:1,opacity:A.checkIfNullOrUndefined(n)?0:1},exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{cx:g(0),opacity:0},whileInView:{cx:g(n||0),opacity:A.checkIfNullOrUndefined(n)?0:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial"}),ue?i.jsxRuntimeExports.jsx(le.motion.text,{y:0,style:{fill:se||p[f],textAnchor:"middle",...c?.graphObjectValues||{}},dx:0,dy:0-F-3,className:i.mo("graph-value text-sm font-bold",A.checkIfNullOrUndefined(n)?"0opacity-0":"opacity-100",m?.graphObjectValues),exit:{opacity:0,transition:{duration:l.duration}},variants:{initial:{x:g(0),opacity:0},whileInView:{x:g(n||0),opacity:1,transition:{duration:l.duration}}},initial:"initial",animate:h?"whileInView":"initial",children:Se.numberFormattingFunction(n,"NA",M,z,_)}):null]})},f))]},t.label)),oe?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:oe.map((t,n)=>i.jsxRuntimeExports.jsx(Pe.RefLineX,{text:t.text,color:t.color,x:g(t.value),y1:0-d.top,y2:W+d.bottom,textSide:g(t.value)>H*.75||y?"left":"right",classNames:t.classNames,styles:t.styles,animate:l,isInView:h},n))}):null]}),G.filter(t=>t.position==="after").map(t=>t.layer)]})]}),K&&O&&S&&V?i.jsxRuntimeExports.jsx($e.Tooltip,{data:K,body:O,xPos:S,yPos:V,backgroundStyle:c?.tooltip,className:m?.tooltip}):null,w&&C!==void 0?i.jsxRuntimeExports.jsx(Ve.X,{open:C!==void 0,onClose:()=>{b(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof w=="string"?{__html:Ae.string2HTML(w,C)}:void 0,children:typeof w=="function"?w(C):null})}):null]})}function it(ye){const{data:o,graphTitle:p,colors:_=_e.Colors.light.categoricalColors.colors,sources:z,graphDescription:v,barPadding:ue=.25,showTicks:Z=!0,leftMargin:ee=100,rightMargin:xe=40,topMargin:te=20,bottomMargin:ie=10,truncateBy:J=999,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E=!1,radius:ae=3,showLabels:B=!0,tooltip:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne="",prefix:ge="",maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se=!1,dataDownload:c=!1,showValues:m=!0,sortParameter:D,arrowConnector:oe=!1,connectorStrokeWidth:y=2,language:l="en",minHeight:M=0,theme:G="light",labelOrder:X,maxBarThickness:L,maxNumberOfBars:j,minBarThickness:h,ariaLabel:d,resetSelectionOnDoubleClick:H=!0,detailsOnClick:W,axisTitle:K,noOfTicks:P=5,valueColor:C,styles:b,classNames:S,refValues:Q,filterNA:V=!0,animate:$=!1,precision:Y=2,customLayers:k=[],showColorScale:g=!0,highlightedDataPoints:T=[],dimmedOpacity:a=.3,timeline:t={enabled:!1,autoplay:!1,showOnlyActiveDate:!0}}=ye,[n,f]=x.useState(0),[de,Ee]=x.useState(0),[me,Ne]=x.useState(t.autoplay),u=je.sort(Te.uniqBy(o.filter(e=>e.date!==void 0&&e.date!==null),e=>e.date).map(e=>we.parse(`${e.date}`,t.dateFormat||"yyyy",new Date).getTime()),(e,r)=>Je.ascending(e,r)),[be,ve]=x.useState(t.autoplay?0:u.length-1),[Ie,De]=x.useState(void 0),he=x.useRef(null),Re=x.useRef(null);x.useEffect(()=>{const e=new ResizeObserver(r=>{f(s||r[0].target.clientWidth||620),Ee(N||r[0].target.clientHeight||480)});return he.current&&(Ee(he.current.clientHeight||480),f(he.current.clientWidth||620),s||e.observe(he.current)),()=>e.disconnect()},[s,N]),x.useEffect(()=>{const e=setInterval(()=>{ve(r=>r<u.length-1?r+1:0)},(t.speed||2)*1e3);return me||clearInterval(e),()=>clearInterval(e)},[u,me,t.speed]);const Ce=je.getSliderMarks(u,be,t.showOnlyActiveDate,t.dateFormat||"yyyy");return i.jsxRuntimeExports.jsx("div",{className:`${G||"light"} flex ${s?"w-fit grow-0":"w-full grow"}`,dir:l==="he"||l==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:i.mo(`${E?E===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l||"en"}`,S?.graphContainer),style:{...b?.graphContainer||{},...E&&E!==!0?{backgroundColor:E}:{}},id:re,ref:Re,"aria-label":d||`${p?`The graph shows ${p}. `:""}This is a dumbbell chart that shows comparisons between two or more data points across categories. ${v?` ${v}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:E?q||"1rem":q||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[p||v||se||c?i.jsxRuntimeExports.jsx(Ge.GraphHeader,{styles:{title:b?.title,description:b?.description},classNames:{title:S?.title,description:S?.description},graphTitle:p,graphDescription:v,width:s,graphDownload:se?Re.current:void 0,dataDownload:c?o.map(e=>e.data).filter(e=>e!==void 0).length>0?o.map(e=>e.data).filter(e=>e!==void 0):o.filter(e=>e!==void 0):null}):null,t.enabled&&u.length>0&&Ce?i.jsxRuntimeExports.jsxs("div",{className:"flex gap-6 items-center",dir:"ltr",children:[i.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Ne(!me)},className:"p-0 border-0 cursor-pointer bg-transparent","aria-label":me?"Click to pause animation":"Click to play animation",children:me?i.jsxRuntimeExports.jsx(Me.Pause,{}):i.jsxRuntimeExports.jsx(Me.Play,{})}),i.jsxRuntimeExports.jsx(je.xr,{min:u[0],max:u[u.length-1],marks:Ce,step:null,defaultValue:u[u.length-1],value:u[be],onChangeComplete:e=>{ve(u.indexOf(e))},onChange:e=>{ve(u.indexOf(e))},"aria-label":"Time slider. Use arrow keys to adjust selected time period."})]}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:o.length===0?i.jsxRuntimeExports.jsx(ze.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[g?i.jsxRuntimeExports.jsx(Ye.ColorLegendWithMouseOver,{width:s,colorDomain:ce,colors:_,colorLegendTitle:O,setSelectedColor:De,showNAColor:!1}):null,i.jsxRuntimeExports.jsx("div",{className:"flex grow w-full justify-center leading-0",ref:he,"aria-label":"Graph area",children:(s||n)&&(N||de)?i.jsxRuntimeExports.jsx(tt,{data:D!==void 0?D==="diff"?Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[e.x.length-1])||A.checkIfNullOrUndefined(e.x[0])?-1/0:e.x[e.x.length-1]-e.x[0]).reverse().filter((e,r)=>j?r<j:!0):Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[D])?-1/0:e.x[D]).reverse().filter((e,r)=>j?r<j:!0):ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>V?!e.x.every(r=>r==null):e).filter((e,r)=>j?r<j:!0),dotColors:_,width:s||n,height:Math.max(M,N||(R?M?(s||n)*R>M?(s||n)*R:M:(s||n)*R:de)),suffix:ne,prefix:ge,radius:ae,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,showLabels:B,showValues:m,tooltip:I,onSeriesMouseOver:pe,maxValue:A.checkIfNullOrUndefined(w)?Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null))))<0?0:Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null)))):w,minValue:A.checkIfNullOrUndefined(U)?Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null))))>0?0:Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null)))):U,onSeriesMouseClick:fe,selectedColor:Ie,arrowConnector:oe,connectorStrokeWidth:y,maxBarThickness:L,minBarThickness:h,resetSelectionOnDoubleClick:H,detailsOnClick:W,axisTitle:K,noOfTicks:P,valueColor:C,styles:b,classNames:S,labelOrder:X,refValues:Q,rtl:l==="he"||l==="ar",animate:$===!0?{duration:.5,once:!0,amount:.5}:$||{duration:0,once:!0,amount:0},precision:Y,customLayers:k,highlightedDataPoints:T,dimmedOpacity:a}):null})]})}),z||F?i.jsxRuntimeExports.jsx(Xe.GraphFooter,{styles:{footnote:b?.footnote,source:b?.source},classNames:{footnote:S?.footnote,source:S?.source},sources:z,footNote:F,width:s}):null]})})})})}function at(ye){const{data:o,dotColors:p,barPadding:_,showTicks:z,leftMargin:v,truncateBy:ue,width:Z,height:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,radius:J,showLabels:N,tooltip:s,onSeriesMouseOver:F,maxValue:ce,minValue:O,onSeriesMouseClick:q,showValues:E,suffix:ae,prefix:B,selectedColor:I,arrowConnector:R,connectorStrokeWidth:pe,maxBarThickness:re,minBarThickness:ne,resetSelectionOnDoubleClick:ge,detailsOnClick:w,axisTitle:U,noOfTicks:fe,valueColor:se,styles:c,classNames:m,labelOrder:D,refValues:oe,animate:y,precision:l,customLayers:M,highlightedDataPoints:G,dimmedOpacity:X}=ye,L=x.useRef(null),j=We.useInView(L,{once:y.once,amount:y.amount}),h={top:te,bottom:ie,left:U?v+30:v,right:xe},d=Z-h.left-h.right,H=ee-h.top-h.bottom,[W,K]=x.useState(void 0),[P,C]=x.useState(void 0),[b,S]=x.useState(void 0),[Q,V]=x.useState(void 0),$=o.map((a,t)=>({...a,id:D?`${a.label}`:`${t}`})),Y=D||$.map(a=>`${a.id}`),k=Be.linear().domain([O,ce]).range([H,0]).nice(),g=He.band().domain(Y).range([0,ne?Math.max(d,ne*$.length):re?Math.min(d,re*$.length):d]).paddingInner(_),T=k.ticks(fe);return i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsxs(le.motion.svg,{width:`${Z}px`,height:`${ee}px`,viewBox:`0 0 ${Z} ${ee}`,direction:"ltr",ref:L,children:[R?i.jsxRuntimeExports.jsx("defs",{children:i.jsxRuntimeExports.jsx("marker",{id:"arrow",viewBox:"0 0 10 10",refX:"10",refY:"5",markerWidth:"6",markerHeight:"6",orient:"auto-start-reverse",children:i.jsxRuntimeExports.jsx("path",{d:"M 0 0 L 10 5 L 0 10 z",className:"fill-primary-gray-600 dark:fill-primary-gray-300"})})}):null,i.jsxRuntimeExports.jsxs("g",{transform:`translate(${h.left},${h.top})`,children:[i.jsxRuntimeExports.jsx(Ze.Axis,{y1:k(O<0?0:O),y2:k(O<0?0:O),x1:0-v,x2:d+h.right,label:Se.numberFormattingFunction(O<0?0:O,"NA",l,B,ae),labelPos:{x:0-v,dx:0,dy:ce<0?"1em":-5,y:k(O<0?0:O)},classNames:{axis:m?.xAxis?.axis,label:m?.yAxis?.labels},styles:{axis:c?.xAxis?.axis,label:c?.yAxis?.labels}}),z?i.jsxRuntimeExports.jsx(qe.YTicksAndGridLines,{values:T.filter(a=>a!==0),y:T.filter(a=>a!==0).map(a=>k(a)),x1:0-v,x2:d+h.right,styles:{gridLines:c?.yAxis?.gridLines,labels:c?.yAxis?.labels},classNames:{gridLines:m?.yAxis?.gridLines,labels:m?.yAxis?.labels},suffix:ae,prefix:B,labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:l}):null,i.jsxRuntimeExports.jsx(Fe.AxisTitle,{x:0-v-15,y:H/2,style:c?.yAxis?.title,className:m?.yAxis?.title,text:U,rotate90:!0}),M.filter(a=>a.position==="before").map(a=>a.layer),i.jsxRuntimeExports.jsxs(Ue.AnimatePresence,{children:[$.map(a=>i.jsxRuntimeExports.jsxs(le.motion.g,{className:"undp-viz-g-with-hover",variants:{initial:{x:g(`${a.id}`)+g.bandwidth()/2,y:0,opacity:G.length!==0?G.indexOf(a.label)!==-1?.85:X:.85},whileInView:{x:g(`${a.id}`)+g.bandwidth()/2,y:0,opacity:G.length!==0?G.indexOf(a.label)!==-1?.85:X:.85,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",exit:{opacity:0,transition:{duration:y.duration}},children:[N?i.jsxRuntimeExports.jsx(et.XAxesLabels,{value:`${a.label}`.length<ue?`${a.label}`:`${`${a.label}`.substring(0,ue)}...`,y:H+5,x:0-g.bandwidth()/2,width:g.bandwidth(),height:h.bottom,style:c?.xAxis?.labels,className:m?.xAxis?.labels,alignment:"top",animate:y,isInView:j}):null,i.jsxRuntimeExports.jsx(le.motion.line,{x1:0,x2:0,style:{strokeWidth:pe,...c?.dataConnectors||{},opacity:I?.3:1},className:i.mo("stroke-primary-gray-600 dark:stroke-primary-gray-300",m?.dataConnectors),markerEnd:R&&a.x.indexOf(Math.min(...a.x.filter(t=>t!==null)))===0?"url(#arrow)":"",markerStart:R&&a.x.indexOf(Math.min(...a.x.filter(t=>t!==null)))===a.x.length-1?"url(#arrow)":"",exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{y1:0,y2:0},whileInView:{y1:k(Math.min(...a.x.filter(t=>t!==null)))+J,y2:k(Math.max(...a.x.filter(t=>t!==null)))-J,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial"}),a.x.map((t,n)=>i.jsxRuntimeExports.jsx(le.motion.g,{onMouseEnter:f=>{K({...a,xIndex:n}),V(f.clientY),S(f.clientX),F?.({...a,xIndex:n})},onClick:()=>{(q||w)&&(Le.isEqual(P,{...a,xIndex:n})&&ge?(C(void 0),q?.(void 0)):(C({...a,xIndex:n}),q&&q({...a,xIndex:n})))},onMouseMove:f=>{K({...a,xIndex:n}),V(f.clientY),S(f.clientX)},onMouseLeave:()=>{K(void 0),S(void 0),V(void 0),F?.(void 0)},exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{opacity:I?p[n]===I?1:.3:1},whileInView:{opacity:I?p[n]===I?1:.3:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",children:A.checkIfNullOrUndefined(t)?null:i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[i.jsxRuntimeExports.jsx(le.motion.circle,{cx:0,r:J,style:{fill:p[n],fillOpacity:.85,stroke:p[n],strokeWidth:1},exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{cy:k(0),opacity:0},whileInView:{cy:k(t||0),opacity:A.checkIfNullOrUndefined(t)?0:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial"}),E?i.jsxRuntimeExports.jsx(le.motion.text,{x:0,style:{fill:se||p[n],textAnchor:"start",...c?.graphObjectValues||{}},className:i.mo("graph-value text-sm font-bold",A.checkIfNullOrUndefined(t)?"opacity-0":"opacity-100",m?.graphObjectValues),dx:J+3,dy:"0.33em",exit:{opacity:0,transition:{duration:y.duration}},variants:{initial:{y:k(0),opacity:0},whileInView:{y:k(t||0),opacity:1,transition:{duration:y.duration}}},initial:"initial",animate:j?"whileInView":"initial",children:Se.numberFormattingFunction(t,"NA",l,B,ae)}):null]})},n))]},a.label)),oe?i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{children:oe.map((a,t)=>i.jsxRuntimeExports.jsx(Pe.RefLineY,{text:a.text,color:a.color,y:k(a.value),x1:0-v,x2:d+h.right,classNames:a.classNames,styles:a.styles,animate:y,isInView:j},t))}):null]}),M.filter(a=>a.position==="after").map(a=>a.layer)]})]}),W&&s&&b&&Q?i.jsxRuntimeExports.jsx($e.Tooltip,{data:W,body:s,xPos:b,yPos:Q,backgroundStyle:c?.tooltip,className:m?.tooltip}):null,w&&P!==void 0?i.jsxRuntimeExports.jsx(Ve.X,{open:P!==void 0,onClose:()=>{C(void 0)},children:i.jsxRuntimeExports.jsx("div",{className:"graph-modal-content m-0",dangerouslySetInnerHTML:typeof w=="string"?{__html:Ae.string2HTML(w,P)}:void 0,children:typeof w=="function"?w(P):null})}):null]})}function rt(ye){const{data:o,graphTitle:p,colors:_=_e.Colors.light.categoricalColors.colors,sources:z,graphDescription:v,barPadding:ue=.25,showTicks:Z=!0,leftMargin:ee=20,rightMargin:xe=20,topMargin:te=20,bottomMargin:ie=25,truncateBy:J=999,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E=!1,radius:ae=3,tooltip:B,showLabels:I=!0,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne="",prefix:ge="",maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se=!1,dataDownload:c=!1,showValues:m=!0,sortParameter:D,arrowConnector:oe=!1,connectorStrokeWidth:y=2,language:l="en",minHeight:M=0,theme:G="light",maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d=!0,detailsOnClick:H,axisTitle:W,noOfTicks:K=5,valueColor:P,styles:C,classNames:b,labelOrder:S,refValues:Q,filterNA:V=!0,animate:$=!1,precision:Y=2,customLayers:k=[],showColorScale:g=!0,highlightedDataPoints:T=[],dimmedOpacity:a=.3,timeline:t={enabled:!1,autoplay:!1,showOnlyActiveDate:!0}}=ye,[n,f]=x.useState(0),[de,Ee]=x.useState(0),[me,Ne]=x.useState(t.autoplay),u=je.sort(Te.uniqBy(o.filter(e=>e.date!==void 0&&e.date!==null),e=>e.date).map(e=>we.parse(`${e.date}`,t.dateFormat||"yyyy",new Date).getTime()),(e,r)=>Je.ascending(e,r)),[be,ve]=x.useState(t.autoplay?0:u.length-1),[Ie,De]=x.useState(void 0),he=x.useRef(null),Re=x.useRef(null);x.useEffect(()=>{const e=new ResizeObserver(r=>{f(s||r[0].target.clientWidth||620),Ee(N||r[0].target.clientHeight||480)});return he.current&&(Ee(he.current.clientHeight||480),f(he.current.clientWidth||620),s||e.observe(he.current)),()=>e.disconnect()},[s,N]),x.useEffect(()=>{const e=setInterval(()=>{ve(r=>r<u.length-1?r+1:0)},(t.speed||2)*1e3);return me||clearInterval(e),()=>clearInterval(e)},[u,me,t.speed]);const Ce=je.getSliderMarks(u,be,t.showOnlyActiveDate,t.dateFormat||"yyyy");return i.jsxRuntimeExports.jsx("div",{className:`${G||"light"} flex ${s?"w-fit grow-0":"w-full grow"}`,dir:l==="he"||l==="ar"?"rtl":void 0,children:i.jsxRuntimeExports.jsx("div",{className:i.mo(`${E?E===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${l||"en"}`,b?.graphContainer),style:{...C?.graphContainer||{},...E&&E!==!0?{backgroundColor:E}:{}},id:re,ref:Re,"aria-label":h||`${p?`The graph shows ${p}. `:""}This is a dumbbell chart that shows comparisons between two or more data points across categories. ${v?` ${v}`:""}`,children:i.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:E?q||"1rem":q||0},children:i.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[p||v||se||c?i.jsxRuntimeExports.jsx(Ge.GraphHeader,{styles:{title:C?.title,description:C?.description},classNames:{title:b?.title,description:b?.description},graphTitle:p,graphDescription:v,width:s,graphDownload:se?Re.current:void 0,dataDownload:c?o.map(e=>e.data).filter(e=>e!==void 0).length>0?o.map(e=>e.data).filter(e=>e!==void 0):o.filter(e=>e!==void 0):null}):null,t.enabled&&u.length>0&&Ce?i.jsxRuntimeExports.jsxs("div",{className:"flex gap-6 items-center",dir:"ltr",children:[i.jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Ne(!me)},className:"p-0 border-0 cursor-pointer bg-transparent","aria-label":me?"Click to pause animation":"Click to play animation",children:me?i.jsxRuntimeExports.jsx(Me.Pause,{}):i.jsxRuntimeExports.jsx(Me.Play,{})}),i.jsxRuntimeExports.jsx(je.xr,{min:u[0],max:u[u.length-1],marks:Ce,step:null,defaultValue:u[u.length-1],value:u[be],onChangeComplete:e=>{ve(u.indexOf(e))},onChange:e=>{ve(u.indexOf(e))},"aria-label":"Time slider. Use arrow keys to adjust selected time period."})]}):null,i.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:o.length===0?i.jsxRuntimeExports.jsx(ze.EmptyState,{}):i.jsxRuntimeExports.jsxs(i.jsxRuntimeExports.Fragment,{children:[g?i.jsxRuntimeExports.jsx(Ye.ColorLegendWithMouseOver,{width:s,colorDomain:ce,colors:_,colorLegendTitle:O,setSelectedColor:De,showNAColor:!1}):null,i.jsxRuntimeExports.jsx("div",{className:"flex grow w-full justify-center leading-0",ref:he,"aria-label":"Graph area",children:(s||n)&&(N||de)?i.jsxRuntimeExports.jsx(at,{data:D!==void 0?D==="diff"?Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[e.x.length-1])||A.checkIfNullOrUndefined(e.x[0])?-1/0:e.x[e.x.length-1]-e.x[0]).filter((e,r)=>L?r<L:!0):Oe.sortBy(ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>t.enabled?e.date===we.format(new Date(u[be]),t.dateFormat||"yyyy"):e).filter(e=>V?!e.x.every(r=>r==null):e),e=>A.checkIfNullOrUndefined(e.x[D])?-1/0:e.x[D]).filter((e,r)=>L?r<L:!0):ke.ensureCompleteDataForDumbbellChart(o,t.dateFormat||"yyyy").filter(e=>V?!e.x.every(r=>r==null):e).filter((e,r)=>L?r<L:!0),dotColors:_,width:s||n,height:Math.max(M,N||(R?M?(s||n)*R>M?(s||n)*R:M:(s||n)*R:de)),radius:ae,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,showLabels:I,showValues:m,tooltip:B,suffix:ne,prefix:ge,onSeriesMouseOver:pe,maxValue:A.checkIfNullOrUndefined(w)?Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null))))<0?0:Math.max(...o.map(e=>Math.max(...e.x.filter(r=>r!==null)))):w,minValue:A.checkIfNullOrUndefined(U)?Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null))))>0?0:Math.min(...o.map(e=>Math.min(...e.x.filter(r=>r!==null)))):U,onSeriesMouseClick:fe,selectedColor:Ie,arrowConnector:oe,connectorStrokeWidth:y,maxBarThickness:X,minBarThickness:j,resetSelectionOnDoubleClick:d,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,styles:C,classNames:b,labelOrder:S,refValues:Q,animate:$===!0?{duration:.5,once:!0,amount:.5}:$||{duration:0,once:!0,amount:0},precision:Y,customLayers:k,highlightedDataPoints:T,dimmedOpacity:a}):null})]})}),z||F?i.jsxRuntimeExports.jsx(Xe.GraphFooter,{styles:{footnote:C?.footnote,source:C?.source},classNames:{footnote:b?.footnote,source:b?.source},sources:z,footNote:F,width:s}):null]})})})})}function nt(ye){const{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,orientation:C="vertical",styles:b,classNames:S,labelOrder:Q,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n}=ye;return C==="vertical"?i.jsxRuntimeExports.jsx(rt,{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,styles:b,detailsOnClick:H,axisTitle:W,noOfTicks:K,labelOrder:Q,valueColor:P,classNames:S,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n}):i.jsxRuntimeExports.jsx(it,{data:o,graphTitle:p,colors:_,sources:z,graphDescription:v,barPadding:ue,showTicks:Z,leftMargin:ee,rightMargin:xe,topMargin:te,bottomMargin:ie,truncateBy:J,height:N,width:s,footNote:F,colorDomain:ce,colorLegendTitle:O,padding:q,backgroundColor:E,radius:ae,tooltip:B,showLabels:I,relativeHeight:R,onSeriesMouseOver:pe,graphID:re,suffix:ne,prefix:ge,maxValue:w,minValue:U,onSeriesMouseClick:fe,graphDownload:se,dataDownload:c,showValues:m,sortParameter:D,arrowConnector:oe,connectorStrokeWidth:y,language:l,minHeight:M,theme:G,maxBarThickness:X,maxNumberOfBars:L,minBarThickness:j,ariaLabel:h,resetSelectionOnDoubleClick:d,styles:b,detailsOnClick:H,axisTitle:W,noOfTicks:K,valueColor:P,classNames:S,labelOrder:Q,refValues:V,filterNA:$,animate:Y,precision:k,showColorScale:g,customLayers:T,highlightedDataPoints:a,dimmedOpacity:t,timeline:n})}exports.DumbbellChart=nt;
|
|
2
2
|
//# sourceMappingURL=DumbbellChart.cjs.map
|
package/dist/DumbbellChart.js
CHANGED
|
@@ -5,21 +5,21 @@ import { p as Ae, f as Ie } from "./parse-DlCRUFh_.js";
|
|
|
5
5
|
import { s as Se, g as Pe, x as Fe } from "./getSliderMarks-C0jptXeP.js";
|
|
6
6
|
import { u as Be } from "./index-CaAIPGZo.js";
|
|
7
7
|
import { i as We } from "./index-27yTRcko.js";
|
|
8
|
-
import { X as He } from "./Modal-
|
|
8
|
+
import { X as He } from "./Modal-DVVwpKhP.js";
|
|
9
9
|
import { n as Le } from "./numberFormattingFunction-14YCbkN2.js";
|
|
10
10
|
import { T as Xe } from "./Tooltip-DyM5snqx.js";
|
|
11
11
|
import { c as F } from "./checkIfNullOrUndefined-DmfiKkNw.js";
|
|
12
12
|
import { s as Ye } from "./string2HTML-CWHGfz_d.js";
|
|
13
13
|
import { X as at } from "./XTicksAndGridLines-Bn9u5gOM.js";
|
|
14
14
|
import { A as Ee } from "./AxisTitle-BmHLMRJZ.js";
|
|
15
|
-
import { Y as rt } from "./YAxesLabels-
|
|
15
|
+
import { Y as rt } from "./YAxesLabels-CPGZjmZJ.js";
|
|
16
16
|
import { Y as _e } from "./YTicksAndGridLines-B6ah7CRf.js";
|
|
17
|
-
import { a as lt, R as nt } from "./ReferenceLine-
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import { m as se } from "./proxy-
|
|
22
|
-
import { A as qe } from "./index-
|
|
17
|
+
import { a as lt, R as nt } from "./ReferenceLine-CfAW3vKJ.js";
|
|
18
|
+
import { a as Ge } from "./linear-DUdu7l2G.js";
|
|
19
|
+
import { b as ze } from "./band-BEjh2CHI.js";
|
|
20
|
+
import { u as Re } from "./use-in-view-yS6jzJAp.js";
|
|
21
|
+
import { m as se } from "./proxy-CkpFesk1.js";
|
|
22
|
+
import { A as qe } from "./index-CNvov0eg.js";
|
|
23
23
|
import { GraphHeader as Ue } from "./GraphHeader.js";
|
|
24
24
|
import { GraphFooter as Je } from "./GraphFooter.js";
|
|
25
25
|
import { ColorLegendWithMouseOver as Ke } from "./ColorLegendWithMouseOver.js";
|
|
@@ -29,7 +29,7 @@ import { P as et, f as tt } from "./index-BmCqpO1B.js";
|
|
|
29
29
|
import { b as we } from "./ensureCompleteData-BBDZbDCE.js";
|
|
30
30
|
import { c as it } from "./init-BhZylTFx.js";
|
|
31
31
|
import { A as ot } from "./Axis-Ddg-seDi.js";
|
|
32
|
-
import { X as st } from "./XAxesLabels-
|
|
32
|
+
import { X as st } from "./XAxesLabels-CaV2q-6H.js";
|
|
33
33
|
function ct(ye) {
|
|
34
34
|
const {
|
|
35
35
|
data: o,
|
|
@@ -73,7 +73,7 @@ function ct(ye) {
|
|
|
73
73
|
customLayers: G,
|
|
74
74
|
highlightedDataPoints: z,
|
|
75
75
|
dimmedOpacity: A
|
|
76
|
-
} = ye, w = Ce(null), u =
|
|
76
|
+
} = ye, w = Ce(null), u = Re(w, {
|
|
77
77
|
once: s.once,
|
|
78
78
|
amount: s.amount
|
|
79
79
|
}), m = {
|
|
@@ -84,7 +84,7 @@ function ct(ye) {
|
|
|
84
84
|
}, Y = te - m.left - m.right, E = ie - m.top - m.bottom, [K, H] = L(void 0), [j, y] = L(void 0), [T, Q] = L(void 0), [S, P] = L(void 0), R = o.map((t, l) => ({
|
|
85
85
|
...t,
|
|
86
86
|
id: V ? `${t.label}` : `${l}`
|
|
87
|
-
})), k = V || R.map((t) => `${t.id}`), g =
|
|
87
|
+
})), k = V || R.map((t) => `${t.id}`), g = Ge().domain([ae, C]).range([0, Y]).nice(), $ = ze().domain(k).range([
|
|
88
88
|
0,
|
|
89
89
|
le ? Math.max(E, le * R.length) : re ? Math.min(E, re * R.length) : E
|
|
90
90
|
]).paddingInner(b), a = g.ticks(fe);
|
|
@@ -707,7 +707,7 @@ function mt(ye) {
|
|
|
707
707
|
customLayers: N,
|
|
708
708
|
highlightedDataPoints: G,
|
|
709
709
|
dimmedOpacity: z
|
|
710
|
-
} = ye, A = Ce(null), w =
|
|
710
|
+
} = ye, A = Ce(null), w = Re(A, {
|
|
711
711
|
once: f.once,
|
|
712
712
|
amount: f.amount
|
|
713
713
|
}), u = {
|
|
@@ -718,7 +718,7 @@ function mt(ye) {
|
|
|
718
718
|
}, m = Z - u.left - u.right, Y = ee - u.top - u.bottom, [E, K] = L(void 0), [H, j] = L(void 0), [y, T] = L(void 0), [Q, S] = L(void 0), P = o.map((a, t) => ({
|
|
719
719
|
...a,
|
|
720
720
|
id: V ? `${a.label}` : `${t}`
|
|
721
|
-
})), R = V || P.map((a) => `${a.id}`), k =
|
|
721
|
+
})), R = V || P.map((a) => `${a.id}`), k = Ge().domain([O, me]).range([Y, 0]).nice(), g = ze().domain(R).range([
|
|
722
722
|
0,
|
|
723
723
|
le ? Math.max(m, le * P.length) : re ? Math.min(m, re * P.length) : m
|
|
724
724
|
]).paddingInner(q), $ = k.ticks(fe);
|
package/dist/GeoHubMap.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CHPV5EwG-DDoeWRVt.cjs"),s=require("react"),O=require("./DropdownSelect-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CHPV5EwG-DDoeWRVt.cjs"),s=require("react"),O=require("./DropdownSelect-BmE5JaeE.cjs"),R=require("maplibre-gl"),T=require("pmtiles");;/* empty css */const N=require("./fetchAndParseData-CQyVGCul.cjs"),L=require("./filterData-DN6py7y_.cjs"),D=require("./index-BW_-wD2k.cjs"),z=require("./string2HTML-D2Avudmb.cjs"),P=require("./select-Bnfk0lJx.cjs"),W=require("./GraphHeader.cjs"),$=require("./GraphFooter.cjs");function A(h){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const n in h)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(h,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>h[n]})}}return t.default=h,Object.freeze(t)}const q=A(T);function _(h){const{mapStyle:t,height:n,width:r,relativeHeight:a,center:b,zoomLevel:j,minHeight:u,includeLayers:p,excludeLayers:g,mapLegend:i}=h,[o,w]=s.useState(0),[E,f]=s.useState(0),[H,S]=s.useState(!0),d=s.useRef(null),x=s.useRef(null),l=s.useRef(null);return s.useEffect(()=>{const c=new ResizeObserver(m=>{w(r||m[0].target.clientWidth||620),f(n||m[0].target.clientHeight||480)});return d.current&&(f(d.current.clientHeight||480),w(d.current.clientWidth||620),r||c.observe(d.current)),()=>c.disconnect()},[r,n]),s.useEffect(()=>{x.current&&o&&!l.current&&N.fetchAndParseJSON(t).then(c=>{P.select(x.current).selectAll("div").remove();const y=new q.Protocol;R.addProtocol("pmtiles",y.tile);const v={container:x.current,style:p.length===0&&g.length===0?c:{...c,layers:L.filterData(c.layers,[{column:"id",includeValues:p,excludeValues:g}])},attributionControl:!0};b&&(v.center=b),j&&(v.zoom=j),l.current=new R.Map(v),l.current.addControl(new R.NavigationControl({visualizePitch:!0,showZoom:!0,showCompass:!0}),"bottom-right"),l.current.addControl(new R.ScaleControl,"bottom-left")})},[o,b,j,p,g,t]),s.useEffect(()=>{l.current&&N.fetchAndParseJSON(t).then(c=>{const m={...c,layers:L.filterData(c.layers,[{column:"id",includeValues:p,excludeValues:g}])};l.current.setStyle(m)})},[g,p,t]),e.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:d,"aria-label":"Map area",children:(r||o)&&(n||E)?e.jsxRuntimeExports.jsxs("div",{style:{width:r||o,height:Math.max(u,n||(a?u?(r||o)*a>u?(r||o)*a:u:(r||o)*a:E))},children:[e.jsxRuntimeExports.jsx("div",{ref:x,className:"map maplibre-show-control",style:{width:"100%",height:"100%"}}),i?e.jsxRuntimeExports.jsx("div",{className:"absolute left-[22px] bottom-13",children:H?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:"rgba(240,240,240, 0.7)",border:"1px solid var(--gray-400)",borderRadius:"999px",width:"24px",height:"24px",padding:"3px",cursor:"pointer",zIndex:10,position:"absolute",right:"-0.75rem",top:"-0.75rem"},onClick:()=>{S(!1)},children:e.jsxRuntimeExports.jsx(D.X,{})}),e.jsxRuntimeExports.jsx("div",{className:"p-2",style:{backgroundColor:"rgba(240,240,240, 0.7)"},dangerouslySetInnerHTML:typeof i=="string"?{__html:z.string2HTML(i)}:void 0,children:s.isValidElement(i)?i:null})]}):e.jsxRuntimeExports.jsx("button",{type:"button",className:"mb-0 border-0 bg-transparent p-0 self-start",onClick:()=>{S(!0)},children:e.jsxRuntimeExports.jsx("div",{className:"items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500",children:"Show Legend"})})}):null]}):null})}function I(h){const{mapStyle:t,height:n,width:r,relativeHeight:a,center:b,zoomLevel:j,minHeight:u,includeLayers:p,excludeLayers:g,mapLegend:i}=h,[o,w]=s.useState(0),[E,f]=s.useState(0),[H,S]=s.useState(!0),d=s.useRef(null),x=s.useRef(null);return s.useEffect(()=>{const l=new ResizeObserver(c=>{w(r||c[0].target.clientWidth||620),f(n||c[0].target.clientHeight||480)});return d.current&&(f(d.current.clientHeight||480),w(d.current.clientWidth||620),r||l.observe(d.current)),()=>l.disconnect()},[r,n]),s.useEffect(()=>{x.current&&o&&N.fetchAndParseJSON(t).then(l=>{P.select(x.current).selectAll("div").remove();const m=new q.Protocol;R.addProtocol("pmtiles",m.tile);const y={container:x.current,style:p.length===0&&g.length===0?l:{...l,layers:L.filterData(l.layers,[{column:"id",includeValues:p,excludeValues:g}])},attributionControl:!0};b&&(y.center=b),j&&(y.zoom=j);const v=new R.Map(y);v.addControl(new R.NavigationControl({visualizePitch:!0,showZoom:!0,showCompass:!0}),"bottom-right"),v.addControl(new R.ScaleControl,"bottom-left")})},[o,t,b,j,p,g]),e.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:d,"aria-label":"Map area",children:(r||o)&&(n||E)?e.jsxRuntimeExports.jsxs("div",{style:{width:r||o,height:Math.max(u,n||(a?u?(r||o)*a>u?(r||o)*a:u:(r||o)*a:E))},children:[e.jsxRuntimeExports.jsx("div",{ref:x,className:"map maplibre-show-control",style:{width:"100%",height:"100%"}}),i?e.jsxRuntimeExports.jsx("div",{className:"absolute left-[22px] bottom-13",children:H?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:"rgba(240,240,240, 0.7)",border:"1px solid var(--gray-400)",borderRadius:"999px",width:"24px",height:"24px",padding:"3px",cursor:"pointer",zIndex:10,position:"absolute",right:"-0.75rem",top:"-0.75rem"},onClick:()=>{S(!1)},children:e.jsxRuntimeExports.jsx(D.X,{})}),e.jsxRuntimeExports.jsx("div",{className:"p-2",style:{backgroundColor:"rgba(240,240,240, 0.7)"},dangerouslySetInnerHTML:typeof i=="string"?{__html:z.string2HTML(i)}:void 0,children:s.isValidElement(i)?i:null})]}):e.jsxRuntimeExports.jsx("button",{type:"button",className:"mb-0 border-0 bg-transparent p-0 self-start",onClick:()=>{S(!0)},children:e.jsxRuntimeExports.jsx("div",{className:"items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500",children:"Show Legend"})})}):null]}):null})}function F(h){const{mapStyle:t,graphTitle:n,height:r,width:a,relativeHeight:b,sources:j,graphDescription:u,footNote:p,padding:g,backgroundColor:i=!1,center:o,zoomLevel:w,graphID:E,language:f="en",minHeight:H=0,theme:S="light",includeLayers:d=[],excludeLayers:x=[],ariaLabel:l,uiMode:c="normal",styles:m,classNames:y,mapLegend:v}=h,[M,k]=s.useState(typeof t=="string"?t:t[0].style);s.useEffect(()=>{k(typeof t=="string"?t:t[0].style)},[t]);const V=s.useMemo(()=>({ignoreCase:!0,ignoreAccents:!0,trim:!0}),[]);return e.jsxRuntimeExports.jsx("div",{className:`${S||"light"} flex ${a?"w-fit grow-0":"w-full grow"}`,dir:f==="he"||f==="ar"?"rtl":void 0,children:e.jsxRuntimeExports.jsx("div",{className:e.mo(`${i?i===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${f||"en"}`,y?.graphContainer),style:{...m?.graphContainer||{},...i&&i!==!0?{backgroundColor:i}:{}},id:E,"aria-label":l||`${n?`The graph shows ${n}. `:""}This is a map.${u?` ${u}`:""}`,children:e.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:i?g||"1rem":g||0},children:e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[n||u?e.jsxRuntimeExports.jsx(W.GraphHeader,{styles:{title:m?.title,description:m?.description},classNames:{title:y?.title,description:y?.description},graphTitle:n,graphDescription:u,width:a}):null,typeof t=="string"?null:e.jsxRuntimeExports.jsx(O.Za,{options:t.map(C=>({label:C.name,value:C.style})),isClearable:!1,size:"sm",variant:c,isRtl:f==="he"||f==="ar",isSearchable:!0,filterOption:O.Hu(V),defaultValue:{label:t[0].name,value:t[0].style},controlShouldRenderValue:!0,onChange:C=>{C&&k(C.value)}}),typeof t=="string"?e.jsxRuntimeExports.jsx(I,{mapStyle:t,center:o,zoomLevel:w,width:a,height:r,relativeHeight:b,minHeight:H,includeLayers:d,excludeLayers:x,mapLegend:v}):e.jsxRuntimeExports.jsx(_,{mapStyle:M,center:o,zoomLevel:w,width:a,height:r,relativeHeight:b,minHeight:H,includeLayers:d,excludeLayers:x,mapLegend:(v||[]).find(C=>C.mapStyleName===t.find(G=>G.style===M)?.name)?.legend}),j||p?e.jsxRuntimeExports.jsx($.GraphFooter,{styles:{footnote:m?.footnote,source:m?.source},classNames:{footnote:y?.footnote,source:y?.source},sources:j,footNote:p,width:a}):null]})})})})}exports.GeoHubMap=F;
|
|
2
2
|
//# sourceMappingURL=GeoHubMap.cjs.map
|
package/dist/GeoHubMap.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { j as e, m as I } from "./index-CHPV5EwG-BPSP-7Jg.js";
|
|
2
2
|
import R, { useState as N, useRef as M, useEffect as L, useMemo as A } from "react";
|
|
3
|
-
import { Z as E, H as Z } from "./DropdownSelect-
|
|
3
|
+
import { Z as E, H as Z } from "./DropdownSelect-CeHog_ih.js";
|
|
4
4
|
import w from "maplibre-gl";
|
|
5
5
|
import * as W from "pmtiles";
|
|
6
6
|
/* empty css */
|
|
7
|
-
import { f as z } from "./fetchAndParseData-
|
|
7
|
+
import { f as z } from "./fetchAndParseData-4gsYTy6_.js";
|
|
8
8
|
import { f as V } from "./filterData-B8ocT57s.js";
|
|
9
9
|
import { X as _ } from "./index-BmCqpO1B.js";
|
|
10
10
|
import { s as $ } from "./string2HTML-CWHGfz_d.js";
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CHPV5EwG-DDoeWRVt.cjs"),r=require("react"),I=require("./index-B0rbzOoC.cjs"),q=require("./DropdownSelect-
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-CHPV5EwG-DDoeWRVt.cjs"),r=require("react"),I=require("./index-B0rbzOoC.cjs"),q=require("./DropdownSelect-BmE5JaeE.cjs"),C=require("maplibre-gl"),P=require("pmtiles");;/* empty css */const M=require("./fetchAndParseData-CQyVGCul.cjs"),O=require("./filterData-DN6py7y_.cjs"),z=require("./string2HTML-D2Avudmb.cjs"),$=require("./index-BW_-wD2k.cjs"),G=require("./select-Bnfk0lJx.cjs"),T=require("./GraphHeader.cjs"),V=require("./GraphFooter.cjs");function W(m){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(m){for(const t in m)if(t!=="default"){const s=Object.getOwnPropertyDescriptor(m,t);Object.defineProperty(c,t,s.get?s:{enumerable:!0,get:()=>m[t]})}}return c.default=m,Object.freeze(c)}const A=W(P);function _(m){const{mapStyle:c,height:t,width:s,relativeHeight:p,center:R,zoomLevel:v,minHeight:x,selectedLayer:f,layerIdList:h,excludeLayers:n,mapLegend:b}=m,[g,D]=r.useState(0),[y,L]=r.useState(0),[N,l]=r.useState(!0),[S,H]=r.useState(void 0),j=r.useRef(null),u=r.useRef(null),a=r.useRef(null);return r.useEffect(()=>{const i=new ResizeObserver(d=>{D(s||d[0].target.clientWidth||620),L(t||d[0].target.clientHeight||480)});return j.current&&(L(j.current.clientHeight||480),D(j.current.clientWidth||620),s||i.observe(j.current)),()=>i.disconnect()},[s,t]),r.useEffect(()=>{u.current&&g&&!a.current&&M.fetchAndParseJSON(c).then(i=>{H(i),G.select(u.current).selectAll("div").remove();const w=new A.Protocol;C.addProtocol("pmtiles",w.tile);const E={container:u.current,style:{...i,layers:O.filterData(i.layers,[{column:"id",excludeValues:[...n,...h.filter(o=>f.indexOf(o)===-1)]}])},attributionControl:!0};R&&(E.center=R),v&&(E.zoom=v),a.current=new C.Map(E),a.current.addControl(new C.NavigationControl({visualizePitch:!0,showZoom:!0,showCompass:!0}),"bottom-right"),a.current.addControl(new C.ScaleControl,"bottom-left")})},[g,R,v,h,c,n,f]),r.useEffect(()=>{if(a.current)if(S){const i={...S,layers:O.filterData(S.layers,[{column:"id",excludeValues:[...n,...h.filter(d=>f.indexOf(d)===-1)]}])};a.current.setStyle(i)}else M.fetchAndParseJSON(c).then(i=>{const d={...i,layers:O.filterData(i.layers,[{column:"id",excludeValues:[...n,...h.filter(w=>f.indexOf(w)===-1)]}])};a.current.setStyle(d)})},[n,h,c,S,f]),e.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:j,"aria-label":"Map area",children:(s||g)&&(t||y)?e.jsxRuntimeExports.jsxs("div",{style:{width:s||g,height:Math.max(x,t||(p?x?(s||g)*p>x?(s||g)*p:x:(s||g)*p:y))},children:[e.jsxRuntimeExports.jsx("div",{ref:u,className:"map maplibre-show-control w-full h-full"}),b?e.jsxRuntimeExports.jsx("div",{className:"absolute left-[22px] bottom-13",children:N?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:"rgba(240,240,240, 0.7)",border:"1px solid var(--gray-400)",borderRadius:"999px",width:"24px",height:"24px",padding:"3px",cursor:"pointer",zIndex:10,position:"absolute",right:"-0.75rem",top:"-0.75rem"},onClick:()=>{l(!1)},children:e.jsxRuntimeExports.jsx($.X,{})}),e.jsxRuntimeExports.jsx("div",{className:"p-2",style:{backgroundColor:"rgba(240,240,240, 0.7)"},dangerouslySetInnerHTML:typeof b=="string"?{__html:z.string2HTML(b)}:void 0,children:r.isValidElement(b)?b:null})]}):e.jsxRuntimeExports.jsx("button",{type:"button",className:"mb-0 border-0 bg-transparent p-0 self-start",onClick:()=>{l(!0)},children:e.jsxRuntimeExports.jsx("div",{className:"items-start text-sm font-medium cursor-pointer p-2 mb-0 flex text-primary-black dark:text-primary-gray-300 bg-primary-gray-300 dark:bg-primary-gray-550 border-primary-gray-400 dark:border-primary-gray-500",children:"Show Legend"})})}):null]}):null})}function F(m){const{mapStyle:c,graphTitle:t,height:s,width:p,relativeHeight:R,sources:v,graphDescription:x,footNote:f,padding:h,backgroundColor:n=!1,center:b,zoomLevel:g,graphID:D,language:y="en",minHeight:L=0,theme:N="light",layerSelection:l,excludeLayers:S=[],ariaLabel:H,uiMode:j="normal",styles:u,classNames:a,mapLegend:i=[]}=m,[d,w]=r.useState(l[0].layerID);r.useEffect(()=>{w(l[0].layerID)},[l]);const E=r.useMemo(()=>({ignoreCase:!0,ignoreAccents:!0,trim:!0}),[]);return e.jsxRuntimeExports.jsx("div",{className:`${N||"light"} flex ${p?"w-fit grow-0":"w-full grow"}`,dir:y==="he"||y==="ar"?"rtl":void 0,children:e.jsxRuntimeExports.jsx("div",{className:e.mo(`${n?n===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${y||"en"}`,a?.graphContainer),style:{...u?.graphContainer||{},...n&&n!==!0?{backgroundColor:n}:{}},id:D,"aria-label":H||`${t?`The graph shows ${t}. `:""}This is a map.${x?` ${x}`:""}`,children:e.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:n?h||"1rem":h||0},children:e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[t||x?e.jsxRuntimeExports.jsx(T.GraphHeader,{styles:{title:u?.title,description:u?.description},classNames:{title:a?.title,description:a?.description},graphTitle:t,graphDescription:x,width:p}):null,e.jsxRuntimeExports.jsx(q.Za,{options:l.map(o=>({label:o.name,value:o.layerID})),size:"sm",isClearable:!1,variant:j,isRtl:y==="he"||y==="ar",isSearchable:!0,filterOption:q.Hu(E),defaultValue:{label:l[0].name,value:l[0].layerID},controlShouldRenderValue:!0,onChange:o=>{o&&w(o.value)}}),e.jsxRuntimeExports.jsx(_,{mapStyle:c,center:b,zoomLevel:g,width:p,height:s,relativeHeight:R,minHeight:L,selectedLayer:d,layerIdList:I.flattenDeep(l.map(o=>o.layerID)),excludeLayers:S,mapLegend:i.find(o=>o.mapStyleName===l.find(k=>k.layerID===d)?.name)?.legend}),v||f?e.jsxRuntimeExports.jsx(V.GraphFooter,{styles:{footnote:u?.footnote,source:u?.source},classNames:{footnote:a?.footnote,source:a?.source},sources:v,footNote:f,width:p}):null]})})})})}exports.GeoHubMapWithLayerSelection=F;
|
|
2
2
|
//# sourceMappingURL=GeoHubMapWithLayerSelection.cjs.map
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { j as e, m as V } from "./index-CHPV5EwG-BPSP-7Jg.js";
|
|
2
2
|
import _, { useState as L, useRef as O, useEffect as H, useMemo as T } from "react";
|
|
3
3
|
import { f as W } from "./index-UV9hjG_S.js";
|
|
4
|
-
import { Z as E, H as G } from "./DropdownSelect-
|
|
4
|
+
import { Z as E, H as G } from "./DropdownSelect-CeHog_ih.js";
|
|
5
5
|
import D from "maplibre-gl";
|
|
6
6
|
import * as P from "pmtiles";
|
|
7
7
|
/* empty css */
|
|
8
|
-
import { f as $ } from "./fetchAndParseData-
|
|
8
|
+
import { f as $ } from "./fetchAndParseData-4gsYTy6_.js";
|
|
9
9
|
import { f as z } from "./filterData-B8ocT57s.js";
|
|
10
10
|
import { s as A } from "./string2HTML-CWHGfz_d.js";
|
|
11
11
|
import { X as Z } from "./index-BmCqpO1B.js";
|