@undp/data-viz 1.3.0 → 1.4.0

package/dist/LineChartWithConfidenceInterval.js

@@ -1,2 +1,819 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-BHm2KTjD-D8FylaKc.cjs"),d=require("react"),G=require("./Typography-CDR-DAHH.cjs"),p=require("./parse-hMnG_lRV.cjs"),$t=require("./index-BzeLQvXk.cjs"),Dt=require("./simple-statistics-xm8c0LQQ.cjs"),lt=require("./numberFormattingFunction.js"),Tt=require("./Tooltip-BM18N_3l.cjs"),v=require("./checkIfNullOrUndefined.js"),Ot=require("./customArea-B47Ew5cT.cjs"),Ft=require("./AxisTitle-BY8MI9jC.cjs"),Wt=require("./Axis-BlyBRMNw.cjs"),Ht=require("./ReferenceLine-Bsb5jeE4.cjs"),Pt=require("./RegressionLine-BfpCuD7B.cjs"),Ut=require("./YTicksAndGridLines-CtLvzExe.cjs"),Yt=require("./index-BYroABPm.cjs"),y=require("./use-in-view-Dl1CsAIo.cjs"),Gt=require("./time-Byw_jYQ7.cjs"),Xt=require("./linear-BVckp9RD.cjs"),ct=require("./line-DHV4JwCR.cjs"),xt=require("./step-BZ3C8QFW.cjs"),Bt=require("./area-D3Qx7k7K.cjs"),zt=require("./select-Bnfk0lJx.cjs"),Kt=require("./init-DU0ybBc_.cjs"),Jt=require("./pointer-Dkq5NV1q.cjs"),Qt=require("./GraphFooter.js"),Zt=require("./GraphHeader.js"),ut=require("./Colors.js"),_t=require("./ColorLegend.js"),te=require("./EmptyState-BQguKAp5.cjs");function ee(mt){const{data:A,width:M,height:$,lineColor:V,suffix:I,prefix:j,dateFormat:o,highlightAreaSettings:h,showValues:X,noOfXTicks:ht,rightMargin:pt,leftMargin:R,topMargin:C,bottomMargin:B,tooltip:z,onSeriesMouseOver:T,refValues:K,minValue:J,maxValue:Q,animate:a,rtl:Z,strokeWidth:yt,showDots:D,annotations:dt,customHighlightAreaSettings:gt,regressionLine:F,showIntervalDots:ft,showIntervalValues:jt,intervalLineStrokeWidth:W,intervalLineColors:b,intervalAreaColor:wt,intervalAreaOpacity:vt,yAxisTitle:_,noOfYTicks:Rt,minDate:H,maxDate:P,curveType:L,styles:c,classNames:x,precision:N,customLayers:tt}=mt,et=d.useRef(null),l=y.useInView(et,{once:a.once,amount:a.amount}),[u,Et]=d.useState(!1);d.useEffect(()=>{if(l&&!u){const t=setTimeout(()=>{Et(!0)},(a.duration+.5)*1e3);return()=>clearTimeout(t)}},[l,u,a.duration]);const S=L==="linear"?ct.curveLinear:L==="step"?xt.curveStep:L==="stepAfter"?xt.stepAfter:L==="stepBefore"?xt.stepBefore:xt.monotoneX,[k,it]=d.useState(void 0),[nt,at]=d.useState(void 0),[U,Y]=d.useState(void 0),f={top:C,bottom:B,left:_?R+30:R,right:pt},E=d.useRef(null),n=$t.sortBy(A.filter(t=>!v.checkIfNullOrUndefined(t.y)).map(t=>({date:p.parse(`${t.date}`,o,new Date),y:t.y,yMin:v.checkIfNullOrUndefined(t.yMin)?t.y:t.yMin,yMax:v.checkIfNullOrUndefined(t.yMax)?t.y:t.yMax,data:t.data})),"date"),Mt=h.map(t=>({...t,coordinates:[t.coordinates[0]===null?null:p.parse(`${t.coordinates[0]}`,o,new Date),t.coordinates[1]===null?null:p.parse(`${t.coordinates[1]}`,o,new Date)]})),Ct=gt.map(t=>({...t,coordinates:t.coordinates.map((g,O)=>O%2===0?p.parse(`${g}`,o,new Date):g)})),r=M-f.left-f.right,w=$-f.top-f.bottom,st=H?p.parse(`${H}`,o,new Date):n[0].date,rt=P?p.parse(`${P}`,o,new Date):n[n.length-1].date,m=v.checkIfNullOrUndefined(J)?Math.min(...n.map(t=>Math.min(t.y,t.yMax,t.yMin)))?Math.min(...n.map(t=>Math.min(t.y,t.yMax,t.yMin)))>0?0:Math.min(...n.map(t=>Math.min(t.y,t.yMax,t.yMin))):0:J,q=Math.max(...n.map(t=>Math.max(t.y,t.yMax,t.yMin)))?Math.max(...n.map(t=>Math.max(t.y,t.yMax,t.yMin))):0,i=Gt.time().domain([st,rt]).range([0,r]),s=Xt.linear().domain([m,v.checkIfNullOrUndefined(Q)?q>0?q:0:Q]).range([w,0]).nice(),At=ct.line().x(t=>i(t.date)).y(t=>s(t.y)).curve(S),It=ct.line().x(t=>i(t.date)).y(t=>s(t.yMin)).curve(S),Lt=ct.line().x(t=>i(t.date)).y(t=>s(t.yMax)).curve(S),Nt=Bt.area().x(t=>i(t.date)).y0(t=>s(t.yMin)).y1(t=>s(t.yMax)).curve(S),kt=s.ticks(Rt),St=i.ticks(ht);d.useEffect(()=>{const t=O=>{const ot=n[Kt.bisectCenter(n.map(bt=>bt.date),i.invert(Jt.pointer(O)[0]),1)];it(ot||n[n.length-1]),T?.(ot||n[n.length-1]),Y(O.clientY),at(O.clientX)},g=()=>{it(void 0),at(void 0),Y(void 0),T?.(void 0)};zt.select(E.current).on("mousemove",t).on("mouseout",g)},[i,n,T]);const qt=Dt.linearRegression(n.filter(t=>!v.checkIfNullOrUndefined(t.date)&&!v.checkIfNullOrUndefined(t.y)).map(t=>[i(t.date),s(t.y)])),Vt=Dt.linearRegressionLine(qt);return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(y.motion.svg,{width:`${M}px`,height:`${$}px`,viewBox:`0 0 ${M} ${$}`,direction:"ltr",ref:et,children:e.jsxRuntimeExports.jsxs("g",{transform:`translate(${f.left},${f.top})`,children:[e.jsxRuntimeExports.jsx(Yt.HighlightArea,{areaSettings:Mt,width:r,height:w,scale:i,animate:a,isInView:l}),e.jsxRuntimeExports.jsx(Ot.CustomArea,{areaSettings:Ct,scaleX:i,scaleY:s,animate:a,isInView:l}),e.jsxRuntimeExports.jsxs("g",{children:[e.jsxRuntimeExports.jsx(Ut.YTicksAndGridLines,{values:kt.filter(t=>t!==0),y:kt.filter(t=>t!==0).map(t=>s(t)),x1:0-R,x2:r+f.right,styles:{gridLines:c?.yAxis?.gridLines,labels:c?.yAxis?.labels},classNames:{gridLines:x?.yAxis?.gridLines,labels:x?.yAxis?.labels},suffix:I,prefix:j,labelType:"secondary",showGridLines:!0,labelPos:"vertical",precision:N}),e.jsxRuntimeExports.jsx(Wt.Axis,{y1:s(m<0?0:m),y2:s(m<0?0:m),x1:0-R,x2:r+f.right,label:lt.numberFormattingFunction(m<0?0:m,"NA",N,j,I),labelPos:{x:0-R,y:s(m<0?0:m),dx:0,dy:q<0?"1em":-5},classNames:{axis:x?.xAxis?.axis,label:x?.yAxis?.labels},styles:{axis:c?.xAxis?.axis,label:c?.yAxis?.labels}}),e.jsxRuntimeExports.jsx(Ft.AxisTitle,{x:0-R+15,y:w/2,style:c?.yAxis?.title,className:x?.yAxis?.title,text:_,rotate90:!0})]}),e.jsxRuntimeExports.jsx("g",{children:St.map((t,g)=>e.jsxRuntimeExports.jsx("g",{children:e.jsxRuntimeExports.jsx("text",{y:w,x:i(t),style:{textAnchor:"middle"},className:"fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",dy:15,children:p.format(t,o)})},g))}),tt.filter(t=>t.position==="before").map(t=>t.layer),e.jsxRuntimeExports.jsx(y.motion.path,{style:{fill:wt},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,d:Nt(n)||""},whileInView:{opacity:vt,d:Nt(n)||"",transition:{duration:a.duration}}},initial:"initial",animate:l?"whileInView":"initial"}),W?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(y.motion.path,{style:{stroke:b[0],fill:"none",strokeWidth:W},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{pathLength:0,d:It(n)||"",opacity:1},whileInView:{pathLength:1,d:It(n)||"",opacity:1,transition:{duration:a.duration}}},initial:"initial",animate:l?"whileInView":"initial"}),e.jsxRuntimeExports.jsx(y.motion.path,{style:{stroke:b[1],fill:"none",strokeWidth:W},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{pathLength:0,d:Lt(n)||"",opacity:1},whileInView:{pathLength:1,d:Lt(n)||"",opacity:1,transition:{duration:a.duration}}},initial:"initial",animate:l?"whileInView":"initial"})]}):null,e.jsxRuntimeExports.jsx(y.motion.path,{style:{stroke:V,fill:"none",strokeWidth:yt},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{pathLength:0,d:At(n)||"",opacity:1},whileInView:{pathLength:1,d:At(n)||"",opacity:1,transition:{duration:a.duration}}},initial:"initial",animate:l?"whileInView":"initial"}),k?e.jsxRuntimeExports.jsx("line",{y1:0,y2:w,x1:i(k.date),x2:i(k.date),className:G.cnExports.cn("undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",x?.mouseOverLine),style:c?.mouseOverLine}):null,e.jsxRuntimeExports.jsx("g",{children:n.map((t,g)=>e.jsxRuntimeExports.jsx(y.motion.g,{children:v.checkIfNullOrUndefined(t.y)?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[D?e.jsxRuntimeExports.jsx(y.motion.circle,{r:r/n.length<5?0:r/n.length<20?2:4,style:{fill:V},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,cx:i(t.date),cy:s(t.y)},whileInView:{opacity:1,transition:{duration:u?a.duration:.5,delay:u?0:a.duration},cx:i(t.date),cy:s(t.y)}},initial:"initial",animate:l?"whileInView":"initial"}):null,ft?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(y.motion.circle,{r:r/n.length<5?0:r/n.length<20?2:4,style:{fill:b[0]},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,cx:i(t.date),cy:s(t.yMin)},whileInView:{opacity:1,transition:{duration:u?a.duration:.5,delay:u?0:a.duration},cx:i(t.date),cy:s(t.yMin)}},initial:"initial",animate:l?"whileInView":"initial"}),e.jsxRuntimeExports.jsx(y.motion.circle,{r:r/n.length<5?0:r/n.length<20?2:4,style:{fill:b[1]},exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,cx:i(t.date),cy:s(t.yMax)},whileInView:{opacity:1,transition:{duration:u?a.duration:.5,delay:u?0:a.duration},cx:i(t.date),cy:s(t.yMax)}},initial:"initial",animate:l?"whileInView":"initial"})]}):null,X?e.jsxRuntimeExports.jsx(y.motion.text,{dy:-8,style:{fill:V,textAnchor:"middle",...c?.graphObjectValues||{}},className:G.cnExports.cn("graph-value text-xs font-bold",x?.graphObjectValues),exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,x:i(t.date),y:s(t.y)},whileInView:{opacity:1,x:i(t.date),y:s(t.y),transition:{duration:u?a.duration:.5,delay:u?0:a.duration}}},initial:"initial",animate:l?"whileInView":"initial",children:lt.numberFormattingFunction(t.y,"NA",N,j,I)}):null,jt?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(y.motion.text,{dy:"1em",style:{fill:b[0],textAnchor:"middle",...c?.graphObjectValues||{}},className:G.cnExports.cn("text-xs font-bold",x?.graphObjectValues),exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,x:i(t.date),y:s(t.yMin)},whileInView:{opacity:1,x:i(t.date),y:s(t.yMin),transition:{duration:u?a.duration:.5,delay:u?0:a.duration}}},initial:"initial",animate:l?"whileInView":"initial",children:lt.numberFormattingFunction(t.yMin,"NA",N,j,I)}),e.jsxRuntimeExports.jsx(y.motion.text,{dy:-8,style:{fill:b[1],textAnchor:"middle",...c?.graphObjectValues||{}},className:G.cnExports.cn("text-xs font-bold",x?.graphObjectValues),exit:{opacity:0,transition:{duration:a.duration}},variants:{initial:{opacity:0,x:i(t.date),y:s(t.yMax)},whileInView:{opacity:1,x:i(t.date),y:s(t.yMax),transition:{duration:u?a.duration:.5,delay:u?0:a.duration}}},initial:"initial",animate:l?"whileInView":"initial",children:lt.numberFormattingFunction(t.yMax,"NA",N,j,I)})]}):null]})},g))}),K?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:K.map((t,g)=>e.jsxRuntimeExports.jsx(Ht.RefLineY,{text:t.text,color:t.color,y:s(t.value),x1:0-R,x2:r+f.right,classNames:t.classNames,styles:t.styles,animate:a,isInView:l},g))}):null,e.jsxRuntimeExports.jsx("g",{children:dt.map((t,g)=>{const O=Ot.getLineEndPoint({x:t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date))+(t.xOffset||0):0+(t.xOffset||0),y:t.yCoordinate?s(t.yCoordinate)+(t.yOffset||0)-8:0+(t.yOffset||0)-8},{x:t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date)):0,y:t.yCoordinate?s(t.yCoordinate):0},v.checkIfNullOrUndefined(t.connectorRadius)?3.5:t.connectorRadius),ot=t.showConnector?{y1:O.y,x1:O.x,y2:t.yCoordinate?s(t.yCoordinate)+(t.yOffset||0):0+(t.yOffset||0),x2:t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date))+(t.xOffset||0):0+(t.xOffset||0),cy:t.yCoordinate?s(t.yCoordinate):0,cx:t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date)):0,circleRadius:v.checkIfNullOrUndefined(t.connectorRadius)?3.5:t.connectorRadius,strokeWidth:t.showConnector===!0?2:Math.min(t.showConnector||0,1)}:void 0,bt={y:t.yCoordinate?s(t.yCoordinate)+(t.yOffset||0)-8:0+(t.yOffset||0)-8,x:Z?0:t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date))+(t.xOffset||0):0+(t.xOffset||0),width:Z?t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date))+(t.xOffset||0):0+(t.xOffset||0):r-(t.xCoordinate?i(p.parse(`${t.xCoordinate}`,o,new Date))+(t.xOffset||0):0+(t.xOffset||0)),maxWidth:t.maxWidth,fontWeight:t.fontWeight,align:t.align};return e.jsxRuntimeExports.jsx(Ot.Annotation,{color:t.color,connectorsSettings:ot,labelSettings:bt,text:t.text,classNames:t.classNames,styles:t.styles,animate:a,isInView:l},g)})}),e.jsxRuntimeExports.jsx("g",{children:F?e.jsxRuntimeExports.jsx(Pt.RegressionLine,{x1:0,x2:r,y1:Vt(0),y2:Vt(r),graphHeight:w,graphWidth:r,className:x?.regLine,style:c?.regLine,color:typeof F=="string"?F:void 0,animate:a,isInView:l}):null}),tt.filter(t=>t.position==="after").map(t=>t.layer),e.jsxRuntimeExports.jsx("rect",{ref:E,style:{fill:"none",pointerEvents:"all"},width:r,height:w})]})}),k&&z&&nt&&U?e.jsxRuntimeExports.jsx(Tt.Tooltip,{data:k,body:z,xPos:nt,yPos:U,backgroundStyle:c?.tooltip,className:x?.tooltip}):null]})}function ie(mt){const{data:A,graphTitle:M,suffix:$="",sources:V,prefix:I="",graphDescription:j,height:o,width:h,footNote:X,noOfXTicks:ht=10,dateFormat:pt="yyyy",showValues:R=!1,backgroundColor:C=!1,padding:B,lineColor:z,leftMargin:T=30,rightMargin:K=30,topMargin:J=20,bottomMargin:Q=25,tooltip:a,refValues:Z=[],highlightAreaSettings:yt=[],relativeHeight:D,onSeriesMouseOver:dt,graphID:gt,minValue:F,maxValue:ft,regressionLine:jt=!1,showIntervalDots:W=!1,showIntervalValues:b=!1,intervalLineStrokeWidth:wt=0,intervalLineColors:vt=[ut.Colors.light.grays["gray-500"],ut.Colors.light.grays["gray-500"]],intervalAreaColor:_=ut.Colors.primaryColors["blue-100"],intervalAreaOpacity:Rt=.4,graphDownload:H=!1,dataDownload:P=!1,animate:L=!1,language:c="en",minHeight:x=0,strokeWidth:N=2,showDots:tt=!0,annotations:et=[],customHighlightAreaSettings:l=[],theme:u="light",ariaLabel:Et,yAxisTitle:S,noOfYTicks:k=5,minDate:it,maxDate:nt,colorLegendTitle:at,colorLegendColors:U,colorLegendDomain:Y,curveType:f="curve",styles:E,classNames:n,precision:Mt=2,customLayers:Ct=[]}=mt,[r,w]=d.useState(0),[st,rt]=d.useState(0),m=d.useRef(null),q=d.useRef(null);return d.useEffect(()=>{const i=new ResizeObserver(s=>{w(h||s[0].target.clientWidth||620),rt(o||s[0].target.clientHeight||480)});return m.current&&(rt(m.current.clientHeight||480),w(m.current.clientWidth||620),h||i.observe(m.current)),()=>i.disconnect()},[h,o]),e.jsxRuntimeExports.jsx("div",{className:`${u||"light"} flex  ${h?"w-fit grow-0":"w-full grow"}`,dir:c==="he"||c==="ar"?"rtl":void 0,children:e.jsxRuntimeExports.jsx("div",{className:G.cnExports.cn(`${C?C===!0?"bg-primary-gray-200 dark:bg-primary-gray-650 ":"":"bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${c||"en"}`,n?.graphContainer),style:{...E?.graphContainer||{},...C&&C!==!0?{backgroundColor:C}:{}},id:gt,ref:q,"aria-label":Et||`${M?`The graph shows ${M}. `:""}This is a line chart that highlights the difference between two datasets over time.${j?` ${j}`:""}`,children:e.jsxRuntimeExports.jsx("div",{className:"flex grow",style:{padding:C?B||"1rem":B||0},children:e.jsxRuntimeExports.jsxs("div",{className:"flex flex-col w-full gap-4 grow justify-between",children:[M||j||H||P?e.jsxRuntimeExports.jsx(Zt.GraphHeader,{styles:{title:E?.title,description:E?.description},classNames:{title:n?.title,description:n?.description},graphTitle:M,graphDescription:j,width:h,graphDownload:H?q.current:void 0,dataDownload:P?A.map(i=>i.data).filter(i=>i!==void 0).length>0?A.map(i=>i.data).filter(i=>i!==void 0):A.filter(i=>i!==void 0):null}):null,e.jsxRuntimeExports.jsx("div",{className:"grow flex flex-col justify-center gap-3 w-full",children:A.length===0?e.jsxRuntimeExports.jsx(te.EmptyState,{}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[U&&Y?e.jsxRuntimeExports.jsx(_t.ColorLegend,{width:h,colorLegendTitle:at,colors:U,colorDomain:Y,showNAColor:!1}):null,e.jsxRuntimeExports.jsx("div",{className:"flex flex-col grow justify-center leading-0",ref:m,"aria-label":"Graph area",children:(h||r)&&(o||st)?e.jsxRuntimeExports.jsx(ee,{data:A,lineColor:z||ut.Colors.primaryColors["blue-600"],width:h||r,height:Math.max(x,o||(D?x?(h||r)*D>x?(h||r)*D:x:(h||r)*D:st)),suffix:$,prefix:I,dateFormat:pt,showValues:R,noOfXTicks:ht,leftMargin:T,rightMargin:K,topMargin:J,bottomMargin:Q,tooltip:a,highlightAreaSettings:yt,onSeriesMouseOver:dt,refValues:Z,minValue:F,maxValue:ft,animate:L===!0?{duration:.5,once:!0,amount:.5}:L||{duration:0,once:!0,amount:0},rtl:c==="he"||c==="ar",strokeWidth:N,showDots:tt,annotations:et,customHighlightAreaSettings:l,regressionLine:jt,showIntervalDots:W,showIntervalValues:b,intervalLineStrokeWidth:wt,intervalLineColors:vt,intervalAreaColor:_,intervalAreaOpacity:Rt,yAxisTitle:S,noOfYTicks:k,minDate:it,maxDate:nt,curveType:f,styles:E,classNames:n,precision:Mt,customLayers:Ct}):null})]})}),V||X?e.jsxRuntimeExports.jsx(Qt.GraphFooter,{styles:{footnote:E?.footnote,source:E?.source},classNames:{footnote:n?.footnote,source:n?.source},sources:V,footNote:X,width:h}):null]})})})})}exports.LineChartWithConfidenceInterval=ie;
+import { j as i, m as B } from "./index-CHPV5EwG-BPSP-7Jg.js";
+import { useRef as mt, useState as R, useEffect as Vt } from "react";
+import { p as u, f as Rt } from "./parse-DlCRUFh_.js";
+import { s as Wt } from "./index-DxagiOHo.js";
+import { l as Ft, a as Ht } from "./simple-statistics-flVzqVtt.js";
+import { n as lt } from "./numberFormattingFunction-14YCbkN2.js";
+import { T as Yt } from "./Tooltip-DyM5snqx.js";
+import { c as v } from "./checkIfNullOrUndefined-DmfiKkNw.js";
+import { C as Pt, g as Et, A as Xt } from "./customArea-CaxScFmW.js";
+import { A as Gt } from "./AxisTitle-BmHLMRJZ.js";
+import { A as Bt } from "./Axis-Ddg-seDi.js";
+import { R as zt } from "./ReferenceLine-C1GpoG9d.js";
+import { R as Ut } from "./RegressionLine-BFwDCTUU.js";
+import { Y as qt } from "./YTicksAndGridLines-B6ah7CRf.js";
+import { H as Jt } from "./index-n_RI8T0n.js";
+import { u as Kt } from "./use-in-view-BAHrBy6b.js";
+import { t as Qt } from "./time-BzJP5SPC.js";
+import { a as Zt } from "./linear-DUdu7l2G.js";
+import { l as Ot, c as _t } from "./line-CPfhohvF.js";
+import { c as ti, s as ii, a as ei, m as ai } from "./step-BrDul-H4.js";
+import { a as ni } from "./area-BE2wo7fv.js";
+import { s as oi } from "./select-DKy99ogv.js";
+import { m as g } from "./proxy-DJxJg1kD.js";
+import { a as ri } from "./init-BhZylTFx.js";
+import { p as si } from "./pointer-CWRWOsrb.js";
+import { GraphFooter as li } from "./GraphFooter.js";
+import { GraphHeader as ci } from "./GraphHeader.js";
+import { Colors as ct } from "./Colors.js";
+import { ColorLegend as mi } from "./ColorLegend.js";
+import { E as yi } from "./EmptyState-DdTp-Mdn.js";
+function xi(yt) {
+  const {
+    data: V,
+    width: C,
+    height: W,
+    lineColor: k,
+    suffix: L,
+    prefix: f,
+    dateFormat: s,
+    highlightAreaSettings: h,
+    showValues: z,
+    noOfXTicks: xt,
+    rightMargin: ht,
+    leftMargin: j,
+    topMargin: b,
+    bottomMargin: U,
+    tooltip: q,
+    onSeriesMouseOver: F,
+    refValues: J,
+    minValue: K,
+    maxValue: Q,
+    animate: n,
+    rtl: Z,
+    strokeWidth: ut,
+    showDots: $,
+    annotations: pt,
+    customHighlightAreaSettings: gt,
+    regressionLine: H,
+    showIntervalDots: dt,
+    showIntervalValues: ft,
+    intervalLineStrokeWidth: Y,
+    intervalLineColors: A,
+    intervalAreaColor: wt,
+    intervalAreaOpacity: vt,
+    yAxisTitle: _,
+    noOfYTicks: jt,
+    minDate: P,
+    maxDate: E,
+    curveType: D,
+    styles: c,
+    classNames: m,
+    precision: N,
+    customLayers: tt
+  } = yt, it = mt(null), l = Kt(it, {
+    once: n.once,
+    amount: n.amount
+  }), [y, Mt] = R(!1);
+  Vt(() => {
+    if (l && !y) {
+      const t = setTimeout(
+        () => {
+          Mt(!0);
+        },
+        (n.duration + 0.5) * 1e3
+      );
+      return () => clearTimeout(t);
+    }
+  }, [l, y, n.duration]);
+  const S = D === "linear" ? _t : D === "step" ? ti : D === "stepAfter" ? ii : D === "stepBefore" ? ei : ai, [I, et] = R(void 0), [at, nt] = R(void 0), [X, G] = R(void 0), d = {
+    top: b,
+    bottom: U,
+    left: _ ? j + 30 : j,
+    right: ht
+  }, M = mt(null), a = Wt(
+    V.filter((t) => !v(t.y)).map((t) => ({
+      date: u(`${t.date}`, s, /* @__PURE__ */ new Date()),
+      y: t.y,
+      yMin: v(t.yMin) ? t.y : t.yMin,
+      yMax: v(t.yMax) ? t.y : t.yMax,
+      data: t.data
+    })),
+    "date"
+  ), Ct = h.map((t) => ({
+    ...t,
+    coordinates: [
+      t.coordinates[0] === null ? null : u(`${t.coordinates[0]}`, s, /* @__PURE__ */ new Date()),
+      t.coordinates[1] === null ? null : u(`${t.coordinates[1]}`, s, /* @__PURE__ */ new Date())
+    ]
+  })), bt = gt.map((t) => ({
+    ...t,
+    coordinates: t.coordinates.map(
+      (p, O) => O % 2 === 0 ? u(`${p}`, s, /* @__PURE__ */ new Date()) : p
+    )
+  })), r = C - d.left - d.right, w = W - d.top - d.bottom, ot = P ? u(`${P}`, s, /* @__PURE__ */ new Date()) : a[0].date, rt = E ? u(`${E}`, s, /* @__PURE__ */ new Date()) : a[a.length - 1].date, x = v(K) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) ? Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) > 0 ? 0 : Math.min(...a.map((t) => Math.min(t.y, t.yMax, t.yMin))) : 0 : K, T = Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) ? Math.max(...a.map((t) => Math.max(t.y, t.yMax, t.yMin))) : 0, e = Qt().domain([ot, rt]).range([0, r]), o = Zt().domain([
+    x,
+    v(Q) ? T > 0 ? T : 0 : Q
+  ]).range([w, 0]).nice(), Lt = Ot().x((t) => e(t.date)).y((t) => o(t.y)).curve(S), Dt = Ot().x((t) => e(t.date)).y((t) => o(t.yMin)).curve(S), Nt = Ot().x((t) => e(t.date)).y((t) => o(t.yMax)).curve(S), It = ni().x((t) => e(t.date)).y0((t) => o(t.yMin)).y1((t) => o(t.yMax)).curve(S), kt = o.ticks(jt), St = e.ticks(xt);
+  Vt(() => {
+    const t = (O) => {
+      const st = a[ri(
+        a.map((At) => At.date),
+        e.invert(si(O)[0]),
+        1
+      )];
+      et(st || a[a.length - 1]), F?.(st || a[a.length - 1]), G(O.clientY), nt(O.clientX);
+    }, p = () => {
+      et(void 0), nt(void 0), G(void 0), F?.(void 0);
+    };
+    oi(M.current).on("mousemove", t).on("mouseout", p);
+  }, [e, a, F]);
+  const Tt = Ft(
+    a.filter((t) => !v(t.date) && !v(t.y)).map((t) => [e(t.date), o(t.y)])
+  ), $t = Ht(Tt);
+  return /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+    /* @__PURE__ */ i.jsx(
+      g.svg,
+      {
+        width: `${C}px`,
+        height: `${W}px`,
+        viewBox: `0 0 ${C} ${W}`,
+        direction: "ltr",
+        ref: it,
+        children: /* @__PURE__ */ i.jsxs("g", { transform: `translate(${d.left},${d.top})`, children: [
+          /* @__PURE__ */ i.jsx(
+            Jt,
+            {
+              areaSettings: Ct,
+              width: r,
+              height: w,
+              scale: e,
+              animate: n,
+              isInView: l
+            }
+          ),
+          /* @__PURE__ */ i.jsx(
+            Pt,
+            {
+              areaSettings: bt,
+              scaleX: e,
+              scaleY: o,
+              animate: n,
+              isInView: l
+            }
+          ),
+          /* @__PURE__ */ i.jsxs("g", { children: [
+            /* @__PURE__ */ i.jsx(
+              qt,
+              {
+                values: kt.filter((t) => t !== 0),
+                y: kt.filter((t) => t !== 0).map((t) => o(t)),
+                x1: 0 - j,
+                x2: r + d.right,
+                styles: {
+                  gridLines: c?.yAxis?.gridLines,
+                  labels: c?.yAxis?.labels
+                },
+                classNames: {
+                  gridLines: m?.yAxis?.gridLines,
+                  labels: m?.yAxis?.labels
+                },
+                suffix: L,
+                prefix: f,
+                labelType: "secondary",
+                showGridLines: !0,
+                labelPos: "vertical",
+                precision: N
+              }
+            ),
+            /* @__PURE__ */ i.jsx(
+              Bt,
+              {
+                y1: o(x < 0 ? 0 : x),
+                y2: o(x < 0 ? 0 : x),
+                x1: 0 - j,
+                x2: r + d.right,
+                label: lt(
+                  x < 0 ? 0 : x,
+                  "NA",
+                  N,
+                  f,
+                  L
+                ),
+                labelPos: {
+                  x: 0 - j,
+                  y: o(x < 0 ? 0 : x),
+                  dx: 0,
+                  dy: T < 0 ? "1em" : -5
+                },
+                classNames: {
+                  axis: m?.xAxis?.axis,
+                  label: m?.yAxis?.labels
+                },
+                styles: {
+                  axis: c?.xAxis?.axis,
+                  label: c?.yAxis?.labels
+                }
+              }
+            ),
+            /* @__PURE__ */ i.jsx(
+              Gt,
+              {
+                x: 0 - j + 15,
+                y: w / 2,
+                style: c?.yAxis?.title,
+                className: m?.yAxis?.title,
+                text: _,
+                rotate90: !0
+              }
+            )
+          ] }),
+          /* @__PURE__ */ i.jsx("g", { children: St.map((t, p) => /* @__PURE__ */ i.jsx("g", { children: /* @__PURE__ */ i.jsx(
+            "text",
+            {
+              y: w,
+              x: e(t),
+              style: { textAnchor: "middle" },
+              className: "fill-primary-gray-700 dark:fill-primary-gray-300 xs:max-[360px]:hidden text-[9px] md:text-[10px] lg:text-xs",
+              dy: 15,
+              children: Rt(t, s)
+            }
+          ) }, p)) }),
+          tt.filter((t) => t.position === "before").map((t) => t.layer),
+          /* @__PURE__ */ i.jsx(
+            g.path,
+            {
+              style: {
+                fill: wt
+              },
+              exit: { opacity: 0, transition: { duration: n.duration } },
+              variants: {
+                initial: { opacity: 0, d: It(a) || "" },
+                whileInView: {
+                  opacity: vt,
+                  d: It(a) || "",
+                  transition: { duration: n.duration }
+                }
+              },
+              initial: "initial",
+              animate: l ? "whileInView" : "initial"
+            }
+          ),
+          Y ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            /* @__PURE__ */ i.jsx(
+              g.path,
+              {
+                style: {
+                  stroke: A[0],
+                  fill: "none",
+                  strokeWidth: Y
+                },
+                exit: { opacity: 0, transition: { duration: n.duration } },
+                variants: {
+                  initial: {
+                    pathLength: 0,
+                    d: Dt(a) || "",
+                    opacity: 1
+                  },
+                  whileInView: {
+                    pathLength: 1,
+                    d: Dt(a) || "",
+                    opacity: 1,
+                    transition: { duration: n.duration }
+                  }
+                },
+                initial: "initial",
+                animate: l ? "whileInView" : "initial"
+              }
+            ),
+            /* @__PURE__ */ i.jsx(
+              g.path,
+              {
+                style: {
+                  stroke: A[1],
+                  fill: "none",
+                  strokeWidth: Y
+                },
+                exit: { opacity: 0, transition: { duration: n.duration } },
+                variants: {
+                  initial: {
+                    pathLength: 0,
+                    d: Nt(a) || "",
+                    opacity: 1
+                  },
+                  whileInView: {
+                    pathLength: 1,
+                    d: Nt(a) || "",
+                    opacity: 1,
+                    transition: { duration: n.duration }
+                  }
+                },
+                initial: "initial",
+                animate: l ? "whileInView" : "initial"
+              }
+            )
+          ] }) : null,
+          /* @__PURE__ */ i.jsx(
+            g.path,
+            {
+              style: {
+                stroke: k,
+                fill: "none",
+                strokeWidth: ut
+              },
+              exit: { opacity: 0, transition: { duration: n.duration } },
+              variants: {
+                initial: {
+                  pathLength: 0,
+                  d: Lt(a) || "",
+                  opacity: 1
+                },
+                whileInView: {
+                  pathLength: 1,
+                  d: Lt(a) || "",
+                  opacity: 1,
+                  transition: { duration: n.duration }
+                }
+              },
+              initial: "initial",
+              animate: l ? "whileInView" : "initial"
+            }
+          ),
+          I ? /* @__PURE__ */ i.jsx(
+            "line",
+            {
+              y1: 0,
+              y2: w,
+              x1: e(I.date),
+              x2: e(I.date),
+              className: B(
+                "undp-tick-line stroke-primary-gray-700 dark:stroke-primary-gray-100",
+                m?.mouseOverLine
+              ),
+              style: c?.mouseOverLine
+            }
+          ) : null,
+          /* @__PURE__ */ i.jsx("g", { children: a.map((t, p) => /* @__PURE__ */ i.jsx(g.g, { children: v(t.y) ? null : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+            $ ? /* @__PURE__ */ i.jsx(
+              g.circle,
+              {
+                r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
+                style: { fill: k },
+                exit: { opacity: 0, transition: { duration: n.duration } },
+                variants: {
+                  initial: { opacity: 0, cx: e(t.date), cy: o(t.y) },
+                  whileInView: {
+                    opacity: 1,
+                    transition: {
+                      duration: y ? n.duration : 0.5,
+                      delay: y ? 0 : n.duration
+                    },
+                    cx: e(t.date),
+                    cy: o(t.y)
+                  }
+                },
+                initial: "initial",
+                animate: l ? "whileInView" : "initial"
+              }
+            ) : null,
+            dt ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+              /* @__PURE__ */ i.jsx(
+                g.circle,
+                {
+                  r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
+                  style: { fill: A[0] },
+                  exit: { opacity: 0, transition: { duration: n.duration } },
+                  variants: {
+                    initial: { opacity: 0, cx: e(t.date), cy: o(t.yMin) },
+                    whileInView: {
+                      opacity: 1,
+                      transition: {
+                        duration: y ? n.duration : 0.5,
+                        delay: y ? 0 : n.duration
+                      },
+                      cx: e(t.date),
+                      cy: o(t.yMin)
+                    }
+                  },
+                  initial: "initial",
+                  animate: l ? "whileInView" : "initial"
+                }
+              ),
+              /* @__PURE__ */ i.jsx(
+                g.circle,
+                {
+                  r: r / a.length < 5 ? 0 : r / a.length < 20 ? 2 : 4,
+                  style: { fill: A[1] },
+                  exit: { opacity: 0, transition: { duration: n.duration } },
+                  variants: {
+                    initial: { opacity: 0, cx: e(t.date), cy: o(t.yMax) },
+                    whileInView: {
+                      opacity: 1,
+                      transition: {
+                        duration: y ? n.duration : 0.5,
+                        delay: y ? 0 : n.duration
+                      },
+                      cx: e(t.date),
+                      cy: o(t.yMax)
+                    }
+                  },
+                  initial: "initial",
+                  animate: l ? "whileInView" : "initial"
+                }
+              )
+            ] }) : null,
+            z ? /* @__PURE__ */ i.jsx(
+              g.text,
+              {
+                dy: -8,
+                style: {
+                  fill: k,
+                  textAnchor: "middle",
+                  ...c?.graphObjectValues || {}
+                },
+                className: B(
+                  "graph-value text-xs font-bold",
+                  m?.graphObjectValues
+                ),
+                exit: { opacity: 0, transition: { duration: n.duration } },
+                variants: {
+                  initial: { opacity: 0, x: e(t.date), y: o(t.y) },
+                  whileInView: {
+                    opacity: 1,
+                    x: e(t.date),
+                    y: o(t.y),
+                    transition: {
+                      duration: y ? n.duration : 0.5,
+                      delay: y ? 0 : n.duration
+                    }
+                  }
+                },
+                initial: "initial",
+                animate: l ? "whileInView" : "initial",
+                children: lt(t.y, "NA", N, f, L)
+              }
+            ) : null,
+            ft ? /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+              /* @__PURE__ */ i.jsx(
+                g.text,
+                {
+                  dy: "1em",
+                  style: {
+                    fill: A[0],
+                    textAnchor: "middle",
+                    ...c?.graphObjectValues || {}
+                  },
+                  className: B("text-xs font-bold", m?.graphObjectValues),
+                  exit: { opacity: 0, transition: { duration: n.duration } },
+                  variants: {
+                    initial: { opacity: 0, x: e(t.date), y: o(t.yMin) },
+                    whileInView: {
+                      opacity: 1,
+                      x: e(t.date),
+                      y: o(t.yMin),
+                      transition: {
+                        duration: y ? n.duration : 0.5,
+                        delay: y ? 0 : n.duration
+                      }
+                    }
+                  },
+                  initial: "initial",
+                  animate: l ? "whileInView" : "initial",
+                  children: lt(t.yMin, "NA", N, f, L)
+                }
+              ),
+              /* @__PURE__ */ i.jsx(
+                g.text,
+                {
+                  dy: -8,
+                  style: {
+                    fill: A[1],
+                    textAnchor: "middle",
+                    ...c?.graphObjectValues || {}
+                  },
+                  className: B("text-xs font-bold", m?.graphObjectValues),
+                  exit: { opacity: 0, transition: { duration: n.duration } },
+                  variants: {
+                    initial: { opacity: 0, x: e(t.date), y: o(t.yMax) },
+                    whileInView: {
+                      opacity: 1,
+                      x: e(t.date),
+                      y: o(t.yMax),
+                      transition: {
+                        duration: y ? n.duration : 0.5,
+                        delay: y ? 0 : n.duration
+                      }
+                    }
+                  },
+                  initial: "initial",
+                  animate: l ? "whileInView" : "initial",
+                  children: lt(t.yMax, "NA", N, f, L)
+                }
+              )
+            ] }) : null
+          ] }) }, p)) }),
+          J ? /* @__PURE__ */ i.jsx(i.Fragment, { children: J.map((t, p) => /* @__PURE__ */ i.jsx(
+            zt,
+            {
+              text: t.text,
+              color: t.color,
+              y: o(t.value),
+              x1: 0 - j,
+              x2: r + d.right,
+              classNames: t.classNames,
+              styles: t.styles,
+              animate: n,
+              isInView: l
+            },
+            p
+          )) }) : null,
+          /* @__PURE__ */ i.jsx("g", { children: pt.map((t, p) => {
+            const O = Et(
+              {
+                x: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+                y: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) - 8 : 0 + (t.yOffset || 0) - 8
+              },
+              {
+                x: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) : 0,
+                y: t.yCoordinate ? o(t.yCoordinate) : 0
+              },
+              v(t.connectorRadius) ? 3.5 : t.connectorRadius
+            ), st = t.showConnector ? {
+              y1: O.y,
+              x1: O.x,
+              y2: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) : 0 + (t.yOffset || 0),
+              x2: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+              cy: t.yCoordinate ? o(t.yCoordinate) : 0,
+              cx: t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) : 0,
+              circleRadius: v(t.connectorRadius) ? 3.5 : t.connectorRadius,
+              strokeWidth: t.showConnector === !0 ? 2 : Math.min(t.showConnector || 0, 1)
+            } : void 0, At = {
+              y: t.yCoordinate ? o(t.yCoordinate) + (t.yOffset || 0) - 8 : 0 + (t.yOffset || 0) - 8,
+              x: Z ? 0 : t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0),
+              width: Z ? t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0) : r - (t.xCoordinate ? e(u(`${t.xCoordinate}`, s, /* @__PURE__ */ new Date())) + (t.xOffset || 0) : 0 + (t.xOffset || 0)),
+              maxWidth: t.maxWidth,
+              fontWeight: t.fontWeight,
+              align: t.align
+            };
+            return /* @__PURE__ */ i.jsx(
+              Xt,
+              {
+                color: t.color,
+                connectorsSettings: st,
+                labelSettings: At,
+                text: t.text,
+                classNames: t.classNames,
+                styles: t.styles,
+                animate: n,
+                isInView: l
+              },
+              p
+            );
+          }) }),
+          /* @__PURE__ */ i.jsx("g", { children: H ? /* @__PURE__ */ i.jsx(
+            Ut,
+            {
+              x1: 0,
+              x2: r,
+              y1: $t(0),
+              y2: $t(r),
+              graphHeight: w,
+              graphWidth: r,
+              className: m?.regLine,
+              style: c?.regLine,
+              color: typeof H == "string" ? H : void 0,
+              animate: n,
+              isInView: l
+            }
+          ) : null }),
+          tt.filter((t) => t.position === "after").map((t) => t.layer),
+          /* @__PURE__ */ i.jsx(
+            "rect",
+            {
+              ref: M,
+              style: {
+                fill: "none",
+                pointerEvents: "all"
+              },
+              width: r,
+              height: w
+            }
+          )
+        ] })
+      }
+    ),
+    I && q && at && X ? /* @__PURE__ */ i.jsx(
+      Yt,
+      {
+        data: I,
+        body: q,
+        xPos: at,
+        yPos: X,
+        backgroundStyle: c?.tooltip,
+        className: m?.tooltip
+      }
+    ) : null
+  ] });
+}
+function Xi(yt) {
+  const {
+    data: V,
+    graphTitle: C,
+    suffix: W = "",
+    sources: k,
+    prefix: L = "",
+    graphDescription: f,
+    height: s,
+    width: h,
+    footNote: z,
+    noOfXTicks: xt = 10,
+    dateFormat: ht = "yyyy",
+    showValues: j = !1,
+    backgroundColor: b = !1,
+    padding: U,
+    lineColor: q,
+    leftMargin: F = 30,
+    rightMargin: J = 30,
+    topMargin: K = 20,
+    bottomMargin: Q = 25,
+    tooltip: n,
+    refValues: Z = [],
+    highlightAreaSettings: ut = [],
+    relativeHeight: $,
+    onSeriesMouseOver: pt,
+    graphID: gt,
+    minValue: H,
+    maxValue: dt,
+    regressionLine: ft = !1,
+    showIntervalDots: Y = !1,
+    showIntervalValues: A = !1,
+    intervalLineStrokeWidth: wt = 0,
+    intervalLineColors: vt = [ct.light.grays["gray-500"], ct.light.grays["gray-500"]],
+    intervalAreaColor: _ = ct.primaryColors["blue-100"],
+    intervalAreaOpacity: jt = 0.4,
+    graphDownload: P = !1,
+    dataDownload: E = !1,
+    animate: D = !1,
+    language: c = "en",
+    minHeight: m = 0,
+    strokeWidth: N = 2,
+    showDots: tt = !0,
+    annotations: it = [],
+    customHighlightAreaSettings: l = [],
+    theme: y = "light",
+    ariaLabel: Mt,
+    yAxisTitle: S,
+    noOfYTicks: I = 5,
+    minDate: et,
+    maxDate: at,
+    colorLegendTitle: nt,
+    colorLegendColors: X,
+    colorLegendDomain: G,
+    curveType: d = "curve",
+    styles: M,
+    classNames: a,
+    precision: Ct = 2,
+    customLayers: bt = []
+  } = yt, [r, w] = R(0), [ot, rt] = R(0), x = mt(null), T = mt(null);
+  return Vt(() => {
+    const e = new ResizeObserver((o) => {
+      w(h || o[0].target.clientWidth || 620), rt(s || o[0].target.clientHeight || 480);
+    });
+    return x.current && (rt(x.current.clientHeight || 480), w(x.current.clientWidth || 620), h || e.observe(x.current)), () => e.disconnect();
+  }, [h, s]), /* @__PURE__ */ i.jsx(
+    "div",
+    {
+      className: `${y || "light"} flex  ${h ? "w-fit grow-0" : "w-full grow"}`,
+      dir: c === "he" || c === "ar" ? "rtl" : void 0,
+      children: /* @__PURE__ */ i.jsx(
+        "div",
+        {
+          className: B(
+            `${b ? b === !0 ? "bg-primary-gray-200 dark:bg-primary-gray-650 " : "" : "bg-transparent "}ml-auto mr-auto flex flex-col grow h-inherit ${c || "en"}`,
+            a?.graphContainer
+          ),
+          style: {
+            ...M?.graphContainer || {},
+            ...b && b !== !0 ? { backgroundColor: b } : {}
+          },
+          id: gt,
+          ref: T,
+          "aria-label": Mt || `${C ? `The graph shows ${C}. ` : ""}This is a line chart that highlights the difference between two datasets over time.${f ? ` ${f}` : ""}`,
+          children: /* @__PURE__ */ i.jsx(
+            "div",
+            {
+              className: "flex grow",
+              style: { padding: b ? U || "1rem" : U || 0 },
+              children: /* @__PURE__ */ i.jsxs("div", { className: "flex flex-col w-full gap-4 grow justify-between", children: [
+                C || f || P || E ? /* @__PURE__ */ i.jsx(
+                  ci,
+                  {
+                    styles: {
+                      title: M?.title,
+                      description: M?.description
+                    },
+                    classNames: {
+                      title: a?.title,
+                      description: a?.description
+                    },
+                    graphTitle: C,
+                    graphDescription: f,
+                    width: h,
+                    graphDownload: P ? T.current : void 0,
+                    dataDownload: E ? V.map((e) => e.data).filter((e) => e !== void 0).length > 0 ? V.map((e) => e.data).filter((e) => e !== void 0) : V.filter((e) => e !== void 0) : null
+                  }
+                ) : null,
+                /* @__PURE__ */ i.jsx("div", { className: "grow flex flex-col justify-center gap-3 w-full", children: V.length === 0 ? /* @__PURE__ */ i.jsx(yi, {}) : /* @__PURE__ */ i.jsxs(i.Fragment, { children: [
+                  X && G ? /* @__PURE__ */ i.jsx(
+                    mi,
+                    {
+                      width: h,
+                      colorLegendTitle: nt,
+                      colors: X,
+                      colorDomain: G,
+                      showNAColor: !1
+                    }
+                  ) : null,
+                  /* @__PURE__ */ i.jsx(
+                    "div",
+                    {
+                      className: "flex flex-col grow justify-center leading-0",
+                      ref: x,
+                      "aria-label": "Graph area",
+                      children: (h || r) && (s || ot) ? /* @__PURE__ */ i.jsx(
+                        xi,
+                        {
+                          data: V,
+                          lineColor: q || ct.primaryColors["blue-600"],
+                          width: h || r,
+                          height: Math.max(
+                            m,
+                            s || ($ ? m ? (h || r) * $ > m ? (h || r) * $ : m : (h || r) * $ : ot)
+                          ),
+                          suffix: W,
+                          prefix: L,
+                          dateFormat: ht,
+                          showValues: j,
+                          noOfXTicks: xt,
+                          leftMargin: F,
+                          rightMargin: J,
+                          topMargin: K,
+                          bottomMargin: Q,
+                          tooltip: n,
+                          highlightAreaSettings: ut,
+                          onSeriesMouseOver: pt,
+                          refValues: Z,
+                          minValue: H,
+                          maxValue: dt,
+                          animate: D === !0 ? { duration: 0.5, once: !0, amount: 0.5 } : D || { duration: 0, once: !0, amount: 0 },
+                          rtl: c === "he" || c === "ar",
+                          strokeWidth: N,
+                          showDots: tt,
+                          annotations: it,
+                          customHighlightAreaSettings: l,
+                          regressionLine: ft,
+                          showIntervalDots: Y,
+                          showIntervalValues: A,
+                          intervalLineStrokeWidth: wt,
+                          intervalLineColors: vt,
+                          intervalAreaColor: _,
+                          intervalAreaOpacity: jt,
+                          yAxisTitle: S,
+                          noOfYTicks: I,
+                          minDate: et,
+                          maxDate: at,
+                          curveType: d,
+                          styles: M,
+                          classNames: a,
+                          precision: Ct,
+                          customLayers: bt
+                        }
+                      ) : null
+                    }
+                  )
+                ] }) }),
+                k || z ? /* @__PURE__ */ i.jsx(
+                  li,
+                  {
+                    styles: { footnote: M?.footnote, source: M?.source },
+                    classNames: {
+                      footnote: a?.footnote,
+                      source: a?.source
+                    },
+                    sources: k,
+                    footNote: z,
+                    width: h
+                  }
+                ) : null
+              ] })
+            }
+          )
+        }
+      )
+    }
+  );
+}
+export {
+  Xi as LineChartWithConfidenceInterval
+};
 //# sourceMappingURL=LineChartWithConfidenceInterval.js.map