@dub/ui 0.2.21 → 0.2.23

package/dist/charts/index.d.ts

@@ -6,7 +6,7 @@ import { TooltipWithBounds } from '@visx/tooltip';
 import { UseTooltipParams } from '@visx/tooltip/lib/hooks/useTooltip';
 import { TooltipInPortalProps } from '@visx/tooltip/lib/hooks/useTooltipInPortal';
 
-declare function Areas({ seriesStyles, }: {
+declare function Areas({ seriesStyles, showLatestValueCircle, }: {
     seriesStyles?: {
         id: string;
         gradientClassName?: string;
@@ -14,6 +14,7 @@ declare function Areas({ seriesStyles, }: {
         areaFill?: string;
         lineStroke?: string;
     }[];
+    showLatestValueCircle?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
 declare function Bars({ seriesStyles, }: {
@@ -105,6 +106,13 @@ declare function FunnelChart(props: FunnelChartProps): react_jsx_runtime.JSX.Ele
 type TimeSeriesChartProps<T extends Datum> = PropsWithChildren<ChartProps<T>>;
 declare function TimeSeriesChart<T extends Datum>(props: TimeSeriesChartProps<T>): react_jsx_runtime.JSX.Element;
 
+type ChartTooltipSyncContextType = {
+    tooltipDate?: Date | null;
+    setTooltipDate?: Dispatch<SetStateAction<Date | null | undefined>>;
+};
+declare const ChartTooltipSyncContext: react.Context<ChartTooltipSyncContextType>;
+declare function ChartTooltipSync({ children }: PropsWithChildren): react_jsx_runtime.JSX.Element;
+
 type XAxisProps = {
     /**
      * Maximum number of ticks to generate
@@ -114,6 +122,10 @@ type XAxisProps = {
      * Whether to render dashed grid lines across the chart area
      */
     showGridLines?: boolean;
+    /**
+     * Whether to render a line for the axis
+     */
+    showAxisLine?: boolean;
     /**
      * Whether to highlight the latest tick label when no other area is hovered
      */
@@ -123,7 +135,7 @@ type XAxisProps = {
      */
     tickFormat?: (date: Date) => string;
 };
-declare function XAxis({ maxTicks: maxTicksProp, showGridLines, highlightLast, tickFormat, }: XAxisProps): react_jsx_runtime.JSX.Element;
+declare function XAxis({ maxTicks: maxTicksProp, showGridLines, highlightLast, showAxisLine, tickFormat, }: XAxisProps): react_jsx_runtime.JSX.Element;
 
 type YAxisProps = {
     /**
@@ -153,4 +165,4 @@ type YAxisProps = {
 };
 declare function YAxis({ numTicks: numTicksProp, showGridLines, integerTicks, tickValues: tickValuesProp, tickFormat, tickAxisSpacing, }: YAxisProps): react_jsx_runtime.JSX.Element;
 
-export { Areas, Bars, ChartContext, ChartTooltipContext, FunnelChart, TimeSeriesChart, XAxis, XAxisProps, YAxis, YAxisProps, useChartContext, useChartTooltipContext };
+export { Areas, Bars, ChartContext, ChartTooltipContext, ChartTooltipSync, ChartTooltipSyncContext, FunnelChart, TimeSeriesChart, XAxis, XAxisProps, YAxis, YAxisProps, useChartContext, useChartTooltipContext };

package/dist/charts/index.mjs

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

package/dist/chunk-24SPS4WN.mjs

@@ -0,0 +1,2 @@
+"use client"
+var e=[{name:"Spotify Link Shortener",slug:"spotify-link-shortener"},{name:"ChatGPT Link Shortener",slug:"chatgpt-link-shortener"},{name:"GitHub Link Shortener",slug:"github-link-shortener"},{name:"Calendar Link Shortener",slug:"cal-link-shortener"},{name:"Google Link Shortener",slug:"google-link-shortener"},{name:"Amazon Link Shortener",slug:"amazon-link-shortener"},{name:"Figma Link Shortener",slug:"figma-link-shortener"},{name:"Metatags API",slug:"metatags"},{name:"Link Inspector",slug:"inspector"},{name:"QR Code API",slug:"qr-code"},{name:"UTM Builder",slug:"utm-builder"}];var o="https://www.google.com/s2/favicons?sz=64&domain_url=";var t=100,i=60*60*24*14,_=new Date("2022-09-22T00:00:00.000Z");var m=process.env.NEXT_PUBLIC_APP_NAME||"Dub.co",r=process.env.NEXT_PUBLIC_APP_SHORT_DOMAIN||"dub.sh",n=`https://${process.env.NEXT_PUBLIC_APP_DOMAIN}`,p=new Set([`app.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,`preview.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,"localhost:8888","localhost"]),E=process.env.NEXT_PUBLIC_VERCEL_ENV==="production"?`https://app.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"?`https://preview.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:"http://localhost:8888",I=process.env.NEXT_PUBLIC_VERCEL_ENV==="production"?`https://app.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"?`https://preview.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:process.env.NEXT_PUBLIC_NGROK_URL||"http://localhost:8888",N=new Set([`api.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,`api-staging.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,`api.${r}`,"api.localhost:8888"]),A=process.env.NEXT_PUBLIC_VERCEL_ENV==="production"?`https://api.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"?`https://api-staging.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:"http://api.localhost:8888",l=new Set([`admin.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,"admin.localhost:8888"]),P=process.env.NEXT_PUBLIC_VERCEL_ENV==="production"?`https://partners.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:process.env.NEXT_PUBLIC_VERCEL_ENV==="preview"?`https://partners-staging.${process.env.NEXT_PUBLIC_APP_DOMAIN}`:"http://partners.localhost:8888",c=new Set([`partners.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,`partners-staging.${process.env.NEXT_PUBLIC_APP_DOMAIN}`,"partners.localhost:8888"]);var T=process.env.STORAGE_BASE_URL;export{e as a,o as b,t as c,E as d,a as e,s as f,O as g,S as h,L as i,D as j,g as k,f as l,R as m,C as n,U as o};