https://ssicevs.com/assets/TotalBalanceCard-BlL8MxNA.js

1import{r as t,j as a}from"./metal-fx-C6GZ_SKA.js";import{c as P}from"./Crosshair.es-JqAAcZs5.js";import{e$ as U,fm as z,eT as S}from"./index-D1yBc__G.js";import{j as B,e as H,S as W,T as h,d as $,a as F,h as V,H as G,g as X,E as R}from"./shared-OtDZU4QY.js";import{u as _}from"./useChartPointer-Dc8ejnc2.js";import"./motion-BHwmuFpx.js";const q=new Map([["bold",t.createElement(t.Fragment,null,t.createElement("path",{d:"M68,102.06V40a12,12,0,0,0-24,0v62.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V169.94a36,36,0,0,0,0-67.88ZM56,148a12,12,0,1,1,12-12A12,12,0,0,1,56,148ZM164,88a36.07,36.07,0,0,0-24-33.94V40a12,12,0,0,0-24,0V54.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V121.94A36.07,36.07,0,0,0,164,88Zm-36,12a12,12,0,1,1,12-12A12,12,0,0,1,128,100Zm108,68a36.07,36.07,0,0,0-24-33.94V40a12,12,0,0,0-24,0v94.06a36,36,0,0,0,0,67.88V216a12,12,0,0,0,24,0V201.94A36.07,36.07,0,0,0,236,168Zm-36,12a12,12,0,1,1,12-12A12,12,0,0,1,200,180Z"}))],["duotone",t.createElement(t.Fragment,null,t.createElement("path",{d:"M80,136a24,24,0,1,1-24-24A24,24,0,0,1,80,136Zm48-72a24,24,0,1,0,24,24A24,24,0,0,0,128,64Zm72,80a24,24,0,1,0,24,24A24,24,0,0,0,200,144Z",opacity:"0.2"}),t.createElement("path",{d:"M64,105V40a8,8,0,0,0-16,0v65a32,32,0,0,0,0,62v49a8,8,0,0,0,16,0V167a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,56,

1152Zm80-95V40a8,8,0,0,0-16,0V57a32,32,0,0,0,0,62v97a8,8,0,0,0,16,0V119a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,128,104Zm104,64a32.06,32.06,0,0,0-24-31V40a8,8,0,0,0-16,0v97a32,32,0,0,0,0,62v17a8,8,0,0,0,16,0V199A32.06,32.06,0,0,0,232,168Zm-32,16a16,16,0,1,1,16-16A16,16,0,0,1,200,184Z"}))],["fill",t.createElement(t.Fragment,null,t.createElement("path",{d:"M84,136a28,28,0,0,1-20,26.83V216a8,8,0,0,1-16,0V162.83a28,28,0,0,1,0-53.66V40a8,8,0,0,1,16,0v69.17A28,28,0,0,1,84,136Zm52-74.83V40a8,8,0,0,0-16,0V61.17a28,28,0,0,0,0,53.66V216a8,8,0,0,0,16,0V114.83a28,28,0,0,0,0-53.66Zm72,80V40a8,8,0,0,0-16,0V141.17a28,28,0,0,0,0,53.66V216a8,8,0,0,0,16,0V194.83a28,28,0,0,0,0-53.66Z"}))],["light",t.createElement(t.Fragment,null,t.createElement("path",{d:"M62,106.6V40a6,6,0,0,0-12,0v66.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V165.4a30,30,0,0,0,0-58.8ZM56,154a18,18,0,1,1,18-18A18,18,0,0,1,56,154Zm78-95.4V40a6,6,0,0,0-12,0V58.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V117.4a30,30,0,0,0,0-58.8ZM128,106a18,18,0,1,1,18-18A18,18,0,0,1,128,106Zm102,62a30.05,30.05,0,0,0-24-29.4V40a6,6,0,0,0-12,0v98.6a30,30,0,0,0,0,58.8V216a6,6,0,0,0,12,0V197.4A30.05,30.05,0,0,0,230,168Zm-30,18a18,18,0,1,1,18-18A18,18,0,0,1,200,186Z"}))],["regular",t.createElement(t.Fragment,null,t.createElement("path",{d:"M64,105V40a8,8,0,0,0-16,0v65a32,32,0,0,0,0,62v49a8,8,0,0,0,16,0V167a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,56,

1152Zm80-95V40a8,8,0,0,0-16,0V57a32,32,0,0,0,0,62v97a8,8,0,0,0,16,0V119a32,32,0,0,0,0-62Zm-8,47a16,16,0,1,1,16-16A16,16,0,0,1,128,104Zm104,64a32.06,32.06,0,0,0-24-31V40a8,8,0,0,0-16,0v97a32,32,0,0,0,0,62v17a8,8,0,0,0,16,0V199A32.06,32.06,0,0,0,232,168Zm-32,16a16,16,0,1,1,16-16A16,16,0,0,1,200,184Z"}))],["thin",t.createElement(t.Fragment,null,t.createElement("path",{d:"M60,108.29V40a4,4,0,0,0-8,0v68.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V163.71a28,28,0,0,0,0-55.42ZM56,156a20,20,0,1,1,20-20A20,20,0,0,1,56,156Zm76-95.71V40a4,4,0,0,0-8,0V60.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V115.71a28,28,0,0,0,0-55.42ZM128,108a20,20,0,1,1,20-20A20,20,0,0,1,128,108Zm100,60a28,28,0,0,0-24-27.71V40a4,4,0,0,0-8,0V140.29a28,28,0,0,0,0,55.42V216a4,4,0,0,0,8,0V195.71A28,28,0,0,0,228,168Zm-28,20a20,20,0,1,1,20-20A20,20,0,0,1,200,188Z"}))]]),T=t.forwardRef((m,o)=>t.createElement(U,{ref:o,...m,weights:q}));T.displayName="SlidersIcon";const O=T,J=["24h","1w","1m","all"],g=150,w=720,N=180,r={t:10,b:10,l:4,r:64},Z=w-r.l-r.r,K=12480;function M(m,o){let j=m,s=K;const A=[];for(let p=0;p<g;p++)j=j*48271%2147483647,s*=1+(j/2147483647-.5)*.0065+o,A.push(s);return A}const Q={"24h":M(9,-12e-5),"1w":M(37,-28e-5),"1m":M(71,19e-5),all:M(113,42e-5)},L=m=>{const o=Math.round(m/(g-1)*1439);return`${String(Math.floor(o/60)).padStart(2,"0")}:${String(o%60).padStart(2,"0")}`};function Y(){const m=z()||B(),[o,j]=t.useState("24h"),s=Q[o],{ref:A,i:p,onMove:D,onLeave:k}=_({n:g,W:w,padL:r.l,plotW:Z}),i=t.useMemo(()=>{const e=Math.min(...s),n=Math.max(...s),f=n-e||1,d=c=>r.l+c/(g-1)*Z,v=c=>r.t+(1-(c-e)/f)*(N-r.t-r.b);return{x:d,y:v,lo:e,hi:n,span:f,d:`M${s.map((c,E)=>`${d(E).toFixed(1)},${v(c).toFixed(1)}`).join(" L")}`}},[s]),l=t.useMemo(()=>{const e=s[0],n=s[s.length-1],f=(n-e)/e*100;let d=s[0],v=0;for(const x of s)x>d&&(d=x),v=Math.min(v,(x-d)/d*100);const c=s.slice(1).map((x,y)=>x-s[y]),E=c.reduce((x,y)=>x+y,0)/c.length,C=Math.sqrt(c.reduce((x,y)=>x+(y-E)**2,0)/c.length)||1e-9,I=Math.max(0,Math.min(100,50+E/C*40));return{first:e,last:n,totalReturn:f,maxDd:v,score:I,delta:n-e}},[s]),u=p??g-1,b=(e,n=2)=>`$${e.toLocaleString("en-US",{minimumFractionDigits:n,maximumFractionDigits:n})}`;return a.jsxs("div",{className:"w-full max-w-[820px] overflow-hidden rounded-2xl p-7",style:{color:h,fontFamily:W,backgroundColor:H,backgroundImage:["repeating-linear-gradient(135deg, color-mix(in srgb, var(--foreground) 4%, transparent) 0 1px, transparent 1px 8px)","radial-gradient(120% 120% at 8% -10%, color-mix(in srgb, var(--chart-amber) 30%, transparent) 0%, color-mix(in srgb, var(--chart-amber) 9%, transparent) 45%, transparent 78%)"].join(",")},children:[a.jsxs("div",{className:"flex items-start justify-between gap-6",children:[a.jsxs("div",{className:"min-w-0",children:[a.jsx("span",{className:"text-[10px] uppercase tracking-[0.14em]",style:{color:"color-mix(in srgb, var(--foreground) 38%, transparent)"},children:"Total balance"}),a.jsxs("div",{className:"mt-1.5 flex items-baseline gap-x-4",children:[a.jsx("span",{className:"text-[clamp(30px,4.6vw,50px)] font-semibold leading-none tracking-[-0.02em] tabular-nums",children:b(l.last)}),a.jsxs("span",{className:"shrink-0 whitespace-nowrap text-[15px] font-medium tabular-nums",style:{color:l.delta>=0?$:F},children:[l.delta<0?"−":"+",b(Math.abs(l.delta))]}),a.jsxs("span",{className:"text-[15px] font-medium tabular-nums",style:{color:l.totalReturn>=0?$:F},children:[l.totalReturn<0?"−":"+",Math.abs(l.totalReturn).toFixed(2),"%"]})]})]}),a.jsxs("div",{className:"flex shrink-0 items-center gap-4",style:{color:V},children:[a.jsx("button",{type:"button","aria-label":"Adjust",className:"transition-opacity hover:opacity-70",children:a.jsx(O,{size:20})}),a.jsx("button",{type:"button","aria-label":"Focus",className:"transition-opacity hover:opacity-70",children:a.jsx(P,{size:20})})]})]}),a.jsxs("div",{className:"relative mt-7 h-[46px] w-full",children:[a.jsxs("div",{className:"absolute top-0 whitespace-nowrap rounded-lg border px-2.5 py-1.5 transition-opacity duration-150",style:{left:`clamp(0px, calc(${(i.x(u)/w*100).toFixed(2)}% - 44px), calc(100% - 128px))`,opacity:p==null?0:1,background:X,borderColor:G},children:[a.jsx("span",{className:"block text-[13px] font-semibold leading-tight tabular-nums",style:{color:h},children:b(s[u])}),a.jsx("span",{className:"mt-0.5 block text-[10px] leading-tight tabular-nums",style:{color:V},children:L(u)})]}),p==null&&a.jsxs("div",{className:"absolute top-0 right-0 text-right",children:[a.jsx("span",{className:"block text-[13px] font-semibold leading-tight tabular-nums",style:{color:h},children:b(s[g-1])}),a.jsxs("span",{className:"mt-0.5 block text-[10px] leading-tight tabular-nums",style:{color:V},children:["now · ",L(g-1)]})]})]}),a.jsxs("svg",{ref:A,viewBox:`0 0 ${w} ${N}`,role:"img","aria-label":`Total balance over ${o}, ${b(i.lo)} to ${b(i.hi)}`,className:"mt-1 block w-full cursor-crosshair touch-none",onPointerMove:D,onPointerLeave:k,children:[[0,.5,1].map(e=>{const n=r.t+e*(N-r.t-r.b);return a.jsxs("g",{children:[a.jsx("line",{x1:r.l,x2:r.l+Z,y1:n,y2:n,stroke:"color-mix(in srgb, var(--foreground) 9%, transparent)",vectorEffect:"non-scaling-stroke"}),a.jsxs("text",{x:r.l+Z+12,y:n+4,fontSize:11,fill:V,className:"tabular-nums",children:["$",Math.round(i.hi-e*i.span).toLocaleStr

1ing("en-US")]})]},e)}),a.jsx(S.path,{d:i.d,fill:"none",stroke:h,strokeWidth:1.5,strokeLinejoin:"round",strokeLinecap:"round",initial:{pathLength:m?1:0},animate:{pathLength:1},transition:m?{duration:0}:{duration:.9,ease:R}},o),p!=null&&a.jsxs("g",{pointerEvents:"none",children:[a.jsx("line",{x1:i.x(u),x2:i.x(u),y1:0,y2:N,stroke:"color-mix(in srgb, var(--foreground) 30%, transparent)",vectorEffect:"non-scaling-stroke"}),a.jsx("circle",{cx:i.x(u),cy:i.y(s[u]),r:3,fill:h})]})]}),a.jsx("div",{className:"mt-5 flex items-center gap-6 text-[14px]",children:J.map(e=>a.jsxs("button",{type:"button",onClick:()=>{j(e),k()},className:"relative pb-1 transition-colors",style:{color:o===e?h:V},children:[e,o===e&&a.jsx(S.span,{layoutId:"tbc-range",className:"absolute inset-x-0 -bottom-px h-px",style:{background:h},transition:m?{duration:0}:{duration:.3,ease:R}})]},e))}),a.jsx("div",{className:"mt-7 grid grid-cols-3",children:[["max drawdown",`${l.maxDd<0?"−":""}${Math.abs(l.maxDd).toFixed(2)}%`,"worst peak-to-trough in the window"],["score",l.score.toFixed(1),"mean step ÷ its deviation, re-based to 50"],["total return",`${l.totalReturn<0?"−":"+"}${Math.abs(l.totalReturn).toFixed(2)}%`,"(last − first) ÷ first"]].map(([e,n,f],d)=>a.jsxs("div",{className:"flex flex-col items-center gap-1 px-3 text-center",style:{borderLeft:d===0?void 0:"1px solid color-mix(in srgb, var(--foreground) 8%, transparent)"},children:[a.jsx("span",{className:"text-[13px] lowercase",style:{color:V},children:e}),a.jsx("span",{className:"text-[19px] font-semibold tabular-nums",children:n}),a.jsx("span",{className:"text-[9.5px] leading-tight text-foreground/30",children:f})]},e))})]})}function o0(){return a.jsx("div",{className:"flex min-h-[460px] w-full items-center justify-center p-6",children:a.jsx(Y,{})})}

1export{o0 as Demo,Y as default};