@dub/ui 0.2.15 → 0.2.16

package/dist/charts/index.mjs

@@ -1,2 +1,2 @@
 "use client"
-import{a as X}from"../chunk-NWME2ANF.mjs";import{c as z,o as T}from"../chunk-ETTCESDB.mjs";import{LinearGradient as dt}from"@visx/gradient";import{Group as ut}from"@visx/group";import{Area as ft,AreaClosed as ht,Circle as xt}from"@visx/shape";import{AnimatePresence as gt,motion as _}from"framer-motion";import{useMemo as Ct}from"react";import{createContext as Q,useContext as j}from"react";var V=Q(null);function M(){let t=j(V);if(!t)throw new Error("No chart context");return t}var I=Q(null);function E(){let t=j(I);if(!t)throw new Error("No chart tooltip context");return t}import{jsx as S,jsxs as yt}from"react/jsx-runtime";function Te({seriesStyles:t}){let{data:n,series:l,margin:g,xScale:s,yScale:m,startDate:u,endDate:f}=M();if(!("ticks"in s))throw new Error("Areas require a time scale (type=area)");let{tooltipData:i}=E(),h=Ct(()=>n.map(c=>({...c,values:Object.fromEntries(Object.keys(c.values).map(e=>[e,0]))})),[n]);return S(ut,{left:g.left,top:g.top,children:S(gt,{children:l.filter(({isActive:c})=>c).map(c=>{let e=t==null?void 0:t.find(({id:o})=>o===c.id);return yt(_.g,{initial:{opacity:1},exit:{opacity:0},transition:{duration:.1},children:[S(dt,{id:`${c.id}-mask-gradient`,from:"white",to:"white",fromOpacity:.2,toOpacity:0,x1:0,x2:0,y1:0,y2:1}),S("mask",{id:`${c.id}-mask`,maskContentUnits:"objectBoundingBox",children:S("rect",{width:"1",height:"1",fill:`url(#${c.id}-mask-gradient)`})}),S(ht,{data:n,x:o=>s(o.date),y:o=>m(c.valueAccessor(o)??0),yScale:m,children:({path:o})=>S(_.path,{initial:{d:o(h)||"",opacity:0},animate:{d:o(n)||"",opacity:1},className:T(c.colorClassName??"text-blue-500",e==null?void 0:e.gradientClassName),mask:`url(#${c.id}-mask)`,fill:(e==null?void 0:e.areaFill)??"currentColor"})}),S(ft,{data:n,x:o=>s(o.date),y:o=>m(c.valueAccessor(o)??0),children:({path:o})=>S(_.path,{initial:{d:o(h)||""},animate:{d:o(n)||""},className:T(c.colorClassName??"text-blue-700",e==null?void 0:e.lineClassName),stroke:(e==null?void 0:e.lineStroke)??"currentColor",strokeOpacity:.8,strokeWidth:2,fill:"transparent"})}),!i&&S(xt,{cx:s(n.at(-1).date),cy:m(c.valueAccessor(n.at(-1))),r:4,className:T(c.colorClassName??"text-blue-700",e==null?void 0:e.lineClassName),fill:"currentColor"})]},`${c.id}_${u.toString()}_${f.toString()}`)})})})}import{RectClipPath as bt}from"@visx/clip-path";import{LinearGradient as Tt}from"@visx/gradient";import{Group as vt}from"@visx/group";import{BarRounded as kt}from"@visx/shape";import{AnimatePresence as wt,motion as H}from"framer-motion";import{useId as Nt}from"react";import{jsx as G,jsxs as J}from"react/jsx-runtime";function Le({seriesStyles:t}){let n=Nt(),{data:l,series:g,margin:s,xScale:m,yScale:u,width:f,height:i,startDate:h,endDate:c}=M();if(!("bandwidth"in m))throw new Error("Bars require a band scale (type=bar)");return J(vt,{left:s.left,top:s.top,children:[G(bt,{id:n,x:0,y:0,width:f,height:i}),G(wt,{children:g.filter(({isActive:e})=>e).map(e=>{let o=t==null?void 0:t.find(({id:a})=>a===e.id);return J(H.g,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.1},clipPath:`url(#${n})`,children:[G(Tt,{className:T(e.colorClassName??"text-blue-500",o==null?void 0:o.gradientClassName),id:`${e.id}-background`,fromOffset:"0%",from:"currentColor",fromOpacity:.01,toOffset:"40%",to:"currentColor",toOpacity:1,x1:0,x2:0,y1:1}),G(H.g,{initial:{y:100},animate:{y:0},transition:{duration:.15,ease:"easeOut"},children:l.map(a=>{let r=m.bandwidth(),p=m(a.date)??0,x=u(e.valueAccessor(a)??0),d=i-x,A=Math.min(r,d)/2;return d>0?G(kt,{x:p,y:x,width:r,height:d,radius:1e3,top:!0,className:T(e.colorClassName??"text-blue-700",o==null?void 0:o.barClassName),fill:(o==null?void 0:o.barFill)??`url(#${e.id}-background)`},a.date.toString()):null})})]},`${e.id}_${h.toString()}_${c.toString()}`)})})]})}import{curveBasis as Dt}from"@visx/curve";import{ParentSize as At}from"@visx/responsive";import{scaleLinear as K}from"@visx/scale";import{Area as St}from"@visx/shape";import{Text as Pt}from"@visx/text";import{motion as Mt}from"framer-motion";import{Fragment as Lt,useMemo as R,useState as Ot}from"react";import{jsx as v,jsxs as O}from"react/jsx-runtime";var Ft=[{opacity:1,padding:0},{opacity:.3,padding:8},{opacity:.15,padding:16}],Z=16,tt=40;function _e(t){return v("div",{className:"size-full",children:v(At,{className:"relative",children:({width:n,height:l})=>n&&l?v($t,{...t,width:n,height:l}):null})})}function $t({width:t,height:n,steps:l,persistentPercentages:g=!0,defaultTooltipStepId:s}){let{isMobile:m}=X(),[u,f]=Ot(s??null),i=l.find(({id:r})=>r===u),h=R(()=>Object.fromEntries(l.map(({id:r,value:p},x)=>{var d;return[r,ot(p,((d=l[x+1])==null?void 0:d.value)??l[l.length-1].value)]})),[l]),c=R(()=>ot(0,0),[l]),e=R(()=>Math.max(...l.map(r=>r.value)),[l]),o=K({domain:[0,l.length],range:[0,t]}),a=K({domain:[e,-e],range:[n-Z-tt,Z+tt]});return O("div",{className:"relative",children:[v("svg",{width:t,height:n,children:l.map(({id:r,value:p,colorClassName:x},d)=>O(Lt,{children:[v("rect",{x:o(d),y:0,width:t/l.length,height:n,className:"fill-transparent transition-colors hover:fill-blue-600/5",onPointerEnter:()=>f(r),onPointerDown:()=>f(r),onPointerLeave:()=>!m&&f(s??null)}),v("line",{x1:o(d),y1:0,x2:o(d),y2:n,className:"stroke-black/5 sm:stroke-black/10"}),Ft.map(({opacity:A,padding:k})=>v(St,{data:h[r],curve:Dt,x:C=>o(d+C.x),y0:C=>a(-C.y)-k,y1:C=>a(C.y)+k,children:({path:C})=>v(Mt.path,{initial:{d:C(c)||"",opacity:0},animate:{d:C(h[r])||"",opacity:A},className:T(x,"pointer-events-none"),fill:"currentColor"})},`${r}-${A}-${k}`)),g&&v(Pt,{x:(o(d)+o(d+1))/2,y:n/2,textAnchor:"middle",verticalAnchor:"middle",fill:"white",fontSize:16,className:"pointer-events-none select-none",children:et(p/e*100)+"%"})]},r))}),i&&v("div",{className:T("pointer-events-none absolute flex items-center justify-center px-1 pb-4",g?"animate-slide-up-fade top-16 sm:top-12":"animate-fade-in top-1/2 -translate-y-1/2"),style:{left:o(l.findIndex(({id:r})=>r===i.id)),width:t/l.length},children:O("div",{className:T("rounded-lg border border-gray-200 bg-white text-base shadow-sm"),children:[v("p",{className:"border-b border-gray-200 px-3 py-2 text-sm text-gray-900 sm:px-4 sm:py-3",children:i.label}),O("div",{className:"flex flex-wrap justify-between gap-x-4 gap-y-2 px-3 py-2 text-sm sm:px-4 sm:py-3",children:[O("div",{className:"flex items-center gap-2",children:[v("div",{className:T(i.colorClassName,"h-2 w-2 shrink-0 rounded-sm bg-current opacity-50 shadow-[inset_0_0_0_1px_#0003]")}),v("p",{className:"whitespace-nowrap capitalize text-gray-600",children:et(i.value/e*100)+"%"})]}),O("p",{className:"whitespace-nowrap font-medium text-gray-900",children:[z(i.value,{full:!0}),i.additionalValue!==void 0&&O("span",{className:"text-gray-500",children:[" ","($",z(i.additionalValue/100),")"]})]})]})]})},i.id)]})}var et=t=>t>0&&t<.01?"< 0.01":z(t,{digits:2}),ot=(t,n)=>[{x:0,y:t},{x:.3,y:t},{x:.5,y:(t+n)/2},{x:.7,y:n},{x:1,y:n}];import{Group as Rt}from"@visx/group";import{ParentSize as Yt}from"@visx/responsive";import{scaleBand as Ut,scaleLinear as qt,scaleUtc as Xt}from"@visx/scale";import{Bar as at,Circle as Qt,Line as jt}from"@visx/shape";import{useMemo as Y,useState as Ht}from"react";import{localPoint as Gt}from"@visx/event";import{TooltipWithBounds as zt,useTooltipInPortal as Et,useTooltip as Wt}from"@visx/tooltip";import{bisector as Bt}from"d3-array";import{useCallback as Vt,useMemo as It}from"react";var _t=Bt(t=>new Date(t.date)).left;function rt({seriesId:t,chartContext:n,renderInPortal:l=!1,snapToY:g=!1,snapToX:s=!0,defaultIndex:m}){let{series:u,data:f,xScale:i,yScale:h,margin:c}=n,e=Et({scroll:!0,detectBounds:!0,debounce:200}),o=m!==void 0?f[m]:void 0,a=It(()=>o!==void 0?{tooltipData:o,tooltipLeft:s?i(o.date):0,tooltipTop:g?h(u.find(d=>d.id===t).valueAccessor(o)):0}:void 0,[o,s,g,i,h,u,t]),r=Wt(a??void 0),p=Vt(d=>{let k=(Gt(d)||{x:0}).x-c.left,C="invert"in i?i.invert(k):i.domain()[Math.round((k-i.step()*.75)/i.step())];if(C===void 0){console.log("x0 is undefined",{defaultTooltipData:a}),a?r.showTooltip(a):r.hideTooltip();return}let F=_t(f,C,1),y=f[F-1],P=f[F],L=y;P!=null&&P.date&&(L=C.valueOf()-y.date.valueOf()>P.date.valueOf()-C.valueOf()?P:y),r.showTooltip({tooltipData:L,tooltipLeft:s?i(L.date):k,tooltipTop:g?h(u.find(w=>w.id===t).valueAccessor(L)):0})},[t,f,i,h,u,a,r.showTooltip]),x=l?e.TooltipInPortal:zt;return{handleTooltip:p,TooltipWrapper:x,containerRef:e.containerRef,...r,hideTooltip:()=>a?r.showTooltip(a):r.hideTooltip()}}import{Fragment as nt,jsx as D,jsxs as W}from"react/jsx-runtime";function ao(t){return D(Yt,{className:"relative",children:({width:n,height:l})=>n>0&&l>0&&D(Jt,{...t,width:n,height:l})})}function Jt({type:t="area",width:n,height:l,children:g,data:s,series:m,tooltipContent:u=e=>m[0].valueAccessor(e).toString(),tooltipClassName:f="",defaultTooltipIndex:i=null,margin:h={top:12,right:4,bottom:32,left:4},padding:c}){let[e,o]=Ht(),a={...h,left:h.left+(e??0)},r=c??{top:.1,bottom:t==="area"?.1:0},p=n-a.left-a.right,x=l-a.top-a.bottom,{startDate:d,endDate:A}=Y(()=>{let b=s.map(({date:$})=>$),N=b.map($=>$.getTime());return{startDate:b[N.indexOf(Math.min(...N))],endDate:b[N.indexOf(Math.max(...N))]}},[s]),{minY:k,maxY:C}=Y(()=>{let b=m.filter(({isActive:N})=>N!==!1).map(({valueAccessor:N})=>s.map($=>N($))).flat().filter(N=>N!=null);return{minY:t==="area"?Math.min(...b):Math.min(0,...b),maxY:Math.max(...b)}},[s,m]),{yScale:F,xScale:y}=Y(()=>{let b=C-k;return{yScale:qt({domain:[k-b*(r.bottom??0),C+b*(r.top??0)],range:[x,0],nice:!0,clamp:!0}),xScale:t==="area"?Xt({domain:[d,A],range:[0,p]}):Ut({domain:s.map(({date:N})=>N),range:[0,p],padding:Math.min(.75,p/s.length*.02),align:.5})}},[d,A,k,C,x,p,s.length,t]),P={type:t,width:p,height:x,data:s,series:m,startDate:d,endDate:A,xScale:y,yScale:F,minY:k,maxY:C,margin:a,padding:r,tooltipContent:u,tooltipClassName:f,defaultTooltipIndex:i,leftAxisMargin:e,setLeftAxisMargin:o},L=rt({seriesId:m[0].id,chartContext:P,defaultIndex:i??void 0}),{tooltipData:w,TooltipWrapper:lt,tooltipLeft:st,tooltipTop:mt,handleTooltip:B,hideTooltip:ct,containerRef:pt}=L;return D(V.Provider,{value:P,children:W(I.Provider,{value:L,children:[W("svg",{width:n,height:l,ref:pt,children:[g,W(Rt,{left:a.left,top:a.top,children:[w&&("bandwidth"in y?D(nt,{children:D(at,{x:(y(w.date)??0)-y.bandwidth()*y.padding(),width:y.bandwidth()*(1+y.padding()*2),y:0,height:x,fill:"black",fillOpacity:.05})}):W(nt,{children:[D(jt,{x1:y(w.date),x2:y(w.date),y1:x,y2:0,stroke:"black",strokeWidth:1.5}),m.filter(({isActive:b})=>b).map(b=>D(Qt,{cx:y(w.date),cy:F(b.valueAccessor(w)),r:4,className:b.colorClassName??"text-blue-800",fill:"currentColor"},b.id))]})),D(at,{x:0,y:0,width:p,height:x,onTouchStart:B,onTouchMove:B,onMouseMove:B,onMouseLeave:ct,fill:"transparent"})]})]}),D("div",{className:"pointer-events-none absolute inset-0",children:w&&D(lt,{left:(st??0)+a.left,top:(mt??0)+a.top,offsetLeft:"bandwidth"in y?y.bandwidth()+8:8,offsetTop:12,className:"absolute",unstyled:!0,children:D("div",{className:T("pointer-events-none rounded-lg border border-gray-200 bg-white px-4 py-2 text-base shadow-sm",f),children:(u==null?void 0:u(w))??m[0].valueAccessor(w)})},w.date.toString())})]})})}import{AxisBottom as Kt}from"@visx/axis";import{Group as Zt}from"@visx/group";import{Line as te}from"@visx/shape";import{useMemo as ee}from"react";var it=t=>[...Array(t+1).keys()].filter(n=>t%n===0);import{Fragment as oe,jsx as U,jsxs as re}from"react/jsx-runtime";function fo({maxTicks:t,showGridLines:n=!1,highlightLast:l=!0,tickFormat:g=s=>s.toLocaleDateString("en-US",{month:"short",day:"numeric"})}){let{data:s,margin:m,width:u,height:f,xScale:i,startDate:h,endDate:c}=M(),{tooltipData:e}=E(),o=ee(()=>{let a=t??u<450?4:u<600?6:8,r=it(s.length).find(x=>(s.length+1)/x<=a)??1,p=s.length/r<2;return s.filter((x,d,{length:A})=>p?d===0||d===A-1:(d+1)%r===0).map(({date:x})=>x)},[u,t,s]);return re(oe,{children:[U(Kt,{left:m.left,top:m.top+f,scale:i,tickValues:o,hideTicks:!0,stroke:"#00000026",tickFormat:a=>g(a),tickLabelProps:(a,r,{length:p})=>({className:"transition-colors",textAnchor:r===0?"start":r===p-1?"end":"middle",fontSize:12,fill:(e?e.date===a:l&&r===p-1)?"#000":"#00000066"})}),n&&U(Zt,{left:m.left,top:m.top,children:o.length>0&&o.map(a=>U(te,{x1:i(a),x2:i(a),y1:f,y2:0,stroke:a===(e==null?void 0:e.date)?"transparent":"#00000026",strokeWidth:1,strokeDasharray:[h,c].includes(a)?0:5},a.toString()))})]})}import{AxisLeft as ae}from"@visx/axis";import{Group as ne}from"@visx/group";import{Line as ie}from"@visx/shape";import{getStringWidth as le}from"@visx/text";import{useLayoutEffect as se,useMemo as me}from"react";import{Fragment as ce,jsx as q,jsxs as pe}from"react/jsx-runtime";function vo({numTicks:t,showGridLines:n=!1,integerTicks:l=!1,tickValues:g,tickFormat:s=u=>u.toString(),tickAxisSpacing:m=8}){let{width:u,height:f,margin:i,yScale:h,minY:c,leftAxisMargin:e,setLeftAxisMargin:o}=M(),a=me(()=>{if(g)return g;let r=t??f<350?3:4;return h.ticks(r).filter(p=>p>=c&&l?Number.isInteger(p):!0)},[g,t,f,h,l]);return se(()=>{let r=Math.max(...a.map(p=>le(s(p),{fontSize:12})??0))+m;(e??0)<r&&o(r)},[a,m,e]),pe(ce,{children:[q(ae,{left:i.left,top:i.top,scale:h,tickValues:a,hideTicks:!0,stroke:"transparent",tickFormat:r=>s(r),tickLength:m,tickLabelProps:()=>({fontSize:12,fill:"#00000066",textAnchor:"end",verticalAnchor:"middle"})}),n&&q(ne,{left:i.left,top:i.top,children:a.length>0&&a.map(r=>{let p=h(r);if(p!==f)return q(ie,{y1:p,y2:p,x1:0,x2:u,stroke:"#00000026",strokeWidth:1,strokeDasharray:5},r.toString())})})]})}export{Te as Areas,Le as Bars,V as ChartContext,I as ChartTooltipContext,_e as FunnelChart,ao as TimeSeriesChart,fo as XAxis,vo as YAxis,M as useChartContext,E as useChartTooltipContext};
+import{a as X}from"../chunk-NWME2ANF.mjs";import{c as z,o as T}from"../chunk-DG4AUGTQ.mjs";import{LinearGradient as dt}from"@visx/gradient";import{Group as ut}from"@visx/group";import{Area as ft,AreaClosed as ht,Circle as xt}from"@visx/shape";import{AnimatePresence as gt,motion as _}from"framer-motion";import{useMemo as Ct}from"react";import{createContext as Q,useContext as j}from"react";var V=Q(null);function M(){let t=j(V);if(!t)throw new Error("No chart context");return t}var I=Q(null);function E(){let t=j(I);if(!t)throw new Error("No chart tooltip context");return t}import{jsx as S,jsxs as yt}from"react/jsx-runtime";function Te({seriesStyles:t}){let{data:n,series:l,margin:g,xScale:s,yScale:m,startDate:u,endDate:f}=M();if(!("ticks"in s))throw new Error("Areas require a time scale (type=area)");let{tooltipData:i}=E(),h=Ct(()=>n.map(c=>({...c,values:Object.fromEntries(Object.keys(c.values).map(e=>[e,0]))})),[n]);return S(ut,{left:g.left,top:g.top,children:S(gt,{children:l.filter(({isActive:c})=>c).map(c=>{let e=t==null?void 0:t.find(({id:o})=>o===c.id);return yt(_.g,{initial:{opacity:1},exit:{opacity:0},transition:{duration:.1},children:[S(dt,{id:`${c.id}-mask-gradient`,from:"white",to:"white",fromOpacity:.2,toOpacity:0,x1:0,x2:0,y1:0,y2:1}),S("mask",{id:`${c.id}-mask`,maskContentUnits:"objectBoundingBox",children:S("rect",{width:"1",height:"1",fill:`url(#${c.id}-mask-gradient)`})}),S(ht,{data:n,x:o=>s(o.date),y:o=>m(c.valueAccessor(o)??0),yScale:m,children:({path:o})=>S(_.path,{initial:{d:o(h)||"",opacity:0},animate:{d:o(n)||"",opacity:1},className:T(c.colorClassName??"text-blue-500",e==null?void 0:e.gradientClassName),mask:`url(#${c.id}-mask)`,fill:(e==null?void 0:e.areaFill)??"currentColor"})}),S(ft,{data:n,x:o=>s(o.date),y:o=>m(c.valueAccessor(o)??0),children:({path:o})=>S(_.path,{initial:{d:o(h)||""},animate:{d:o(n)||""},className:T(c.colorClassName??"text-blue-700",e==null?void 0:e.lineClassName),stroke:(e==null?void 0:e.lineStroke)??"currentColor",strokeOpacity:.8,strokeWidth:2,fill:"transparent"})}),!i&&S(xt,{cx:s(n.at(-1).date),cy:m(c.valueAccessor(n.at(-1))),r:4,className:T(c.colorClassName??"text-blue-700",e==null?void 0:e.lineClassName),fill:"currentColor"})]},`${c.id}_${u.toString()}_${f.toString()}`)})})})}import{RectClipPath as bt}from"@visx/clip-path";import{LinearGradient as Tt}from"@visx/gradient";import{Group as vt}from"@visx/group";import{BarRounded as kt}from"@visx/shape";import{AnimatePresence as wt,motion as H}from"framer-motion";import{useId as Nt}from"react";import{jsx as G,jsxs as J}from"react/jsx-runtime";function Le({seriesStyles:t}){let n=Nt(),{data:l,series:g,margin:s,xScale:m,yScale:u,width:f,height:i,startDate:h,endDate:c}=M();if(!("bandwidth"in m))throw new Error("Bars require a band scale (type=bar)");return J(vt,{left:s.left,top:s.top,children:[G(bt,{id:n,x:0,y:0,width:f,height:i}),G(wt,{children:g.filter(({isActive:e})=>e).map(e=>{let o=t==null?void 0:t.find(({id:a})=>a===e.id);return J(H.g,{initial:{opacity:0},animate:{opacity:1},exit:{opacity:0},transition:{duration:.1},clipPath:`url(#${n})`,children:[G(Tt,{className:T(e.colorClassName??"text-blue-500",o==null?void 0:o.gradientClassName),id:`${e.id}-background`,fromOffset:"0%",from:"currentColor",fromOpacity:.01,toOffset:"40%",to:"currentColor",toOpacity:1,x1:0,x2:0,y1:1}),G(H.g,{initial:{y:100},animate:{y:0},transition:{duration:.15,ease:"easeOut"},children:l.map(a=>{let r=m.bandwidth(),p=m(a.date)??0,x=u(e.valueAccessor(a)??0),d=i-x,A=Math.min(r,d)/2;return d>0?G(kt,{x:p,y:x,width:r,height:d,radius:1e3,top:!0,className:T(e.colorClassName??"text-blue-700",o==null?void 0:o.barClassName),fill:(o==null?void 0:o.barFill)??`url(#${e.id}-background)`},a.date.toString()):null})})]},`${e.id}_${h.toString()}_${c.toString()}`)})})]})}import{curveBasis as Dt}from"@visx/curve";import{ParentSize as At}from"@visx/responsive";import{scaleLinear as K}from"@visx/scale";import{Area as St}from"@visx/shape";import{Text as Pt}from"@visx/text";import{motion as Mt}from"framer-motion";import{Fragment as Lt,useMemo as R,useState as Ot}from"react";import{jsx as v,jsxs as O}from"react/jsx-runtime";var Ft=[{opacity:1,padding:0},{opacity:.3,padding:8},{opacity:.15,padding:16}],Z=16,tt=40;function _e(t){return v("div",{className:"size-full",children:v(At,{className:"relative",children:({width:n,height:l})=>n&&l?v($t,{...t,width:n,height:l}):null})})}function $t({width:t,height:n,steps:l,persistentPercentages:g=!0,defaultTooltipStepId:s}){let{isMobile:m}=X(),[u,f]=Ot(s??null),i=l.find(({id:r})=>r===u),h=R(()=>Object.fromEntries(l.map(({id:r,value:p},x)=>{var d;return[r,ot(p,((d=l[x+1])==null?void 0:d.value)??l[l.length-1].value)]})),[l]),c=R(()=>ot(0,0),[l]),e=R(()=>Math.max(...l.map(r=>r.value)),[l]),o=K({domain:[0,l.length],range:[0,t]}),a=K({domain:[e,-e],range:[n-Z-tt,Z+tt]});return O("div",{className:"relative",children:[v("svg",{width:t,height:n,children:l.map(({id:r,value:p,colorClassName:x},d)=>O(Lt,{children:[v("rect",{x:o(d),y:0,width:t/l.length,height:n,className:"fill-transparent transition-colors hover:fill-blue-600/5",onPointerEnter:()=>f(r),onPointerDown:()=>f(r),onPointerLeave:()=>!m&&f(s??null)}),v("line",{x1:o(d),y1:0,x2:o(d),y2:n,className:"stroke-black/5 sm:stroke-black/10"}),Ft.map(({opacity:A,padding:k})=>v(St,{data:h[r],curve:Dt,x:C=>o(d+C.x),y0:C=>a(-C.y)-k,y1:C=>a(C.y)+k,children:({path:C})=>v(Mt.path,{initial:{d:C(c)||"",opacity:0},animate:{d:C(h[r])||"",opacity:A},className:T(x,"pointer-events-none"),fill:"currentColor"})},`${r}-${A}-${k}`)),g&&v(Pt,{x:(o(d)+o(d+1))/2,y:n/2,textAnchor:"middle",verticalAnchor:"middle",fill:"white",fontSize:16,className:"pointer-events-none select-none",children:et(p/e*100)+"%"})]},r))}),i&&v("div",{className:T("pointer-events-none absolute flex items-center justify-center px-1 pb-4",g?"animate-slide-up-fade top-16 sm:top-12":"animate-fade-in top-1/2 -translate-y-1/2"),style:{left:o(l.findIndex(({id:r})=>r===i.id)),width:t/l.length},children:O("div",{className:T("rounded-lg border border-gray-200 bg-white text-base shadow-sm"),children:[v("p",{className:"border-b border-gray-200 px-3 py-2 text-sm text-gray-900 sm:px-4 sm:py-3",children:i.label}),O("div",{className:"flex flex-wrap justify-between gap-x-4 gap-y-2 px-3 py-2 text-sm sm:px-4 sm:py-3",children:[O("div",{className:"flex items-center gap-2",children:[v("div",{className:T(i.colorClassName,"h-2 w-2 shrink-0 rounded-sm bg-current opacity-50 shadow-[inset_0_0_0_1px_#0003]")}),v("p",{className:"whitespace-nowrap capitalize text-gray-600",children:et(i.value/e*100)+"%"})]}),O("p",{className:"whitespace-nowrap font-medium text-gray-900",children:[z(i.value,{full:!0}),i.additionalValue!==void 0&&O("span",{className:"text-gray-500",children:[" ","($",z(i.additionalValue/100),")"]})]})]})]})},i.id)]})}var et=t=>t>0&&t<.01?"< 0.01":z(t,{digits:2}),ot=(t,n)=>[{x:0,y:t},{x:.3,y:t},{x:.5,y:(t+n)/2},{x:.7,y:n},{x:1,y:n}];import{Group as Rt}from"@visx/group";import{ParentSize as Yt}from"@visx/responsive";import{scaleBand as Ut,scaleLinear as qt,scaleUtc as Xt}from"@visx/scale";import{Bar as at,Circle as Qt,Line as jt}from"@visx/shape";import{useMemo as Y,useState as Ht}from"react";import{localPoint as Gt}from"@visx/event";import{TooltipWithBounds as zt,useTooltipInPortal as Et,useTooltip as Wt}from"@visx/tooltip";import{bisector as Bt}from"d3-array";import{useCallback as Vt,useMemo as It}from"react";var _t=Bt(t=>new Date(t.date)).left;function rt({seriesId:t,chartContext:n,renderInPortal:l=!1,snapToY:g=!1,snapToX:s=!0,defaultIndex:m}){let{series:u,data:f,xScale:i,yScale:h,margin:c}=n,e=Et({scroll:!0,detectBounds:!0,debounce:200}),o=m!==void 0?f[m]:void 0,a=It(()=>o!==void 0?{tooltipData:o,tooltipLeft:s?i(o.date):0,tooltipTop:g?h(u.find(d=>d.id===t).valueAccessor(o)):0}:void 0,[o,s,g,i,h,u,t]),r=Wt(a??void 0),p=Vt(d=>{let k=(Gt(d)||{x:0}).x-c.left,C="invert"in i?i.invert(k):i.domain()[Math.round((k-i.step()*.75)/i.step())];if(C===void 0){console.log("x0 is undefined",{defaultTooltipData:a}),a?r.showTooltip(a):r.hideTooltip();return}let F=_t(f,C,1),y=f[F-1],P=f[F],L=y;P!=null&&P.date&&(L=C.valueOf()-y.date.valueOf()>P.date.valueOf()-C.valueOf()?P:y),r.showTooltip({tooltipData:L,tooltipLeft:s?i(L.date):k,tooltipTop:g?h(u.find(w=>w.id===t).valueAccessor(L)):0})},[t,f,i,h,u,a,r.showTooltip]),x=l?e.TooltipInPortal:zt;return{handleTooltip:p,TooltipWrapper:x,containerRef:e.containerRef,...r,hideTooltip:()=>a?r.showTooltip(a):r.hideTooltip()}}import{Fragment as nt,jsx as D,jsxs as W}from"react/jsx-runtime";function ao(t){return D(Yt,{className:"relative",children:({width:n,height:l})=>n>0&&l>0&&D(Jt,{...t,width:n,height:l})})}function Jt({type:t="area",width:n,height:l,children:g,data:s,series:m,tooltipContent:u=e=>m[0].valueAccessor(e).toString(),tooltipClassName:f="",defaultTooltipIndex:i=null,margin:h={top:12,right:4,bottom:32,left:4},padding:c}){let[e,o]=Ht(),a={...h,left:h.left+(e??0)},r=c??{top:.1,bottom:t==="area"?.1:0},p=n-a.left-a.right,x=l-a.top-a.bottom,{startDate:d,endDate:A}=Y(()=>{let b=s.map(({date:$})=>$),N=b.map($=>$.getTime());return{startDate:b[N.indexOf(Math.min(...N))],endDate:b[N.indexOf(Math.max(...N))]}},[s]),{minY:k,maxY:C}=Y(()=>{let b=m.filter(({isActive:N})=>N!==!1).map(({valueAccessor:N})=>s.map($=>N($))).flat().filter(N=>N!=null);return{minY:t==="area"?Math.min(...b):Math.min(0,...b),maxY:Math.max(...b)}},[s,m]),{yScale:F,xScale:y}=Y(()=>{let b=C-k;return{yScale:qt({domain:[k-b*(r.bottom??0),C+b*(r.top??0)],range:[x,0],nice:!0,clamp:!0}),xScale:t==="area"?Xt({domain:[d,A],range:[0,p]}):Ut({domain:s.map(({date:N})=>N),range:[0,p],padding:Math.min(.75,p/s.length*.02),align:.5})}},[d,A,k,C,x,p,s.length,t]),P={type:t,width:p,height:x,data:s,series:m,startDate:d,endDate:A,xScale:y,yScale:F,minY:k,maxY:C,margin:a,padding:r,tooltipContent:u,tooltipClassName:f,defaultTooltipIndex:i,leftAxisMargin:e,setLeftAxisMargin:o},L=rt({seriesId:m[0].id,chartContext:P,defaultIndex:i??void 0}),{tooltipData:w,TooltipWrapper:lt,tooltipLeft:st,tooltipTop:mt,handleTooltip:B,hideTooltip:ct,containerRef:pt}=L;return D(V.Provider,{value:P,children:W(I.Provider,{value:L,children:[W("svg",{width:n,height:l,ref:pt,children:[g,W(Rt,{left:a.left,top:a.top,children:[w&&("bandwidth"in y?D(nt,{children:D(at,{x:(y(w.date)??0)-y.bandwidth()*y.padding(),width:y.bandwidth()*(1+y.padding()*2),y:0,height:x,fill:"black",fillOpacity:.05})}):W(nt,{children:[D(jt,{x1:y(w.date),x2:y(w.date),y1:x,y2:0,stroke:"black",strokeWidth:1.5}),m.filter(({isActive:b})=>b).map(b=>D(Qt,{cx:y(w.date),cy:F(b.valueAccessor(w)),r:4,className:b.colorClassName??"text-blue-800",fill:"currentColor"},b.id))]})),D(at,{x:0,y:0,width:p,height:x,onTouchStart:B,onTouchMove:B,onMouseMove:B,onMouseLeave:ct,fill:"transparent"})]})]}),D("div",{className:"pointer-events-none absolute inset-0",children:w&&D(lt,{left:(st??0)+a.left,top:(mt??0)+a.top,offsetLeft:"bandwidth"in y?y.bandwidth()+8:8,offsetTop:12,className:"absolute",unstyled:!0,children:D("div",{className:T("pointer-events-none rounded-lg border border-gray-200 bg-white px-4 py-2 text-base shadow-sm",f),children:(u==null?void 0:u(w))??m[0].valueAccessor(w)})},w.date.toString())})]})})}import{AxisBottom as Kt}from"@visx/axis";import{Group as Zt}from"@visx/group";import{Line as te}from"@visx/shape";import{useMemo as ee}from"react";var it=t=>[...Array(t+1).keys()].filter(n=>t%n===0);import{Fragment as oe,jsx as U,jsxs as re}from"react/jsx-runtime";function fo({maxTicks:t,showGridLines:n=!1,highlightLast:l=!0,tickFormat:g=s=>s.toLocaleDateString("en-US",{month:"short",day:"numeric"})}){let{data:s,margin:m,width:u,height:f,xScale:i,startDate:h,endDate:c}=M(),{tooltipData:e}=E(),o=ee(()=>{let a=t??u<450?4:u<600?6:8,r=it(s.length).find(x=>(s.length+1)/x<=a)??1,p=s.length/r<2;return s.filter((x,d,{length:A})=>p?d===0||d===A-1:(d+1)%r===0).map(({date:x})=>x)},[u,t,s]);return re(oe,{children:[U(Kt,{left:m.left,top:m.top+f,scale:i,tickValues:o,hideTicks:!0,stroke:"#00000026",tickFormat:a=>g(a),tickLabelProps:(a,r,{length:p})=>({className:"transition-colors",textAnchor:r===0?"start":r===p-1?"end":"middle",fontSize:12,fill:(e?e.date===a:l&&r===p-1)?"#000":"#00000066"})}),n&&U(Zt,{left:m.left,top:m.top,children:o.length>0&&o.map(a=>U(te,{x1:i(a),x2:i(a),y1:f,y2:0,stroke:a===(e==null?void 0:e.date)?"transparent":"#00000026",strokeWidth:1,strokeDasharray:[h,c].includes(a)?0:5},a.toString()))})]})}import{AxisLeft as ae}from"@visx/axis";import{Group as ne}from"@visx/group";import{Line as ie}from"@visx/shape";import{getStringWidth as le}from"@visx/text";import{useLayoutEffect as se,useMemo as me}from"react";import{Fragment as ce,jsx as q,jsxs as pe}from"react/jsx-runtime";function vo({numTicks:t,showGridLines:n=!1,integerTicks:l=!1,tickValues:g,tickFormat:s=u=>u.toString(),tickAxisSpacing:m=8}){let{width:u,height:f,margin:i,yScale:h,minY:c,leftAxisMargin:e,setLeftAxisMargin:o}=M(),a=me(()=>{if(g)return g;let r=t??f<350?3:4;return h.ticks(r).filter(p=>p>=c&&l?Number.isInteger(p):!0)},[g,t,f,h,l]);return se(()=>{let r=Math.max(...a.map(p=>le(s(p),{fontSize:12})??0))+m;(e??0)<r&&o(r)},[a,m,e]),pe(ce,{children:[q(ae,{left:i.left,top:i.top,scale:h,tickValues:a,hideTicks:!0,stroke:"transparent",tickFormat:r=>s(r),tickLength:m,tickLabelProps:()=>({fontSize:12,fill:"#00000066",textAnchor:"end",verticalAnchor:"middle"})}),n&&q(ne,{left:i.left,top:i.top,children:a.length>0&&a.map(r=>{let p=h(r);if(p!==f)return q(ie,{y1:p,y2:p,x1:0,x2:u,stroke:"#00000026",strokeWidth:1,strokeDasharray:5},r.toString())})})]})}export{Te as Areas,Le as Bars,V as ChartContext,I as ChartTooltipContext,_e as FunnelChart,ao as TimeSeriesChart,fo as XAxis,vo as YAxis,M as useChartContext,E as useChartTooltipContext};