@liberfi.io/ui-perpetuals 0.1.119 → 0.1.121
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +8 -8
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +8 -8
- package/dist/index.mjs.map +1 -1
- package/package.json +7 -7
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
'use strict';var react=require('react'),jsxRuntime=require('react/jsx-runtime'),reactQuery=require('@tanstack/react-query'),ui=require('@liberfi.io/ui'),reactHookForm=require('react-hook-form');typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-perpetuals"]="0.1.119");var Jt="0.1.119";var ae=class{ws=null;wsEndpoint;subscriptions=new Map;reconnectAttempts=0;maxReconnectAttempts=10;reconnectDelay=1e3;heartbeatInterval=null;messageQueue=[];isConnected=false;pingInterval=3e4;reconnectTimeout=null;isReconnecting=false;constructor(e){this.wsEndpoint=e;}async connect(){return new Promise((e,r)=>{try{this.ws&&this.ws.close(),this.ws=new WebSocket(this.wsEndpoint),this.ws.onopen=()=>{console.log("[WebSocket] Connected to Hyperliquid"),this.isConnected=!0,this.reconnectAttempts=0,this.isReconnecting=!1,this.startHeartbeat(),this.flushMessageQueue(),e();},this.ws.onmessage=s=>{this.handleMessage(s.data);},this.ws.onerror=s=>{console.error("[WebSocket] Error:",s),this.isConnected=!1,this.isReconnecting||r(new Error("WebSocket connection failed"));},this.ws.onclose=s=>{console.log(`[WebSocket] Closed: ${s.code} - ${s.reason||"No reason provided"}`),this.isConnected=!1,this.stopHeartbeat(),s.code!==1e3&&this.attemptReconnect();};}catch(s){r(s);}})}disconnect(){this.stopHeartbeat(),this.subscriptions.clear(),this.reconnectTimeout!==null&&(clearTimeout(this.reconnectTimeout),this.reconnectTimeout=null),this.ws&&(this.ws.close(1e3,"Normal closure"),this.ws=null),this.isConnected=false,this.isReconnecting=false,this.reconnectAttempts=0;}attemptReconnect(){if(this.isReconnecting)return;if(this.reconnectAttempts>=this.maxReconnectAttempts){console.error("[WebSocket] Max reconnection attempts reached");return}this.isReconnecting=true,this.reconnectAttempts++;let e=Math.min(this.reconnectDelay*Math.pow(2,this.reconnectAttempts-1),3e4);console.log(`[WebSocket] Reconnecting in ${e}ms (attempt ${this.reconnectAttempts}/${this.maxReconnectAttempts})`),this.reconnectTimeout=window.setTimeout(()=>{this.connect().then(()=>{this.resubscribeAll();}).catch(r=>{console.error("[WebSocket] Reconnection failed:",r),this.isReconnecting=false;});},e);}startHeartbeat(){this.heartbeatInterval=window.setInterval(()=>{this.isConnected&&this.ws&&this.ws.readyState===WebSocket.OPEN&&this.send({method:"ping"});},this.pingInterval);}stopHeartbeat(){this.heartbeatInterval!==null&&(clearInterval(this.heartbeatInterval),this.heartbeatInterval=null);}send(e){this.isConnected&&this.ws&&this.ws.readyState===WebSocket.OPEN?this.ws.send(JSON.stringify(e)):this.messageQueue.push(e);}flushMessageQueue(){for(;this.messageQueue.length>0;){let e=this.messageQueue.shift();e&&this.send(e);}}resubscribeAll(){this.subscriptions.forEach(e=>{this.sendSubscription(e.type,e.param);});}handleMessage(e){try{let r=JSON.parse(e);r.channel?this.handleChannelMessage(r):r.method;}catch(r){console.error("[WebSocket] Failed to parse message:",r,e);}}handleChannelMessage(e){let r=e.channel;this.subscriptions.forEach((s,n)=>{if(this.isChannelMatch(r,s.type,s.param))try{let o=this.transformData(s.type,e.data,s.param);s.callback(o);}catch(o){console.error(`[WebSocket] Error in subscription callback (${n}):`,o);}});}isChannelMatch(e,r,s){return r==="ticker"?e==="allMids":r==="trades"?e==="trades":r==="orderBook"?e==="l2Book":r==="candle"?e==="candle":r==="userFills"?e==="userFills":r==="userEvents"?e==="userEvents":false}transformData(e,r,s){return e==="ticker"?this.transformTickerData(r):e==="trades"?this.transformTradesData(r,s):e==="orderBook"?this.transformOrderBookData(r,s):e==="candle"?this.transformCandleData(r,s):e==="userFills"?this.transformUserFillsData(r):e==="userEvents"?this.transformUserEventsData(r):r}transformTickerData(e){let r=e.mids||{};return Object.entries(r).map(([s,n])=>({symbol:`${s}-USDC`,price:parseFloat(n),timestamp:Date.now()}))}transformTradesData(e,r){return Array.isArray(e)?e.map(s=>({symbol:r,side:s.side==="B"?"buy":"sell",price:parseFloat(s.px),quantity:parseFloat(s.sz),timestamp:s.time,tradeId:s.tid})):[]}transformOrderBookData(e,r){let[s,n]=e.levels||[[],[]];return {symbol:r,bids:s.map(o=>({price:parseFloat(o.px),quantity:parseFloat(o.sz),count:o.n})),asks:n.map(o=>({price:parseFloat(o.px),quantity:parseFloat(o.sz),count:o.n})),timestamp:e.time||Date.now()}}transformCandleData(e,r){let[s]=r.split(":");return {symbol:s,open:parseFloat(e.o),high:parseFloat(e.h),low:parseFloat(e.l),close:parseFloat(e.c),volume:parseFloat(e.v),timestamp:e.t,closeTimestamp:e.T}}transformUserFillsData(e){return Array.isArray(e)?e.map(r=>({tradeId:r.tid?.toString(),orderId:r.oid?.toString(),symbol:`${r.coin}-USDC`,side:r.dir?.includes("Long")?"long":"short",price:parseFloat(r.px),quantity:parseFloat(r.sz),fee:parseFloat(r.fee||"0"),feeCurrency:r.feeToken||"USDC",isMaker:r.side==="M",timestamp:r.time})):[]}transformUserEventsData(e){return e}sendSubscription(e,r){let s;if(e==="ticker")s={method:"subscribe",subscription:{type:"allMids"}};else if(e==="trades")s={method:"subscribe",subscription:{type:"trades",coin:r.split("-")[0]}};else if(e==="orderBook")s={method:"subscribe",subscription:{type:"l2Book",coin:r.split("-")[0]}};else if(e==="candle"){let[n,o]=r.split(":");s={method:"subscribe",subscription:{type:"candle",coin:n.split("-")[0],interval:o}};}else e==="userFills"?s={method:"subscribe",subscription:{type:"userFills",user:r}}:e==="userEvents"&&(s={method:"subscribe",subscription:{type:"userEvents",user:r}});s&&this.send(s);}sendUnsubscription(e,r){let s;if(e==="ticker")s={method:"unsubscribe",subscription:{type:"allMids"}};else if(e==="trades")s={method:"unsubscribe",subscription:{type:"trades",coin:r.split("-")[0]}};else if(e==="orderBook")s={method:"unsubscribe",subscription:{type:"l2Book",coin:r.split("-")[0]}};else if(e==="candle"){let[n,o]=r.split(":");s={method:"unsubscribe",subscription:{type:"candle",coin:n.split("-")[0],interval:o}};}else e==="userFills"?s={method:"unsubscribe",subscription:{type:"userFills",user:r}}:e==="userEvents"&&(s={method:"unsubscribe",subscription:{type:"userEvents",user:r}});s&&this.send(s);}subscribe(e,r,s){let n=`${e}:${r}`;return this.subscriptions.set(n,{type:e,param:r,callback:s}),this.sendSubscription(e,r),n}unsubscribe(e){let r=this.subscriptions.get(e);r&&(this.sendUnsubscription(r.type,r.param),this.subscriptions.delete(e));}isConnectedNow(){return this.isConnected}};var ot={testnet:{api:"https://api.hyperliquid-testnet.xyz",ws:"wss://api.hyperliquid-testnet.xyz/ws"},mainnet:{api:"https://api.hyperliquid.xyz",ws:"wss://api.hyperliquid.xyz/ws"}},ge=class{apiEndpoint;_wsEndpoint;timeout;environment;wsManager=null;constructor(e={}){this.environment=e.environment||"testnet",this.apiEndpoint=e.apiEndpoint||ot[this.environment].api,this._wsEndpoint=e.wsEndpoint||ot[this.environment].ws,this.timeout=e.timeout||3e4;}async request(e,r){let s=`${this.apiEndpoint}${e}`;try{let n=new AbortController,o=setTimeout(()=>n.abort(),this.timeout),i=await fetch(s,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(r),signal:n.signal});if(clearTimeout(o),!i.ok)throw new V(`HTTP ${i.status}: ${i.statusText}`,i.status,await i.text());return await i.json()}catch(n){throw n.name==="AbortError"?new V(`Request timeout after ${this.timeout}ms`,408,""):n instanceof V?n:new V(`Network error: ${n.message}`,0,"")}}symbolToCoin(e){return e.split("-")[0]}parseInterval(e){return {"1m":6e4,"5m":3e5,"15m":9e5,"30m":18e5,"1h":36e5,"4h":144e5,"1d":864e5,"1w":6048e5}[e]}async getSupportedCoins(){let[e]=await this.request("/info",{type:"metaAndAssetCtxs"});return e.universe.map(r=>`${r.name}-USDC`)}async getMarket(e){let r=await this.getMarkets([e]);return r.length>0?r[0]:null}async getMarkets(e){let[r,s]=await this.request("/info",{type:"metaAndAssetCtxs"}),n=r.universe.map((o,i)=>{let a=s[i],l=`${o.name}-USDC`,c=parseFloat(a.midPx||a.markPx||"0"),d=a.prevDayPx?parseFloat(a.prevDayPx):c,u=d>0?(c-d)/d*100:0;return {symbol:l,price:c,change24h:u,volume24h:parseFloat(a.dayNtlVlm||"0"),fundingRate:parseFloat(a.funding||"0"),openInterest:parseFloat(a.openInterest||"0"),markPrice:parseFloat(a.markPx||"0"),indexPrice:parseFloat(a.oraclePx||a.midPx||"0")}});if(e&&e.length>0){let o=new Set(e);return n.filter(i=>o.has(i.symbol))}return n}async getKlines(e,r,s=100){let n=this.symbolToCoin(e),o=this.parseInterval(r),i=Date.now(),a=i-o*s;return (await this.request("/info",{type:"candleSnapshot",req:{coin:n,interval:r,startTime:a,endTime:i}})).map(c=>({symbol:e,open:parseFloat(c.o),high:parseFloat(c.h),low:parseFloat(c.l),close:parseFloat(c.c),volume:parseFloat(c.v),timestamp:c.t,closeTimestamp:c.T}))}async getOrderBook(e,r=10){let s=this.symbolToCoin(e),n=await this.request("/info",{type:"l2Book",coin:s}),[o,i]=n.levels;return {symbol:e,bids:o.slice(0,r).map(a=>({price:parseFloat(a.px),quantity:parseFloat(a.sz),count:a.n})),asks:i.slice(0,r).map(a=>({price:parseFloat(a.px),quantity:parseFloat(a.sz),count:a.n})),timestamp:n.time}}async getRecentTrades(e,r=50){let s=this.symbolToCoin(e);return (await this.request("/info",{type:"recentTrades",coin:s})).slice(0,r).map(o=>({symbol:e,side:o.side==="B"?"buy":"sell",price:parseFloat(o.px),quantity:parseFloat(o.sz),timestamp:o.time,tradeId:o.tid}))}async placeOrder(e){throw new Error("placeOrder() requires wallet private key configuration for EIP-712 signature. Please configure authentication before calling this method. See: https://hyperliquid.gitbook.io/hyperliquid-docs/for-developers/api/exchange-endpoint")}async cancelOrder(e){throw new Error("cancelOrder() requires wallet private key configuration for EIP-712 signature. Please configure authentication before calling this method. See: https://hyperliquid.gitbook.io/hyperliquid-docs/for-developers/api/exchange-endpoint")}async getPositions(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"clearinghouseState",user:e.userAddress}),s=r.assetPositions.map(o=>{let i=o.position,a=`${i.coin}-USDC`,l=parseFloat(i.szi);if(l===0)return null;let c=parseFloat(i.entryPx),d=parseFloat(i.unrealizedPnl),u=parseFloat(i.positionValue);return {symbol:a,side:l>0?"long":"short",quantity:Math.abs(l),entryPrice:c,markPrice:c,unrealizedPnl:d,unrealizedPnlPercent:parseFloat(i.returnOnEquity)*100,leverage:i.leverage.value,liquidationPrice:i.liquidationPx?parseFloat(i.liquidationPx):void 0,margin:parseFloat(i.marginUsed),notionalValue:Math.abs(u)}}).filter(Boolean),n=e.symbol?s.filter(o=>o.symbol===e.symbol):s;return {positions:n,totalEquity:parseFloat(r.marginSummary.accountValue),availableBalance:parseFloat(r.marginSummary.accountValue)-parseFloat(r.marginSummary.totalMarginUsed),totalUnrealizedPnl:n.reduce((o,i)=>o+i.unrealizedPnl,0),raw:r}}async getOpenOrders(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"openOrders",user:e.userAddress}),s=r.map(o=>{let i=`${o.coin}-USDC`,a=parseFloat(o.origSz),l=parseFloat(o.sz),c=a-l;return {orderId:o.oid.toString(),clientOrderId:o.cloid,symbol:i,side:o.side?"long":"short",orderType:"limit",price:parseFloat(o.limitPx),quantity:a,filledQuantity:c,remainingQuantity:l,status:c>0&&l>0?"partially_filled":"pending",timestamp:o.timestamp,updateTimestamp:o.timestamp}}),n=e.symbol?s.filter(o=>o.symbol===e.symbol):s;return {orders:n,totalCount:n.length,raw:r}}async getTrades(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"userFills",user:e.userAddress}),s=r.map(n=>{let o=`${n.coin}-USDC`,i=n.dir.includes("Long");return {tradeId:n.tid.toString(),orderId:n.oid.toString(),symbol:o,side:i?"long":"short",price:parseFloat(n.px),quantity:parseFloat(n.sz),fee:parseFloat(n.fee||"0"),feeCurrency:n.feeToken||"USDC",isMaker:n.side==="M",timestamp:n.time}});return e.symbol&&(s=s.filter(n=>n.symbol===e.symbol)),e.startTime&&(s=s.filter(n=>n.timestamp>=e.startTime)),e.endTime&&(s=s.filter(n=>n.timestamp<=e.endTime)),e.limit&&(s=s.slice(0,e.limit)),{trades:s,totalCount:s.length,raw:r}}async connectWebSocket(){if(this.wsManager||(this.wsManager=new ae(this._wsEndpoint)),this.wsManager.isConnectedNow()){console.log("[WebSocket] Already connected");return}await this.wsManager.connect();}disconnectWebSocket(){this.wsManager&&(this.wsManager.disconnect(),this.wsManager=null);}subscribeMarketData(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");return this.wsManager.subscribe(e,r,s)}subscribeCandles(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");let n=`${e}:${r}`;return this.wsManager.subscribe("candle",n,s)}subscribeUserData(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");let n=e==="fills"?"userFills":"userEvents";return this.wsManager.subscribe(n,r,s)}unsubscribe(e){this.wsManager&&this.wsManager.unsubscribe(e);}},V=class extends Error{constructor(r,s,n){super(r);this.statusCode=s;this.responseBody=n;this.name="HyperliquidApiError";}};var re=react.createContext({});function Xt({client:t,children:e}){return jsxRuntime.jsx(re.Provider,{value:{client:t},children:e})}function P(){let t=react.useContext(re);if(!t||!t.client)throw new Error("usePerpetualsClient must be used within a PerpetualsProvider");return t}function it(){return ["perps","coins"]}async function at(t){return await t.getSupportedCoins()}function be(t={}){let{client:e}=P();return reactQuery.useQuery({queryKey:it(),queryFn:async()=>at(e),staleTime:300*1e3,...t})}function lt(t){return ["perps","market",t.symbol]}async function ct(t,{symbol:e}){return await t.getMarket(e)}function se(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:lt(t),queryFn:async()=>ct(r,t),staleTime:10*1e3,...e})}function dt(t={}){return ["perps","markets",JSON.stringify((t.symbols??[]).sort())]}async function ut(t,{symbols:e}={}){return await t.getMarkets(e)}function xe(t={},e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:dt(t),queryFn:async()=>ut(r,t),staleTime:10*1e3,...e})}function pt(t){return ["perps","klines",t.symbol,t.interval,String(t.limit??100)]}async function mt(t,{symbol:e,interval:r,limit:s}){return await t.getKlines(e,r,s)}function or(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:pt(t),queryFn:async()=>mt(r,t),staleTime:30*1e3,...e})}function ft(t){return ["perps","orderBook",t.symbol,String(t.maxLevel??20)]}async function yt(t,{symbol:e,maxLevel:r}){return await t.getOrderBook(e,r)}function he(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:ft(t),queryFn:async()=>yt(r,t),staleTime:5*1e3,...e})}function gt(t){return ["perps","recentTrades",t.symbol,String(t.limit??50)]}async function bt(t,{symbol:e,limit:r}){return await t.getRecentTrades(e,r)}function Pe(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:gt(t),queryFn:async()=>bt(r,t),staleTime:5*1e3,...e})}function xt(t){return ["perps","positions",t.userAddress??"",t.symbol??""]}async function ht(t,e){return await t.getPositions(e)}function ve(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:xt(n),queryFn:async()=>ht(r,n),enabled:s&&!!n.userAddress,staleTime:10*1e3,...e})}function Pt(t){return ["perps","orders",t.userAddress??"",t.symbol??""]}async function vt(t,e){return await t.getOpenOrders(e)}function Se(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:Pt(n),queryFn:async()=>vt(r,n),enabled:s&&!!n.userAddress,staleTime:5*1e3,...e})}function St(t){return ["perps","trades",t.userAddress??"",t.symbol??"",String(t.limit??50),String(t.startTime??""),String(t.endTime??"")]}async function kt(t,e){return await t.getTrades(e)}function ke(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:St(n),queryFn:async()=>kt(r,n),enabled:s&&!!n.userAddress,staleTime:30*1e3,...e})}async function Ct(t,e){return await t.placeOrder(e)}function ne(t={}){let{client:e}=P();return reactQuery.useMutation({mutationFn:async r=>Ct(e,r),...t})}async function Nt(t,e){return await t.cancelOrder(e)}function Ce(t={}){let{client:e}=P();return reactQuery.useMutation({mutationFn:async r=>Nt(e,r),...t})}function _(t){let{type:e,symbol:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,d]=react.useState(null),u=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),d(null),f=n.subscribeMarketData(e,r,u);}catch(y){p&&(d(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,u]),{data:o,isConnected:a,error:c}}function br(t){let{symbol:e,interval:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,d]=react.useState(null),u=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),d(null),f=n.subscribeCandles(e,r,u);}catch(y){p&&(d(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,u]),{data:o,isConnected:a,error:c}}function oe(t){let{type:e,userAddress:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,d]=react.useState(null),u=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s||!r)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),d(null),f=n.subscribeUserData(e,r,u);}catch(y){p&&(d(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,u]),{data:o,isConnected:a,error:c}}function Te(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center px-4 py-3 bg-neutral-900 border-b border-neutral-800",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"Market data not available"})})}function Ue(){return jsxRuntime.jsxs("div",{className:"flex items-center gap-6 px-4 py-3 bg-neutral-900 border-b border-neutral-800",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-3",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-6 w-20 rounded"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-8 w-28 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]})]}),jsxRuntime.jsx("div",{className:"h-8 w-px bg-neutral-800"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-6 text-sm",children:[jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-20 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-20 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-24 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-32 rounded"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-20 rounded"})]})]})]})]})}function Fe(t){let[e,r]=react.useState(),[s,n]=react.useState(0),{data:o,isPending:i}=se({symbol:t}),{data:a,isConnected:l}=_({type:"ticker",symbol:t,enabled:!!o});return react.useEffect(()=>{o&&r(o);},[o]),react.useEffect(()=>{if(!a)return;let c=Pr(a,t);c&&r(d=>vr(d??o??void 0,c,t));},[a,o,t]),react.useEffect(()=>{let c=()=>{let u=Date.now(),f=480*60*1e3,p=u%f,g=f-p;return Math.floor(g/1e3)};n(c());let d=setInterval(()=>{n(c());},1e3);return ()=>clearInterval(d)},[]),{marketData:e,isLoading:i,fundingCountdown:s}}function Pr(t,e){if(Array.isArray(t)){let r=t.find(s=>!s||typeof s!="object"?false:s.symbol===e);return r&&typeof r=="object"?r:null}return t&&typeof t=="object"?t:null}function j(t,e){return typeof t=="number"&&Number.isFinite(t)?t:e}function vr(t,e,r){return {symbol:e.symbol??t?.symbol??r,price:j(e.price,t?.price??0),change24h:j(e.change24h,t?.change24h??0),volume24h:j(e.volume24h,t?.volume24h??0),fundingRate:j(e.fundingRate,t?.fundingRate??0),openInterest:j(e.openInterest,t?.openInterest??0),markPrice:j(e.markPrice,t?.markPrice??0),indexPrice:typeof e.indexPrice=="number"&&Number.isFinite(e.indexPrice)?e.indexPrice:t?.indexPrice,high24h:typeof e.high24h=="number"&&Number.isFinite(e.high24h)?e.high24h:t?.high24h,low24h:typeof e.low24h=="number"&&Number.isFinite(e.low24h)?e.low24h:t?.low24h}}function Sr(t){let e=Math.floor(t/3600),r=Math.floor(t%3600/60),s=t%60;return `${String(e).padStart(2,"0")}:${String(r).padStart(2,"0")}:${String(s).padStart(2,"0")}`}function Tt(t,e=2){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e9?`$${(t/1e9).toFixed(e)}B`:t>=1e6?`$${(t/1e6).toFixed(e)}M`:t>=1e3?`$${(t/1e3).toFixed(e)}K`:`$${t.toFixed(e)}`}function Ut(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e3?t.toLocaleString("en-US",{minimumFractionDigits:0,maximumFractionDigits:0}):t>=1?t.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:4}):t.toFixed(6)}function Ie({marketData:t,fundingCountdown:e}){let{symbol:r,price:s,change24h:n,indexPrice:o,volume24h:i,openInterest:a,fundingRate:l}=t,c=typeof n=="number"&&Number.isFinite(n)?n:0,d=typeof l=="number"&&Number.isFinite(l)?l:0,u=c>=0,f=c.toFixed(2);return jsxRuntime.jsxs("div",{className:"flex items-center px-4",style:{minHeight:64,maxHeight:64,gap:16},children:[jsxRuntime.jsxs("div",{className:"flex items-baseline",style:{gap:8},children:[jsxRuntime.jsx("span",{style:{fontSize:18,fontWeight:500,lineHeight:"23px",letterSpacing:"-0.36px",color:"#fcfcfc"},children:Ut(s)}),jsxRuntime.jsxs("span",{style:{fontSize:12,fontWeight:400,lineHeight:"16px",color:u?"#2fe3ac":"#ec397a"},children:[u?"+":"",f,"%"]})]}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:16},children:[jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#c8c9d1",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Oracle Price"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#fcfcfc"},children:o?Ut(o):"-"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#c8c9d1",lineHeight:"16px",letterSpacing:"-0.12px"},children:"24h Volume"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#fcfcfc"},children:Tt(i,0)})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#c8c9d1",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Open Interest"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#fcfcfc"},children:Tt(a*(t.markPrice||s))})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#c8c9d1",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Funding / Countdown"}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:8},children:[jsxRuntime.jsxs("span",{style:{fontSize:13,lineHeight:"17px",color:d>=0?"#2fe3ac":"#ec397a"},children:[(d*100).toFixed(5),"%"]}),jsxRuntime.jsx("span",{style:{fontSize:13,lineHeight:"17px",color:"#fcfcfc"},children:Sr(e)})]})]})]})]})}function kr({symbol:t}){let{marketData:e,isLoading:r,fundingCountdown:s}=Fe(t);return r?jsxRuntime.jsx(Ue,{}):e?jsxRuntime.jsx(Ie,{marketData:e,fundingCountdown:s}):jsxRuntime.jsx(Te,{})}function Re({onSelectCoin:t}={}){let[e,r]=react.useState(""),[s,n]=react.useState([]),{data:o,isPending:i}=be(),{data:a,isPending:l}=xe({symbols:o},{enabled:!!o&&o.length>0});react.useEffect(()=>{a&&n(a);},[a]);let c=react.useMemo(()=>{if(!e.trim())return s;let u=e.toLowerCase().trim();return s.filter(f=>f.symbol.toLowerCase().includes(u))},[s,e]);return {coins:s,isLoading:i||l,searchQuery:e,setSearchQuery:r,filteredCoins:c,handleSelectCoin:u=>{t?.(u);}}}function Ft(t,e=2){return t>=1e9?`$${(t/1e9).toFixed(e)}B`:t>=1e6?`$${(t/1e6).toFixed(e)}M`:t>=1e3?`$${(t/1e3).toFixed(e)}K`:`$${t.toFixed(e)}`}function Or(t){return t>=1e3?t.toFixed(2):t>=1?t.toFixed(4):t.toFixed(6)}function Ee({coins:t,searchQuery:e,onSearchChange:r,onSelectCoin:s,isLoading:n}){return jsxRuntime.jsxs("div",{className:"flex flex-col",style:{backgroundColor:"#18181a",flex:"1 1 0",minHeight:0},children:[jsxRuntime.jsx("div",{style:{padding:"16px 16px 12px"},children:jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:32,border:"1px solid #323542",borderRadius:4,padding:"0 6px 0 12px",gap:8},children:[jsxRuntime.jsx(ui.SearchIcon,{className:"flex-shrink-0",style:{width:14,height:14,color:"#777a8c"}}),jsxRuntime.jsx("input",{type:"text",placeholder:"Search coins...",value:e,onChange:o=>r(o.target.value),className:"flex-1 bg-transparent outline-none",style:{fontSize:12,color:"#fcfcfc",border:"none"}})]})}),jsxRuntime.jsxs("div",{className:"flex-1 overflow-auto",children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:28,padding:"0 16px",borderBottom:"1px solid rgba(50,53,66,0.5)",position:"sticky",top:0,backgroundColor:"#18181a",zIndex:1},children:[jsxRuntime.jsx("span",{style:{flex:"0 0 140px",fontSize:12,color:"#777a8c"},children:"Token"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#777a8c",textAlign:"right"},children:"Last Price"}),jsxRuntime.jsx("span",{style:{flex:"0 0 120px",fontSize:12,color:"#777a8c",textAlign:"right"},children:"24h Change"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#777a8c",textAlign:"right"},children:"8h Funding"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#777a8c",textAlign:"right"},children:"24h Volume"}),jsxRuntime.jsx("span",{style:{flex:"1",fontSize:12,color:"#777a8c",textAlign:"right"},children:"Open Interest"})]}),n?jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:100},children:jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:"Loading..."})}):t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:100},children:jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:e?"No coins found":"No coins available"})}):t.map(o=>{let i=o.change24h>=0,a=o.change24h.toFixed(2),l=(o.fundingRate*100).toFixed(4),c=o.fundingRate>=0,d=o.symbol.split("-")[0];return jsxRuntime.jsxs("div",{className:"flex items-center cursor-pointer transition-colors",style:{height:36,padding:"0 16px",borderBottom:"1px solid rgba(50,53,66,0.5)"},onClick:()=>s(o.symbol),onMouseEnter:u=>{u.currentTarget.style.backgroundColor="rgba(255,255,255,0.03)";},onMouseLeave:u=>{u.currentTarget.style.backgroundColor="transparent";},children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{flex:"0 0 140px",gap:8},children:[jsxRuntime.jsx("img",{src:`https://app.hyperliquid.xyz/coins/${d}.svg`,alt:d,className:"rounded-full",style:{width:20,height:20},onError:u=>{let f=u.target;f.style.display="none";}}),jsxRuntime.jsx("span",{style:{fontSize:12,fontWeight:500,color:"#fcfcfc"},children:d})]}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#fcfcfc",textAlign:"right"},children:Or(o.price)}),jsxRuntime.jsxs("span",{style:{flex:"0 0 120px",fontSize:12,fontWeight:500,color:i?"#2fe3ac":"#ec397a",textAlign:"right"},children:[i?"+":"",a,"%"]}),jsxRuntime.jsxs("span",{style:{flex:"0 0 100px",fontSize:12,color:c?"#2fe3ac":"#ec397a",textAlign:"right"},children:[l,"%"]}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#c8c9d1",textAlign:"right"},children:Ft(o.volume24h)}),jsxRuntime.jsx("span",{style:{flex:"1",fontSize:12,color:"#c8c9d1",textAlign:"right"},children:Ft(o.openInterest*o.price)})]},o.symbol)})]})]})}function Tr({onSelectCoin:t,className:e}){let{filteredCoins:r,isLoading:s,searchQuery:n,setSearchQuery:o,handleSelectCoin:i}=Re({onSelectCoin:t});return jsxRuntime.jsx("div",{className:e,style:{display:"flex",flexDirection:"column",flex:"1 1 0",minHeight:0,overflow:"hidden"},children:jsxRuntime.jsx(Ee,{coins:r,searchQuery:n,onSearchChange:o,onSelectCoin:i,isLoading:s})})}function Rt(t,e){if(e<=0)return t;let r=new Map;return t.forEach(s=>{let n=Math.floor(s.price/e)*e,o=r.get(n);o?(o.quantity+=s.quantity,s.count&&(o.count=(o.count||0)+s.count)):r.set(n,{price:n,quantity:s.quantity,count:s.count});}),Array.from(r.values())}function Et(t){let e=0,r=t.map(n=>{let o=n.quantity*n.price;return e+=o,{...n,quantity:o,total:e,percentage:0}}),s=e;return r.map(n=>({...n,percentage:s>0?n.total/s*100:0}))}function ze({symbol:t,maxLevel:e=20,precision:r=.01}){let[s,n]=react.useState(null),[o,i]=react.useState(r),{data:a,isPending:l}=he({symbol:t,maxLevel:e}),{data:c}=_({type:"orderBook",symbol:t,enabled:!!a});return react.useEffect(()=>{c?n(c):a&&n(a);},[c,a]),{...react.useMemo(()=>{if(!s)return {bids:[],asks:[],spread:0,spreadPercentage:0};let u=Rt(s.bids,o),f=Rt(s.asks,o),p=u.sort((H,R)=>R.price-H.price).slice(0,e),g=f.sort((H,R)=>H.price-R.price).slice(0,e),y=Et(p),N=Et(g),h=y[0]?.price||0,I=(N[0]?.price||0)-h,W=h>0?I/h*100:0;return {bids:y,asks:N,spread:I,spreadPercentage:W}},[s,o,e]),isLoading:l,precision:o,setPrecision:i}}function Fr(t){return t>=1e3?t.toLocaleString("en-US",{minimumFractionDigits:0,maximumFractionDigits:0}):t>=1?t.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:4}):t.toFixed(6)}function zt(t){return Math.round(t).toLocaleString("en-US")}function Qt({price:t,quantity:e,total:r,percentage:s,side:n,onClick:o}){let i=n==="ask";return jsxRuntime.jsxs("div",{className:"relative flex items-center cursor-pointer hover:bg-white/5 transition-colors",style:{height:22,minHeight:22,maxHeight:22,padding:"0 16px",gap:16,fontSize:11},onClick:o,children:[jsxRuntime.jsx("div",{className:"absolute left-0 top-0",style:{height:20,width:`${s}%`,background:i?"linear-gradient(to right, rgba(209,57,236,0), rgb(236,57,122))":"linear-gradient(to right, rgba(47,194,227,0), rgb(47,227,172))",opacity:.15}}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center",style:{flex:"1 1 0%"},children:jsxRuntime.jsx("span",{style:{color:i?"#ec397a":"#2fe3ac",fontWeight:400},children:Fr(t)})}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center justify-end",style:{flex:"1 1 0%",color:"#fcfcfc"},children:zt(e)}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center justify-end",style:{flex:"1 1 0%",color:"#fcfcfc"},children:zt(r)})]})}function Qe({bids:t,asks:e,spread:r,spreadPercentage:s,onPriceClick:n}){let o=[...e].reverse();return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{backgroundColor:"#06070b",fontSize:11},children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:28,minHeight:28,padding:"0 16px",gap:16,color:"#777a8c",fontSize:11},children:[jsxRuntime.jsx("div",{className:"flex items-center",style:{flex:"1 1 0%"},children:"Price"}),jsxRuntime.jsx("div",{className:"flex items-center justify-end",style:{flex:"1 1 0%"},children:"Amount (USD)"}),jsxRuntime.jsx("div",{className:"flex items-center justify-end",style:{flex:"1 1 0%"},children:"Total (USD)"})]}),jsxRuntime.jsx("div",{className:"flex-1 flex flex-col-reverse overflow-hidden",children:o.map((i,a)=>jsxRuntime.jsx(Qt,{price:i.price,quantity:i.quantity,total:i.total,percentage:i.percentage,side:"ask",onClick:()=>n?.(i.price)},`ask-${i.price}-${a}`))}),jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:24,minHeight:24,padding:"0 16px",backgroundColor:"rgba(34,36,45,0.5)"},children:jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:12,fontSize:12,color:"#fcfcfc"},children:[jsxRuntime.jsx("span",{style:{color:"#fcfcfc"},children:"Spread:"}),jsxRuntime.jsx("button",{type:"button",className:"hover:text-white transition-colors cursor-pointer",style:{color:"#fcfcfc",fontWeight:400,background:"none",border:"none",padding:0},onClick:()=>n?.(r),children:r>=1?Math.round(r).toLocaleString("en-US"):r.toFixed(4)}),jsxRuntime.jsxs("span",{style:{color:"#fcfcfc",fontWeight:500},children:[s.toFixed(3),"%"]})]})}),jsxRuntime.jsx("div",{className:"flex-1 overflow-hidden",children:t.map((i,a)=>jsxRuntime.jsx(Qt,{price:i.price,quantity:i.quantity,total:i.total,percentage:i.percentage,side:"bid",onClick:()=>n?.(i.price)},`bid-${i.price}-${a}`))})]})}function Ir(){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{padding:"0 16px"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:28,marginBottom:4},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]}),Array.from({length:10}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]},`ask-skeleton-${e}`)),jsxRuntime.jsx("div",{className:"flex justify-center items-center",style:{height:28},children:jsxRuntime.jsx(ui.Skeleton,{className:"h-4 w-32 rounded"})}),Array.from({length:10}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]},`bid-skeleton-${e}`))]})}function Dr(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-full",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"No order book data available"})})}function Rr({symbol:t,maxLevel:e=20,onPriceClick:r,className:s}){let{bids:n,asks:o,spread:i,spreadPercentage:a,isLoading:l}=ze({symbol:t,maxLevel:e});return l?jsxRuntime.jsx(Ir,{}):n.length===0&&o.length===0?jsxRuntime.jsx(Dr,{}):jsxRuntime.jsx("div",{className:s,children:jsxRuntime.jsx(Qe,{bids:n,asks:o,spread:i,spreadPercentage:a,onPriceClick:r})})}function qe({symbol:t,limit:e=50}){let[r,s]=react.useState([]),{data:n,isPending:o}=Pe({symbol:t,limit:e}),{data:i}=_({type:"trades",symbol:t,enabled:!!n});return react.useEffect(()=>{n&&s(n.filter(Bt));},[n]),react.useEffect(()=>{i&&s(a=>{let l=zr(i);if(l.length===0)return a;let c=l.filter(u=>!a.some(f=>f.timestamp===u.timestamp&&f.price===u.price&&f.quantity===u.quantity));return c.length===0?a:[...c,...a].slice(0,e)});},[i,e]),{trades:r,isLoading:o}}function zr(t){return (Array.isArray(t)?t:[t]).filter(Bt)}function Bt(t){return t?typeof t.symbol=="string"&&(t.side==="buy"||t.side==="sell")&&typeof t.price=="number"&&Number.isFinite(t.price)&&typeof t.quantity=="number"&&Number.isFinite(t.quantity)&&typeof t.timestamp=="number"&&Number.isFinite(t.timestamp):false}function Qr(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e3?t.toFixed(2):t>=1?t.toFixed(4):t.toFixed(6)}function Lt(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e6?(t/1e6).toFixed(2)+"M":t>=1e3?(t/1e3).toFixed(2)+"K":t.toFixed(2)}function qr(t){if(typeof t!="number"||!Number.isFinite(t))return "-";let e=new Date(t),r=String(e.getHours()).padStart(2,"0"),s=String(e.getMinutes()).padStart(2,"0"),n=String(e.getSeconds()).padStart(2,"0");return `${r}:${s}:${n}`}function Le({trades:t,onTradeClick:e}){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full overflow-auto",style:{backgroundColor:"#06070b",fontSize:11},children:[jsxRuntime.jsxs("div",{className:"sticky top-0 z-10 flex items-center",style:{height:28,minHeight:28,padding:"0 16px",gap:16,color:"#777a8c",fontSize:11},children:[jsxRuntime.jsx("div",{className:"flex-1",style:{maxWidth:100},children:"Price"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",children:"Amount"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:100},children:"Total"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:70},children:"Time"})]}),jsxRuntime.jsx("div",{className:"flex-1",children:t.map((r,s)=>{let n=r.side==="buy",o=typeof r.price=="number"&&Number.isFinite(r.price)&&typeof r.quantity=="number"&&Number.isFinite(r.quantity)?r.price*r.quantity:void 0;return jsxRuntime.jsxs("div",{className:"flex items-center cursor-pointer hover:bg-white/5 transition-colors",style:{height:22,minHeight:22,maxHeight:22,padding:"0 16px",gap:16,fontSize:11},onClick:()=>e?.(r),children:[jsxRuntime.jsx("div",{className:"flex-1",style:{maxWidth:100},children:jsxRuntime.jsx("span",{style:{color:n?"#2fe3ac":"#ec397a",fontWeight:400},children:Qr(r.price)})}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{color:"#fcfcfc"},children:Lt(r.quantity)}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:100,color:"#fcfcfc"},children:Lt(o)}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:70,color:"#c8c9d1"},children:qr(r.timestamp)})]},`${r.timestamp}-${r.price}-${s}`)})})]})}function Br(){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{padding:"0 16px"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:28,marginBottom:4},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"})]}),Array.from({length:12}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"})]},`trade-skeleton-${e}`))]})}function Lr(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-full",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"No recent trades"})})}function Ar({symbol:t,limit:e=50,onTradeClick:r,className:s}){let{trades:n,isLoading:o}=qe({symbol:t,limit:e});return o?jsxRuntime.jsx(Br,{}):n.length===0?jsxRuntime.jsx(Lr,{}):jsxRuntime.jsx("div",{className:s,children:jsxRuntime.jsx(Le,{trades:n,onTradeClick:r})})}function We({symbol:t,userAddress:e,maxLeverage:r=150,onSuccess:s,onError:n}){let[o,i]=react.useState("long"),[a,l]=react.useState("market"),c=reactHookForm.useForm({defaultValues:{amount:0,leverage:20,takeProfitPrice:void 0,takeProfitPercent:void 0,stopLossPrice:void 0,stopLossPercent:void 0}}),{data:d}=se({symbol:t}),{mutateAsync:u,isPending:f}=ne({onSuccess:()=>{c.reset(),s?.();},onError:k=>{n?.(k);}}),p=c.watch(),{amount:g,leverage:y,price:N}=p,h=react.useMemo(()=>a==="limit"&&N?N:d?.price||0,[a,N,d?.price]),B=react.useMemo(()=>!g||!h?0:g*h*5e-4,[g,h]),I=react.useMemo(()=>!g||!h?0:g*h+B,[g,h,B]),W=react.useMemo(()=>{if(!g||!h||!y||y===1)return;let k=.005,G=h;return o==="long"?G*(1-(1/y-k)):G*(1+(1/y-k))},[g,h,y,o]),H=1e4,R=1e4,me=0,C=react.useCallback(async k=>{if(!e)throw new Error("User address is required");let G=a==="limit"?k.price:void 0,fe=k.takeProfitPrice,ye=k.stopLossPrice;if(!fe&&k.takeProfitPercent&&k.takeProfitPercent>0&&h){let te=k.takeProfitPercent/100;fe=o==="long"?h*(1+te):h*(1-te);}if(!ye&&k.stopLossPercent&&k.stopLossPercent>0&&h){let te=k.stopLossPercent/100;ye=o==="long"?h*(1-te):h*(1+te);}await u({symbol:t,side:o,orderType:a,amount:k.amount,price:G,leverage:k.leverage,takeProfitPrice:fe,stopLossPrice:ye,userAddress:e});},[t,o,a,h,e,u]);return {form:c,side:o,orderType:a,setSide:i,setOrderType:l,handleSubmit:C,isSubmitting:f,currentPrice:h,estimatedFee:B,estimatedTotal:I,liquidationPrice:W,availableMargin:H,accountValue:R,currentPosition:me,maxLeverage:r}}function de(t,e=2){return t.toFixed(e)}function _r({leverage:t,maxLeverage:e,onLeverageChange:r,onClose:s}){let n=[1,2,3,5,10,20,25,50,100].filter(o=>o<=e);return jsxRuntime.jsxs("div",{className:"fixed inset-0 z-50 flex items-center justify-center",children:[jsxRuntime.jsx("div",{className:"absolute inset-0 bg-black/60",onClick:s,onKeyDown:o=>o.key==="Escape"&&s(),role:"button",tabIndex:-1,"aria-label":"Close"}),jsxRuntime.jsxs("div",{className:"relative z-10 w-72 bg-neutral-900 border border-neutral-700 rounded-lg p-4 shadow-2xl",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between mb-4",children:[jsxRuntime.jsx("h3",{className:"text-sm font-medium text-white",children:"Adjust Leverage"}),jsxRuntime.jsx("button",{type:"button",onClick:s,className:"text-neutral-400 hover:text-white",children:jsxRuntime.jsx("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:jsxRuntime.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M6 18L18 6M6 6l12 12"})})})]}),jsxRuntime.jsxs("div",{className:"text-center text-2xl font-bold text-white mb-4",children:[t,"x"]}),jsxRuntime.jsx(ui.Slider,{value:[t],onChange:o=>r(Array.isArray(o)?o[0]:o),minValue:1,maxValue:e,step:1,className:"w-full mb-3"}),jsxRuntime.jsx("div",{className:"flex flex-wrap gap-1.5",children:n.map(o=>jsxRuntime.jsxs("button",{type:"button",className:ui.cn("px-2.5 py-1 text-xs rounded transition-colors",t===o?"bg-green-600 text-white":"bg-neutral-800 text-neutral-400 hover:bg-neutral-700"),onClick:()=>r(o),children:[o,"x"]},o))}),jsxRuntime.jsx("button",{type:"button",className:"w-full mt-4 text-white h-9 rounded cursor-pointer transition-colors",style:{backgroundColor:"#16a34a"},onClick:s,children:"Confirm"})]})]})}function He({methods:t,side:e,orderType:r,onSideChange:s,onOrderTypeChange:n,onSubmit:o,isSubmitting:i,symbol:a,currentPrice:l,estimatedFee:c,liquidationPrice:d,availableMargin:u,accountValue:f,currentPosition:p,maxLeverage:g}){let[y,N]=react.useState(false),[h,B]=react.useState(false),I=t.watch("leverage")||20,W=t.watch("amount")||0,H=a.split("-")[0],R=u>0&&l?Math.min(W*l/(u*I)*100,100):0,me=C=>{let k=(Array.isArray(C)?C[0]:C)/100;if(l&&l>0){let G=u*I*k/l;t.setValue("amount",Number(G.toFixed(6)));}};return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{backgroundColor:"#06070b"},children:[jsxRuntime.jsxs("div",{className:"perp-order-form flex-1 overflow-y-auto",style:{padding:"16px 16px",display:"flex",flexDirection:"column",gap:16},children:[jsxRuntime.jsxs("div",{className:"flex",style:{border:"1px solid rgba(34,36,45,0.5)",borderRadius:8,padding:4,gap:4},children:[jsxRuntime.jsx("button",{type:"button",className:"flex-1 cursor-pointer transition-colors",style:{height:32,fontSize:16,borderRadius:4,backgroundColor:e==="long"?"#2fe3ac":"transparent",color:e==="long"?"#090909":"#c8c9d1",fontWeight:e==="long"?700:500},onClick:()=>s("long"),children:"Long"}),jsxRuntime.jsx("button",{type:"button",className:"flex-1 cursor-pointer transition-colors",style:{height:32,fontSize:16,borderRadius:4,backgroundColor:e==="short"?"#ec397a":"transparent",color:e==="short"?"#090909":"#c8c9d1",fontWeight:e==="short"?700:500},onClick:()=>s("short"),children:"Short"})]}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:8},children:[jsxRuntime.jsx("div",{className:"flex",children:[{key:"market",label:"Market"},{key:"limit",label:"Limit"}].map(C=>jsxRuntime.jsx("div",{style:{height:32,display:"flex",alignItems:"center",borderBottom:r===C.key?"2px solid #fcfcfc":"2px solid transparent",padding:"2px 0 0",cursor:"pointer"},children:jsxRuntime.jsx("button",{type:"button",className:"cursor-pointer transition-colors",style:{padding:"0 8px",fontSize:12,fontWeight:500,backgroundColor:"transparent",color:r===C.key?"#fcfcfc":"#c8c9d1",border:"none"},onClick:()=>n(C.key),children:C.label})},C.key))}),jsxRuntime.jsx("div",{className:"flex-1"}),jsxRuntime.jsxs("button",{type:"button",className:"cursor-pointer transition-colors",style:{height:24,padding:"0 5px",fontSize:12,borderRadius:4,backgroundColor:"rgba(34,36,45,0.5)",color:"#fcfcfc",fontWeight:400,border:"1px solid rgba(34,36,45,0.5)"},onClick:()=>N(true),children:["Leverage: ",I,"x"]})]}),jsxRuntime.jsx(ui.RHForm,{methods:t,onSubmit:o,children:jsxRuntime.jsxs("div",{className:"space-y-3 w-full",children:[r==="limit"&&jsxRuntime.jsxs("div",{className:"perp-price-box",style:{borderRadius:4,padding:8,backgroundColor:"rgba(34,36,45,0.5)",border:"1px solid rgb(34,36,45)",height:64,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:"Price"}),jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:"USDC"})]}),jsxRuntime.jsx(ui.RHNumberInput,{name:"price",placeholder:"0.0 USDC",className:"w-full"})]}),jsxRuntime.jsxs("div",{className:"perp-buy-amt",style:{borderRadius:4,padding:8,backgroundColor:"rgba(34,36,45,0.5)",border:"1px solid rgb(34,36,45)",height:64,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:"Buy Amount"}),jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c"},children:H})]}),jsxRuntime.jsx(ui.RHNumberInput,{name:"amount",placeholder:"0.0 USDC",className:"w-full"})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("style",{children:`
|
|
1
|
+
'use strict';var react=require('react'),jsxRuntime=require('react/jsx-runtime'),reactQuery=require('@tanstack/react-query'),ui=require('@liberfi.io/ui'),reactHookForm=require('react-hook-form');typeof window<"u"&&(window.__LIBERFI_VERSION__=window.__LIBERFI_VERSION__||{},window.__LIBERFI_VERSION__["@liberfi.io/ui-perpetuals"]="0.1.121");var Jt="0.1.121";var ae=class{ws=null;wsEndpoint;subscriptions=new Map;reconnectAttempts=0;maxReconnectAttempts=10;reconnectDelay=1e3;heartbeatInterval=null;messageQueue=[];isConnected=false;pingInterval=3e4;reconnectTimeout=null;isReconnecting=false;constructor(e){this.wsEndpoint=e;}async connect(){return new Promise((e,r)=>{try{this.ws&&this.ws.close(),this.ws=new WebSocket(this.wsEndpoint),this.ws.onopen=()=>{console.log("[WebSocket] Connected to Hyperliquid"),this.isConnected=!0,this.reconnectAttempts=0,this.isReconnecting=!1,this.startHeartbeat(),this.flushMessageQueue(),e();},this.ws.onmessage=s=>{this.handleMessage(s.data);},this.ws.onerror=s=>{console.error("[WebSocket] Error:",s),this.isConnected=!1,this.isReconnecting||r(new Error("WebSocket connection failed"));},this.ws.onclose=s=>{console.log(`[WebSocket] Closed: ${s.code} - ${s.reason||"No reason provided"}`),this.isConnected=!1,this.stopHeartbeat(),s.code!==1e3&&this.attemptReconnect();};}catch(s){r(s);}})}disconnect(){this.stopHeartbeat(),this.subscriptions.clear(),this.reconnectTimeout!==null&&(clearTimeout(this.reconnectTimeout),this.reconnectTimeout=null),this.ws&&(this.ws.close(1e3,"Normal closure"),this.ws=null),this.isConnected=false,this.isReconnecting=false,this.reconnectAttempts=0;}attemptReconnect(){if(this.isReconnecting)return;if(this.reconnectAttempts>=this.maxReconnectAttempts){console.error("[WebSocket] Max reconnection attempts reached");return}this.isReconnecting=true,this.reconnectAttempts++;let e=Math.min(this.reconnectDelay*Math.pow(2,this.reconnectAttempts-1),3e4);console.log(`[WebSocket] Reconnecting in ${e}ms (attempt ${this.reconnectAttempts}/${this.maxReconnectAttempts})`),this.reconnectTimeout=window.setTimeout(()=>{this.connect().then(()=>{this.resubscribeAll();}).catch(r=>{console.error("[WebSocket] Reconnection failed:",r),this.isReconnecting=false;});},e);}startHeartbeat(){this.heartbeatInterval=window.setInterval(()=>{this.isConnected&&this.ws&&this.ws.readyState===WebSocket.OPEN&&this.send({method:"ping"});},this.pingInterval);}stopHeartbeat(){this.heartbeatInterval!==null&&(clearInterval(this.heartbeatInterval),this.heartbeatInterval=null);}send(e){this.isConnected&&this.ws&&this.ws.readyState===WebSocket.OPEN?this.ws.send(JSON.stringify(e)):this.messageQueue.push(e);}flushMessageQueue(){for(;this.messageQueue.length>0;){let e=this.messageQueue.shift();e&&this.send(e);}}resubscribeAll(){this.subscriptions.forEach(e=>{this.sendSubscription(e.type,e.param);});}handleMessage(e){try{let r=JSON.parse(e);r.channel?this.handleChannelMessage(r):r.method;}catch(r){console.error("[WebSocket] Failed to parse message:",r,e);}}handleChannelMessage(e){let r=e.channel;this.subscriptions.forEach((s,n)=>{if(this.isChannelMatch(r,s.type,s.param))try{let o=this.transformData(s.type,e.data,s.param);s.callback(o);}catch(o){console.error(`[WebSocket] Error in subscription callback (${n}):`,o);}});}isChannelMatch(e,r,s){return r==="ticker"?e==="allMids":r==="trades"?e==="trades":r==="orderBook"?e==="l2Book":r==="candle"?e==="candle":r==="userFills"?e==="userFills":r==="userEvents"?e==="userEvents":false}transformData(e,r,s){return e==="ticker"?this.transformTickerData(r):e==="trades"?this.transformTradesData(r,s):e==="orderBook"?this.transformOrderBookData(r,s):e==="candle"?this.transformCandleData(r,s):e==="userFills"?this.transformUserFillsData(r):e==="userEvents"?this.transformUserEventsData(r):r}transformTickerData(e){let r=e.mids||{};return Object.entries(r).map(([s,n])=>({symbol:`${s}-USDC`,price:parseFloat(n),timestamp:Date.now()}))}transformTradesData(e,r){return Array.isArray(e)?e.map(s=>({symbol:r,side:s.side==="B"?"buy":"sell",price:parseFloat(s.px),quantity:parseFloat(s.sz),timestamp:s.time,tradeId:s.tid})):[]}transformOrderBookData(e,r){let[s,n]=e.levels||[[],[]];return {symbol:r,bids:s.map(o=>({price:parseFloat(o.px),quantity:parseFloat(o.sz),count:o.n})),asks:n.map(o=>({price:parseFloat(o.px),quantity:parseFloat(o.sz),count:o.n})),timestamp:e.time||Date.now()}}transformCandleData(e,r){let[s]=r.split(":");return {symbol:s,open:parseFloat(e.o),high:parseFloat(e.h),low:parseFloat(e.l),close:parseFloat(e.c),volume:parseFloat(e.v),timestamp:e.t,closeTimestamp:e.T}}transformUserFillsData(e){return Array.isArray(e)?e.map(r=>({tradeId:r.tid?.toString(),orderId:r.oid?.toString(),symbol:`${r.coin}-USDC`,side:r.dir?.includes("Long")?"long":"short",price:parseFloat(r.px),quantity:parseFloat(r.sz),fee:parseFloat(r.fee||"0"),feeCurrency:r.feeToken||"USDC",isMaker:r.side==="M",timestamp:r.time})):[]}transformUserEventsData(e){return e}sendSubscription(e,r){let s;if(e==="ticker")s={method:"subscribe",subscription:{type:"allMids"}};else if(e==="trades")s={method:"subscribe",subscription:{type:"trades",coin:r.split("-")[0]}};else if(e==="orderBook")s={method:"subscribe",subscription:{type:"l2Book",coin:r.split("-")[0]}};else if(e==="candle"){let[n,o]=r.split(":");s={method:"subscribe",subscription:{type:"candle",coin:n.split("-")[0],interval:o}};}else e==="userFills"?s={method:"subscribe",subscription:{type:"userFills",user:r}}:e==="userEvents"&&(s={method:"subscribe",subscription:{type:"userEvents",user:r}});s&&this.send(s);}sendUnsubscription(e,r){let s;if(e==="ticker")s={method:"unsubscribe",subscription:{type:"allMids"}};else if(e==="trades")s={method:"unsubscribe",subscription:{type:"trades",coin:r.split("-")[0]}};else if(e==="orderBook")s={method:"unsubscribe",subscription:{type:"l2Book",coin:r.split("-")[0]}};else if(e==="candle"){let[n,o]=r.split(":");s={method:"unsubscribe",subscription:{type:"candle",coin:n.split("-")[0],interval:o}};}else e==="userFills"?s={method:"unsubscribe",subscription:{type:"userFills",user:r}}:e==="userEvents"&&(s={method:"unsubscribe",subscription:{type:"userEvents",user:r}});s&&this.send(s);}subscribe(e,r,s){let n=`${e}:${r}`;return this.subscriptions.set(n,{type:e,param:r,callback:s}),this.sendSubscription(e,r),n}unsubscribe(e){let r=this.subscriptions.get(e);r&&(this.sendUnsubscription(r.type,r.param),this.subscriptions.delete(e));}isConnectedNow(){return this.isConnected}};var ot={testnet:{api:"https://api.hyperliquid-testnet.xyz",ws:"wss://api.hyperliquid-testnet.xyz/ws"},mainnet:{api:"https://api.hyperliquid.xyz",ws:"wss://api.hyperliquid.xyz/ws"}},ge=class{apiEndpoint;_wsEndpoint;timeout;environment;wsManager=null;constructor(e={}){this.environment=e.environment||"testnet",this.apiEndpoint=e.apiEndpoint||ot[this.environment].api,this._wsEndpoint=e.wsEndpoint||ot[this.environment].ws,this.timeout=e.timeout||3e4;}async request(e,r){let s=`${this.apiEndpoint}${e}`;try{let n=new AbortController,o=setTimeout(()=>n.abort(),this.timeout),i=await fetch(s,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(r),signal:n.signal});if(clearTimeout(o),!i.ok)throw new V(`HTTP ${i.status}: ${i.statusText}`,i.status,await i.text());return await i.json()}catch(n){throw n.name==="AbortError"?new V(`Request timeout after ${this.timeout}ms`,408,""):n instanceof V?n:new V(`Network error: ${n.message}`,0,"")}}symbolToCoin(e){return e.split("-")[0]}parseInterval(e){return {"1m":6e4,"5m":3e5,"15m":9e5,"30m":18e5,"1h":36e5,"4h":144e5,"1d":864e5,"1w":6048e5}[e]}async getSupportedCoins(){let[e]=await this.request("/info",{type:"metaAndAssetCtxs"});return e.universe.map(r=>`${r.name}-USDC`)}async getMarket(e){let r=await this.getMarkets([e]);return r.length>0?r[0]:null}async getMarkets(e){let[r,s]=await this.request("/info",{type:"metaAndAssetCtxs"}),n=r.universe.map((o,i)=>{let a=s[i],l=`${o.name}-USDC`,c=parseFloat(a.midPx||a.markPx||"0"),u=a.prevDayPx?parseFloat(a.prevDayPx):c,d=u>0?(c-u)/u*100:0;return {symbol:l,price:c,change24h:d,volume24h:parseFloat(a.dayNtlVlm||"0"),fundingRate:parseFloat(a.funding||"0"),openInterest:parseFloat(a.openInterest||"0"),markPrice:parseFloat(a.markPx||"0"),indexPrice:parseFloat(a.oraclePx||a.midPx||"0")}});if(e&&e.length>0){let o=new Set(e);return n.filter(i=>o.has(i.symbol))}return n}async getKlines(e,r,s=100){let n=this.symbolToCoin(e),o=this.parseInterval(r),i=Date.now(),a=i-o*s;return (await this.request("/info",{type:"candleSnapshot",req:{coin:n,interval:r,startTime:a,endTime:i}})).map(c=>({symbol:e,open:parseFloat(c.o),high:parseFloat(c.h),low:parseFloat(c.l),close:parseFloat(c.c),volume:parseFloat(c.v),timestamp:c.t,closeTimestamp:c.T}))}async getOrderBook(e,r=10){let s=this.symbolToCoin(e),n=await this.request("/info",{type:"l2Book",coin:s}),[o,i]=n.levels;return {symbol:e,bids:o.slice(0,r).map(a=>({price:parseFloat(a.px),quantity:parseFloat(a.sz),count:a.n})),asks:i.slice(0,r).map(a=>({price:parseFloat(a.px),quantity:parseFloat(a.sz),count:a.n})),timestamp:n.time}}async getRecentTrades(e,r=50){let s=this.symbolToCoin(e);return (await this.request("/info",{type:"recentTrades",coin:s})).slice(0,r).map(o=>({symbol:e,side:o.side==="B"?"buy":"sell",price:parseFloat(o.px),quantity:parseFloat(o.sz),timestamp:o.time,tradeId:o.tid}))}async placeOrder(e){throw new Error("placeOrder() requires wallet private key configuration for EIP-712 signature. Please configure authentication before calling this method. See: https://hyperliquid.gitbook.io/hyperliquid-docs/for-developers/api/exchange-endpoint")}async cancelOrder(e){throw new Error("cancelOrder() requires wallet private key configuration for EIP-712 signature. Please configure authentication before calling this method. See: https://hyperliquid.gitbook.io/hyperliquid-docs/for-developers/api/exchange-endpoint")}async getPositions(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"clearinghouseState",user:e.userAddress}),s=r.assetPositions.map(o=>{let i=o.position,a=`${i.coin}-USDC`,l=parseFloat(i.szi);if(l===0)return null;let c=parseFloat(i.entryPx),u=parseFloat(i.unrealizedPnl),d=parseFloat(i.positionValue);return {symbol:a,side:l>0?"long":"short",quantity:Math.abs(l),entryPrice:c,markPrice:c,unrealizedPnl:u,unrealizedPnlPercent:parseFloat(i.returnOnEquity)*100,leverage:i.leverage.value,liquidationPrice:i.liquidationPx?parseFloat(i.liquidationPx):void 0,margin:parseFloat(i.marginUsed),notionalValue:Math.abs(d)}}).filter(Boolean),n=e.symbol?s.filter(o=>o.symbol===e.symbol):s;return {positions:n,totalEquity:parseFloat(r.marginSummary.accountValue),availableBalance:parseFloat(r.marginSummary.accountValue)-parseFloat(r.marginSummary.totalMarginUsed),totalUnrealizedPnl:n.reduce((o,i)=>o+i.unrealizedPnl,0),raw:r}}async getOpenOrders(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"openOrders",user:e.userAddress}),s=r.map(o=>{let i=`${o.coin}-USDC`,a=parseFloat(o.origSz),l=parseFloat(o.sz),c=a-l;return {orderId:o.oid.toString(),clientOrderId:o.cloid,symbol:i,side:o.side?"long":"short",orderType:"limit",price:parseFloat(o.limitPx),quantity:a,filledQuantity:c,remainingQuantity:l,status:c>0&&l>0?"partially_filled":"pending",timestamp:o.timestamp,updateTimestamp:o.timestamp}}),n=e.symbol?s.filter(o=>o.symbol===e.symbol):s;return {orders:n,totalCount:n.length,raw:r}}async getTrades(e={}){if(!e.userAddress)throw new Error("Hyperliquid requires userAddress parameter. Example: { userAddress: '0x...' }");let r=await this.request("/info",{type:"userFills",user:e.userAddress}),s=r.map(n=>{let o=`${n.coin}-USDC`,i=n.dir.includes("Long");return {tradeId:n.tid.toString(),orderId:n.oid.toString(),symbol:o,side:i?"long":"short",price:parseFloat(n.px),quantity:parseFloat(n.sz),fee:parseFloat(n.fee||"0"),feeCurrency:n.feeToken||"USDC",isMaker:n.side==="M",timestamp:n.time}});return e.symbol&&(s=s.filter(n=>n.symbol===e.symbol)),e.startTime&&(s=s.filter(n=>n.timestamp>=e.startTime)),e.endTime&&(s=s.filter(n=>n.timestamp<=e.endTime)),e.limit&&(s=s.slice(0,e.limit)),{trades:s,totalCount:s.length,raw:r}}async connectWebSocket(){if(this.wsManager||(this.wsManager=new ae(this._wsEndpoint)),this.wsManager.isConnectedNow()){console.log("[WebSocket] Already connected");return}await this.wsManager.connect();}disconnectWebSocket(){this.wsManager&&(this.wsManager.disconnect(),this.wsManager=null);}subscribeMarketData(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");return this.wsManager.subscribe(e,r,s)}subscribeCandles(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");let n=`${e}:${r}`;return this.wsManager.subscribe("candle",n,s)}subscribeUserData(e,r,s){if(!this.wsManager)throw new Error("WebSocket not connected. Call connectWebSocket() first.");let n=e==="fills"?"userFills":"userEvents";return this.wsManager.subscribe(n,r,s)}unsubscribe(e){this.wsManager&&this.wsManager.unsubscribe(e);}},V=class extends Error{constructor(r,s,n){super(r);this.statusCode=s;this.responseBody=n;this.name="HyperliquidApiError";}};var re=react.createContext({});function Xt({client:t,children:e}){return jsxRuntime.jsx(re.Provider,{value:{client:t},children:e})}function P(){let t=react.useContext(re);if(!t||!t.client)throw new Error("usePerpetualsClient must be used within a PerpetualsProvider");return t}function it(){return ["perps","coins"]}async function at(t){return await t.getSupportedCoins()}function be(t={}){let{client:e}=P();return reactQuery.useQuery({queryKey:it(),queryFn:async()=>at(e),staleTime:300*1e3,...t})}function lt(t){return ["perps","market",t.symbol]}async function ct(t,{symbol:e}){return await t.getMarket(e)}function se(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:lt(t),queryFn:async()=>ct(r,t),staleTime:10*1e3,...e})}function ut(t={}){return ["perps","markets",JSON.stringify((t.symbols??[]).sort())]}async function dt(t,{symbols:e}={}){return await t.getMarkets(e)}function he(t={},e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:ut(t),queryFn:async()=>dt(r,t),staleTime:10*1e3,...e})}function pt(t){return ["perps","klines",t.symbol,t.interval,String(t.limit??100)]}async function mt(t,{symbol:e,interval:r,limit:s}){return await t.getKlines(e,r,s)}function or(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:pt(t),queryFn:async()=>mt(r,t),staleTime:30*1e3,...e})}function ft(t){return ["perps","orderBook",t.symbol,String(t.maxLevel??20)]}async function yt(t,{symbol:e,maxLevel:r}){return await t.getOrderBook(e,r)}function xe(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:ft(t),queryFn:async()=>yt(r,t),staleTime:5*1e3,...e})}function gt(t){return ["perps","recentTrades",t.symbol,String(t.limit??50)]}async function bt(t,{symbol:e,limit:r}){return await t.getRecentTrades(e,r)}function Pe(t,e={}){let{client:r}=P();return reactQuery.useQuery({queryKey:gt(t),queryFn:async()=>bt(r,t),staleTime:5*1e3,...e})}function ht(t){return ["perps","positions",t.userAddress??"",t.symbol??""]}async function xt(t,e){return await t.getPositions(e)}function ve(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:ht(n),queryFn:async()=>xt(r,n),enabled:s&&!!n.userAddress,staleTime:10*1e3,...e})}function Pt(t){return ["perps","orders",t.userAddress??"",t.symbol??""]}async function vt(t,e){return await t.getOpenOrders(e)}function Se(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:Pt(n),queryFn:async()=>vt(r,n),enabled:s&&!!n.userAddress,staleTime:5*1e3,...e})}function St(t){return ["perps","trades",t.userAddress??"",t.symbol??"",String(t.limit??50),String(t.startTime??""),String(t.endTime??"")]}async function kt(t,e){return await t.getTrades(e)}function ke(t,e={}){let{client:r}=P(),{enabled:s=true,...n}=t;return reactQuery.useQuery({queryKey:St(n),queryFn:async()=>kt(r,n),enabled:s&&!!n.userAddress,staleTime:30*1e3,...e})}async function Ct(t,e){return await t.placeOrder(e)}function ne(t={}){let{client:e}=P();return reactQuery.useMutation({mutationFn:async r=>Ct(e,r),...t})}async function Nt(t,e){return await t.cancelOrder(e)}function Ce(t={}){let{client:e}=P();return reactQuery.useMutation({mutationFn:async r=>Nt(e,r),...t})}function _(t){let{type:e,symbol:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,u]=react.useState(null),d=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),u(null),f=n.subscribeMarketData(e,r,d);}catch(y){p&&(u(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,d]),{data:o,isConnected:a,error:c}}function br(t){let{symbol:e,interval:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,u]=react.useState(null),d=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),u(null),f=n.subscribeCandles(e,r,d);}catch(y){p&&(u(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,d]),{data:o,isConnected:a,error:c}}function oe(t){let{type:e,userAddress:r,enabled:s=true}=t,{client:n}=P(),[o,i]=react.useState(null),[a,l]=react.useState(false),[c,u]=react.useState(null),d=react.useCallback(f=>{i(f);},[]);return react.useEffect(()=>{if(!s||!r)return;let f=null,p=true;return (async()=>{try{if(await n.connectWebSocket(),!p)return;l(!0),u(null),f=n.subscribeUserData(e,r,d);}catch(y){p&&(u(y instanceof Error?y:new Error("Connection failed")),l(false));}})(),()=>{if(p=false,f)try{n.unsubscribe(f);}catch(y){console.error("Failed to unsubscribe:",y);}n.disconnectWebSocket(),l(false),i(null);}},[n,e,r,s,d]),{data:o,isConnected:a,error:c}}function Te(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center px-4 py-3 bg-neutral-900 border-b border-neutral-800",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"Market data not available"})})}function Ue(){return jsxRuntime.jsxs("div",{className:"flex items-center gap-6 px-4 py-3 bg-neutral-900 border-b border-neutral-800",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-3",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-6 w-20 rounded"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-8 w-28 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]})]}),jsxRuntime.jsx("div",{className:"h-8 w-px bg-neutral-800"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-6 text-sm",children:[jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-20 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-20 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-24 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col gap-1",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-32 rounded"}),jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-16 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-5 w-20 rounded"})]})]})]})]})}function Me(t){let[e,r]=react.useState(),[s,n]=react.useState(0),{data:o,isPending:i}=se({symbol:t}),{data:a,isConnected:l}=_({type:"ticker",symbol:t,enabled:!!o});return react.useEffect(()=>{o&&r(o);},[o]),react.useEffect(()=>{if(!a)return;let c=Pr(a,t);c&&r(u=>vr(u??o??void 0,c,t));},[a,o,t]),react.useEffect(()=>{let c=()=>{let d=Date.now(),f=480*60*1e3,p=d%f,g=f-p;return Math.floor(g/1e3)};n(c());let u=setInterval(()=>{n(c());},1e3);return ()=>clearInterval(u)},[]),{marketData:e,isLoading:i,fundingCountdown:s}}function Pr(t,e){if(Array.isArray(t)){let r=t.find(s=>!s||typeof s!="object"?false:s.symbol===e);return r&&typeof r=="object"?r:null}return t&&typeof t=="object"?t:null}function j(t,e){return typeof t=="number"&&Number.isFinite(t)?t:e}function vr(t,e,r){return {symbol:e.symbol??t?.symbol??r,price:j(e.price,t?.price??0),change24h:j(e.change24h,t?.change24h??0),volume24h:j(e.volume24h,t?.volume24h??0),fundingRate:j(e.fundingRate,t?.fundingRate??0),openInterest:j(e.openInterest,t?.openInterest??0),markPrice:j(e.markPrice,t?.markPrice??0),indexPrice:typeof e.indexPrice=="number"&&Number.isFinite(e.indexPrice)?e.indexPrice:t?.indexPrice,high24h:typeof e.high24h=="number"&&Number.isFinite(e.high24h)?e.high24h:t?.high24h,low24h:typeof e.low24h=="number"&&Number.isFinite(e.low24h)?e.low24h:t?.low24h}}function Sr(t){let e=Math.floor(t/3600),r=Math.floor(t%3600/60),s=t%60;return `${String(e).padStart(2,"0")}:${String(r).padStart(2,"0")}:${String(s).padStart(2,"0")}`}function Tt(t,e=2){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e9?`$${(t/1e9).toFixed(e)}B`:t>=1e6?`$${(t/1e6).toFixed(e)}M`:t>=1e3?`$${(t/1e3).toFixed(e)}K`:`$${t.toFixed(e)}`}function Ut(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e3?t.toLocaleString("en-US",{minimumFractionDigits:0,maximumFractionDigits:0}):t>=1?t.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:4}):t.toFixed(6)}function Ie({marketData:t,fundingCountdown:e}){let{symbol:r,price:s,change24h:n,indexPrice:o,volume24h:i,openInterest:a,fundingRate:l}=t,c=typeof n=="number"&&Number.isFinite(n)?n:0,u=typeof l=="number"&&Number.isFinite(l)?l:0,d=c>=0,f=c.toFixed(2);return jsxRuntime.jsxs("div",{className:"flex items-center px-4",style:{minHeight:64,maxHeight:64,gap:16},children:[jsxRuntime.jsxs("div",{className:"flex items-baseline",style:{gap:8},children:[jsxRuntime.jsx("span",{style:{fontSize:18,fontWeight:500,lineHeight:"23px",letterSpacing:"-0.36px",color:"#ffffff"},children:Ut(s)}),jsxRuntime.jsxs("span",{style:{fontSize:12,fontWeight:400,lineHeight:"16px",color:d?"#C7FF2E":"#F76816"},children:[d?"+":"",f,"%"]})]}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:16},children:[jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#b5b5b5",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Oracle Price"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#ffffff"},children:o?Ut(o):"-"})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#b5b5b5",lineHeight:"16px",letterSpacing:"-0.12px"},children:"24h Volume"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#ffffff"},children:Tt(i,0)})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#b5b5b5",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Open Interest"}),jsxRuntime.jsx("span",{style:{fontSize:13,fontWeight:400,lineHeight:"17px",color:"#ffffff"},children:Tt(a*(t.markPrice||s))})]}),jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#b5b5b5",lineHeight:"16px",letterSpacing:"-0.12px"},children:"Funding / Countdown"}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:8},children:[jsxRuntime.jsxs("span",{style:{fontSize:13,lineHeight:"17px",color:u>=0?"#C7FF2E":"#F76816"},children:[(u*100).toFixed(5),"%"]}),jsxRuntime.jsx("span",{style:{fontSize:13,lineHeight:"17px",color:"#ffffff"},children:Sr(e)})]})]})]})]})}function kr({symbol:t}){let{marketData:e,isLoading:r,fundingCountdown:s}=Me(t);return r?jsxRuntime.jsx(Ue,{}):e?jsxRuntime.jsx(Ie,{marketData:e,fundingCountdown:s}):jsxRuntime.jsx(Te,{})}function Ee({onSelectCoin:t}={}){let[e,r]=react.useState(""),[s,n]=react.useState([]),{data:o,isPending:i}=be(),{data:a,isPending:l}=he({symbols:o},{enabled:!!o&&o.length>0});react.useEffect(()=>{a&&n(a);},[a]);let c=react.useMemo(()=>{if(!e.trim())return s;let d=e.toLowerCase().trim();return s.filter(f=>f.symbol.toLowerCase().includes(d))},[s,e]);return {coins:s,isLoading:i||l,searchQuery:e,setSearchQuery:r,filteredCoins:c,handleSelectCoin:d=>{t?.(d);}}}function Mt(t,e=2){return t>=1e9?`$${(t/1e9).toFixed(e)}B`:t>=1e6?`$${(t/1e6).toFixed(e)}M`:t>=1e3?`$${(t/1e3).toFixed(e)}K`:`$${t.toFixed(e)}`}function Or(t){return t>=1e3?t.toFixed(2):t>=1?t.toFixed(4):t.toFixed(6)}function Re({coins:t,searchQuery:e,onSearchChange:r,onSelectCoin:s,isLoading:n}){return jsxRuntime.jsxs("div",{className:"flex flex-col",style:{backgroundColor:"#1A1A1A",flex:"1 1 0",minHeight:0},children:[jsxRuntime.jsx("div",{style:{padding:"16px 16px 12px"},children:jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:32,border:"1px solid #2a2a2a",borderRadius:4,padding:"0 6px 0 12px",gap:8},children:[jsxRuntime.jsx(ui.SearchIcon,{className:"flex-shrink-0",style:{width:14,height:14,color:"#6b6b6b"}}),jsxRuntime.jsx("input",{type:"text",placeholder:"Search coins...",value:e,onChange:o=>r(o.target.value),className:"flex-1 bg-transparent outline-none",style:{fontSize:12,color:"#ffffff",border:"none"}})]})}),jsxRuntime.jsxs("div",{className:"flex-1 overflow-auto",children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:28,padding:"0 16px",borderBottom:"1px solid rgba(42,42,42,0.5)",position:"sticky",top:0,backgroundColor:"#1A1A1A",zIndex:1},children:[jsxRuntime.jsx("span",{style:{flex:"0 0 140px",fontSize:12,color:"#6b6b6b"},children:"Token"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#6b6b6b",textAlign:"right"},children:"Last Price"}),jsxRuntime.jsx("span",{style:{flex:"0 0 120px",fontSize:12,color:"#6b6b6b",textAlign:"right"},children:"24h Change"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#6b6b6b",textAlign:"right"},children:"8h Funding"}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#6b6b6b",textAlign:"right"},children:"24h Volume"}),jsxRuntime.jsx("span",{style:{flex:"1",fontSize:12,color:"#6b6b6b",textAlign:"right"},children:"Open Interest"})]}),n?jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:100},children:jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:"Loading..."})}):t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:100},children:jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:e?"No coins found":"No coins available"})}):t.map(o=>{let i=o.change24h>=0,a=o.change24h.toFixed(2),l=(o.fundingRate*100).toFixed(4),c=o.fundingRate>=0,u=o.symbol.split("-")[0];return jsxRuntime.jsxs("div",{className:"flex items-center cursor-pointer transition-colors",style:{height:36,padding:"0 16px",borderBottom:"1px solid rgba(42,42,42,0.5)"},onClick:()=>s(o.symbol),onMouseEnter:d=>{d.currentTarget.style.backgroundColor="rgba(255,255,255,0.03)";},onMouseLeave:d=>{d.currentTarget.style.backgroundColor="transparent";},children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{flex:"0 0 140px",gap:8},children:[jsxRuntime.jsx("img",{src:`https://app.hyperliquid.xyz/coins/${u}.svg`,alt:u,className:"rounded-full",style:{width:20,height:20},onError:d=>{let f=d.target;f.style.display="none";}}),jsxRuntime.jsx("span",{style:{fontSize:12,fontWeight:500,color:"#ffffff"},children:u})]}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#ffffff",textAlign:"right"},children:Or(o.price)}),jsxRuntime.jsxs("span",{style:{flex:"0 0 120px",fontSize:12,fontWeight:500,color:i?"#C7FF2E":"#F76816",textAlign:"right"},children:[i?"+":"",a,"%"]}),jsxRuntime.jsxs("span",{style:{flex:"0 0 100px",fontSize:12,color:c?"#C7FF2E":"#F76816",textAlign:"right"},children:[l,"%"]}),jsxRuntime.jsx("span",{style:{flex:"0 0 100px",fontSize:12,color:"#b5b5b5",textAlign:"right"},children:Mt(o.volume24h)}),jsxRuntime.jsx("span",{style:{flex:"1",fontSize:12,color:"#b5b5b5",textAlign:"right"},children:Mt(o.openInterest*o.price)})]},o.symbol)})]})]})}function Tr({onSelectCoin:t,className:e}){let{filteredCoins:r,isLoading:s,searchQuery:n,setSearchQuery:o,handleSelectCoin:i}=Ee({onSelectCoin:t});return jsxRuntime.jsx("div",{className:e,style:{display:"flex",flexDirection:"column",flex:"1 1 0",minHeight:0,overflow:"hidden"},children:jsxRuntime.jsx(Re,{coins:r,searchQuery:n,onSearchChange:o,onSelectCoin:i,isLoading:s})})}function Et(t,e){if(e<=0)return t;let r=new Map;return t.forEach(s=>{let n=Math.floor(s.price/e)*e,o=r.get(n);o?(o.quantity+=s.quantity,s.count&&(o.count=(o.count||0)+s.count)):r.set(n,{price:n,quantity:s.quantity,count:s.count});}),Array.from(r.values())}function Rt(t){let e=0,r=t.map(n=>{let o=n.quantity*n.price;return e+=o,{...n,quantity:o,total:e,percentage:0}}),s=e;return r.map(n=>({...n,percentage:s>0?n.total/s*100:0}))}function ze({symbol:t,maxLevel:e=20,precision:r=.01}){let[s,n]=react.useState(null),[o,i]=react.useState(r),{data:a,isPending:l}=xe({symbol:t,maxLevel:e}),{data:c}=_({type:"orderBook",symbol:t,enabled:!!a});return react.useEffect(()=>{c?n(c):a&&n(a);},[c,a]),{...react.useMemo(()=>{if(!s)return {bids:[],asks:[],spread:0,spreadPercentage:0};let d=Et(s.bids,o),f=Et(s.asks,o),p=d.sort((H,E)=>E.price-H.price).slice(0,e),g=f.sort((H,E)=>H.price-E.price).slice(0,e),y=Rt(p),N=Rt(g),x=y[0]?.price||0,I=(N[0]?.price||0)-x,W=x>0?I/x*100:0;return {bids:y,asks:N,spread:I,spreadPercentage:W}},[s,o,e]),isLoading:l,precision:o,setPrecision:i}}function Mr(t){return t>=1e3?t.toLocaleString("en-US",{minimumFractionDigits:0,maximumFractionDigits:0}):t>=1?t.toLocaleString("en-US",{minimumFractionDigits:2,maximumFractionDigits:4}):t.toFixed(6)}function zt(t){return Math.round(t).toLocaleString("en-US")}function Qt({price:t,quantity:e,total:r,percentage:s,side:n,onClick:o}){let i=n==="ask";return jsxRuntime.jsxs("div",{className:"relative flex items-center cursor-pointer hover:bg-white/5 transition-colors",style:{height:22,minHeight:22,maxHeight:22,padding:"0 16px",gap:16,fontSize:11},onClick:o,children:[jsxRuntime.jsx("div",{className:"absolute left-0 top-0",style:{height:20,width:`${s}%`,background:i?"linear-gradient(to right, rgba(247,104,22,0), #F76816)":"linear-gradient(to right, rgba(199,255,46,0), #C7FF2E)",opacity:.15}}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center",style:{flex:"1 1 0%"},children:jsxRuntime.jsx("span",{style:{color:i?"#F76816":"#C7FF2E",fontWeight:400},children:Mr(t)})}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center justify-end",style:{flex:"1 1 0%",color:"#ffffff"},children:zt(e)}),jsxRuntime.jsx("div",{className:"relative z-10 flex items-center justify-end",style:{flex:"1 1 0%",color:"#ffffff"},children:zt(r)})]})}function Qe({bids:t,asks:e,spread:r,spreadPercentage:s,onPriceClick:n}){let o=[...e].reverse();return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{backgroundColor:"#000000",fontSize:11},children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{height:28,minHeight:28,padding:"0 16px",gap:16,color:"#6b6b6b",fontSize:11},children:[jsxRuntime.jsx("div",{className:"flex items-center",style:{flex:"1 1 0%"},children:"Price"}),jsxRuntime.jsx("div",{className:"flex items-center justify-end",style:{flex:"1 1 0%"},children:"Amount (USD)"}),jsxRuntime.jsx("div",{className:"flex items-center justify-end",style:{flex:"1 1 0%"},children:"Total (USD)"})]}),jsxRuntime.jsx("div",{className:"flex-1 flex flex-col-reverse overflow-hidden",children:o.map((i,a)=>jsxRuntime.jsx(Qt,{price:i.price,quantity:i.quantity,total:i.total,percentage:i.percentage,side:"ask",onClick:()=>n?.(i.price)},`ask-${i.price}-${a}`))}),jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{height:24,minHeight:24,padding:"0 16px",backgroundColor:"rgba(26,26,26,0.5)"},children:jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:12,fontSize:12,color:"#ffffff"},children:[jsxRuntime.jsx("span",{style:{color:"#ffffff"},children:"Spread:"}),jsxRuntime.jsx("button",{type:"button",className:"hover:text-white transition-colors cursor-pointer",style:{color:"#ffffff",fontWeight:400,background:"none",border:"none",padding:0},onClick:()=>n?.(r),children:r>=1?Math.round(r).toLocaleString("en-US"):r.toFixed(4)}),jsxRuntime.jsxs("span",{style:{color:"#ffffff",fontWeight:500},children:[s.toFixed(3),"%"]})]})}),jsxRuntime.jsx("div",{className:"flex-1 overflow-hidden",children:t.map((i,a)=>jsxRuntime.jsx(Qt,{price:i.price,quantity:i.quantity,total:i.total,percentage:i.percentage,side:"bid",onClick:()=>n?.(i.price)},`bid-${i.price}-${a}`))})]})}function Ir(){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{padding:"0 16px"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:28,marginBottom:4},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]}),Array.from({length:10}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]},`ask-skeleton-${e}`)),jsxRuntime.jsx("div",{className:"flex justify-center items-center",style:{height:28},children:jsxRuntime.jsx(ui.Skeleton,{className:"h-4 w-32 rounded"})}),Array.from({length:10}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"})]},`bid-skeleton-${e}`))]})}function Dr(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-full",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"No order book data available"})})}function Er({symbol:t,maxLevel:e=20,onPriceClick:r,className:s}){let{bids:n,asks:o,spread:i,spreadPercentage:a,isLoading:l}=ze({symbol:t,maxLevel:e});return l?jsxRuntime.jsx(Ir,{}):n.length===0&&o.length===0?jsxRuntime.jsx(Dr,{}):jsxRuntime.jsx("div",{className:s,children:jsxRuntime.jsx(Qe,{bids:n,asks:o,spread:i,spreadPercentage:a,onPriceClick:r})})}function qe({symbol:t,limit:e=50}){let[r,s]=react.useState([]),{data:n,isPending:o}=Pe({symbol:t,limit:e}),{data:i}=_({type:"trades",symbol:t,enabled:!!n});return react.useEffect(()=>{n&&s(n.filter(At));},[n]),react.useEffect(()=>{i&&s(a=>{let l=zr(i);if(l.length===0)return a;let c=l.filter(d=>!a.some(f=>f.timestamp===d.timestamp&&f.price===d.price&&f.quantity===d.quantity));return c.length===0?a:[...c,...a].slice(0,e)});},[i,e]),{trades:r,isLoading:o}}function zr(t){return (Array.isArray(t)?t:[t]).filter(At)}function At(t){return t?typeof t.symbol=="string"&&(t.side==="buy"||t.side==="sell")&&typeof t.price=="number"&&Number.isFinite(t.price)&&typeof t.quantity=="number"&&Number.isFinite(t.quantity)&&typeof t.timestamp=="number"&&Number.isFinite(t.timestamp):false}function Qr(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e3?t.toFixed(2):t>=1?t.toFixed(4):t.toFixed(6)}function Bt(t){return typeof t!="number"||!Number.isFinite(t)?"-":t>=1e6?(t/1e6).toFixed(2)+"M":t>=1e3?(t/1e3).toFixed(2)+"K":t.toFixed(2)}function qr(t){if(typeof t!="number"||!Number.isFinite(t))return "-";let e=new Date(t),r=String(e.getHours()).padStart(2,"0"),s=String(e.getMinutes()).padStart(2,"0"),n=String(e.getSeconds()).padStart(2,"0");return `${r}:${s}:${n}`}function Be({trades:t,onTradeClick:e}){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full overflow-auto",style:{backgroundColor:"#000000",fontSize:11},children:[jsxRuntime.jsxs("div",{className:"sticky top-0 z-10 flex items-center",style:{height:28,minHeight:28,padding:"0 16px",gap:16,color:"#6b6b6b",fontSize:11},children:[jsxRuntime.jsx("div",{className:"flex-1",style:{maxWidth:100},children:"Price"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",children:"Amount"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:100},children:"Total"}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:70},children:"Time"})]}),jsxRuntime.jsx("div",{className:"flex-1",children:t.map((r,s)=>{let n=r.side==="buy",o=typeof r.price=="number"&&Number.isFinite(r.price)&&typeof r.quantity=="number"&&Number.isFinite(r.quantity)?r.price*r.quantity:void 0;return jsxRuntime.jsxs("div",{className:"flex items-center cursor-pointer hover:bg-white/5 transition-colors",style:{height:22,minHeight:22,maxHeight:22,padding:"0 16px",gap:16,fontSize:11},onClick:()=>e?.(r),children:[jsxRuntime.jsx("div",{className:"flex-1",style:{maxWidth:100},children:jsxRuntime.jsx("span",{style:{color:n?"#C7FF2E":"#F76816",fontWeight:400},children:Qr(r.price)})}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{color:"#ffffff"},children:Bt(r.quantity)}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:100,color:"#ffffff"},children:Bt(o)}),jsxRuntime.jsx("div",{className:"flex-1 text-right",style:{maxWidth:70,color:"#b5b5b5"},children:qr(r.timestamp)})]},`${r.timestamp}-${r.price}-${s}`)})})]})}function Ar(){return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{padding:"0 16px"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:28,marginBottom:4},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"})]}),Array.from({length:12}).map((t,e)=>jsxRuntime.jsxs("div",{className:"flex justify-between items-center",style:{height:22},children:[jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-14 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-10 rounded"}),jsxRuntime.jsx(ui.Skeleton,{className:"h-3 w-12 rounded"})]},`trade-skeleton-${e}`))]})}function Br(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-full",children:jsxRuntime.jsx("span",{className:"text-neutral-400 text-sm",children:"No recent trades"})})}function Lr({symbol:t,limit:e=50,onTradeClick:r,className:s}){let{trades:n,isLoading:o}=qe({symbol:t,limit:e});return o?jsxRuntime.jsx(Ar,{}):n.length===0?jsxRuntime.jsx(Br,{}):jsxRuntime.jsx("div",{className:s,children:jsxRuntime.jsx(Be,{trades:n,onTradeClick:r})})}function We({symbol:t,userAddress:e,maxLeverage:r=150,onSuccess:s,onError:n}){let[o,i]=react.useState("long"),[a,l]=react.useState("market"),c=reactHookForm.useForm({defaultValues:{amount:0,leverage:20,takeProfitPrice:void 0,takeProfitPercent:void 0,stopLossPrice:void 0,stopLossPercent:void 0}}),{data:u}=se({symbol:t}),{mutateAsync:d,isPending:f}=ne({onSuccess:()=>{c.reset(),s?.();},onError:k=>{n?.(k);}}),p=c.watch(),{amount:g,leverage:y,price:N}=p,x=react.useMemo(()=>a==="limit"&&N?N:u?.price||0,[a,N,u?.price]),A=react.useMemo(()=>!g||!x?0:g*x*5e-4,[g,x]),I=react.useMemo(()=>!g||!x?0:g*x+A,[g,x,A]),W=react.useMemo(()=>{if(!g||!x||!y||y===1)return;let k=.005,G=x;return o==="long"?G*(1-(1/y-k)):G*(1+(1/y-k))},[g,x,y,o]),H=1e4,E=1e4,me=0,C=react.useCallback(async k=>{if(!e)throw new Error("User address is required");let G=a==="limit"?k.price:void 0,fe=k.takeProfitPrice,ye=k.stopLossPrice;if(!fe&&k.takeProfitPercent&&k.takeProfitPercent>0&&x){let te=k.takeProfitPercent/100;fe=o==="long"?x*(1+te):x*(1-te);}if(!ye&&k.stopLossPercent&&k.stopLossPercent>0&&x){let te=k.stopLossPercent/100;ye=o==="long"?x*(1-te):x*(1+te);}await d({symbol:t,side:o,orderType:a,amount:k.amount,price:G,leverage:k.leverage,takeProfitPrice:fe,stopLossPrice:ye,userAddress:e});},[t,o,a,x,e,d]);return {form:c,side:o,orderType:a,setSide:i,setOrderType:l,handleSubmit:C,isSubmitting:f,currentPrice:x,estimatedFee:A,estimatedTotal:I,liquidationPrice:W,availableMargin:H,accountValue:E,currentPosition:me,maxLeverage:r}}function ue(t,e=2){return t.toFixed(e)}function _r({leverage:t,maxLeverage:e,onLeverageChange:r,onClose:s}){let n=[1,2,3,5,10,20,25,50,100].filter(o=>o<=e);return jsxRuntime.jsxs("div",{className:"fixed inset-0 z-50 flex items-center justify-center",children:[jsxRuntime.jsx("div",{className:"absolute inset-0 bg-black/60",onClick:s,onKeyDown:o=>o.key==="Escape"&&s(),role:"button",tabIndex:-1,"aria-label":"Close"}),jsxRuntime.jsxs("div",{className:"relative z-10 w-72 bg-neutral-900 border border-neutral-700 rounded-lg p-4 shadow-2xl",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between mb-4",children:[jsxRuntime.jsx("h3",{className:"text-sm font-medium text-white",children:"Adjust Leverage"}),jsxRuntime.jsx("button",{type:"button",onClick:s,className:"text-neutral-400 hover:text-white",children:jsxRuntime.jsx("svg",{className:"w-4 h-4",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:jsxRuntime.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M6 18L18 6M6 6l12 12"})})})]}),jsxRuntime.jsxs("div",{className:"text-center text-2xl font-bold text-white mb-4",children:[t,"x"]}),jsxRuntime.jsx(ui.Slider,{value:[t],onChange:o=>r(Array.isArray(o)?o[0]:o),minValue:1,maxValue:e,step:1,className:"w-full mb-3"}),jsxRuntime.jsx("div",{className:"flex flex-wrap gap-1.5",children:n.map(o=>jsxRuntime.jsxs("button",{type:"button",className:ui.cn("px-2.5 py-1 text-xs rounded transition-colors",t===o?"bg-green-600 text-white":"bg-neutral-800 text-neutral-400 hover:bg-neutral-700"),onClick:()=>r(o),children:[o,"x"]},o))}),jsxRuntime.jsx("button",{type:"button",className:"w-full mt-4 text-white h-9 rounded cursor-pointer transition-colors",style:{backgroundColor:"#C7FF2E"},onClick:s,children:"Confirm"})]})]})}function He({methods:t,side:e,orderType:r,onSideChange:s,onOrderTypeChange:n,onSubmit:o,isSubmitting:i,symbol:a,currentPrice:l,estimatedFee:c,liquidationPrice:u,availableMargin:d,accountValue:f,currentPosition:p,maxLeverage:g}){let[y,N]=react.useState(false),[x,A]=react.useState(false),I=t.watch("leverage")||20,W=t.watch("amount")||0,H=a.split("-")[0],E=d>0&&l?Math.min(W*l/(d*I)*100,100):0,me=C=>{let k=(Array.isArray(C)?C[0]:C)/100;if(l&&l>0){let G=d*I*k/l;t.setValue("amount",Number(G.toFixed(6)));}};return jsxRuntime.jsxs("div",{className:"flex flex-col h-full",style:{backgroundColor:"#000000"},children:[jsxRuntime.jsxs("div",{className:"perp-order-form flex-1 overflow-y-auto",style:{padding:"16px 16px",display:"flex",flexDirection:"column",gap:16},children:[jsxRuntime.jsxs("div",{className:"flex",style:{border:"1px solid rgba(26,26,26,0.5)",borderRadius:8,padding:4,gap:4},children:[jsxRuntime.jsx("button",{type:"button",className:"flex-1 cursor-pointer transition-colors",style:{height:32,fontSize:16,borderRadius:4,backgroundColor:e==="long"?"#C7FF2E":"transparent",color:e==="long"?"#000000":"#b5b5b5",fontWeight:e==="long"?700:500},onClick:()=>s("long"),children:"Long"}),jsxRuntime.jsx("button",{type:"button",className:"flex-1 cursor-pointer transition-colors",style:{height:32,fontSize:16,borderRadius:4,backgroundColor:e==="short"?"#F76816":"transparent",color:e==="short"?"#000000":"#b5b5b5",fontWeight:e==="short"?700:500},onClick:()=>s("short"),children:"Short"})]}),jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:8},children:[jsxRuntime.jsx("div",{className:"flex",children:[{key:"market",label:"Market"},{key:"limit",label:"Limit"}].map(C=>jsxRuntime.jsx("div",{style:{height:32,display:"flex",alignItems:"center",borderBottom:r===C.key?"2px solid #ffffff":"2px solid transparent",padding:"2px 0 0",cursor:"pointer"},children:jsxRuntime.jsx("button",{type:"button",className:"cursor-pointer transition-colors",style:{padding:"0 8px",fontSize:12,fontWeight:500,backgroundColor:"transparent",color:r===C.key?"#ffffff":"#b5b5b5",border:"none"},onClick:()=>n(C.key),children:C.label})},C.key))}),jsxRuntime.jsx("div",{className:"flex-1"}),jsxRuntime.jsxs("button",{type:"button",className:"cursor-pointer transition-colors",style:{height:24,padding:"0 5px",fontSize:12,borderRadius:4,backgroundColor:"rgba(26,26,26,0.5)",color:"#ffffff",fontWeight:400,border:"1px solid rgba(26,26,26,0.5)"},onClick:()=>N(true),children:["Leverage: ",I,"x"]})]}),jsxRuntime.jsx(ui.RHForm,{methods:t,onSubmit:o,children:jsxRuntime.jsxs("div",{className:"space-y-3 w-full",children:[r==="limit"&&jsxRuntime.jsxs("div",{className:"perp-price-box",style:{borderRadius:4,padding:8,backgroundColor:"rgba(26,26,26,0.5)",border:"1px solid #1c1c1c",height:64,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:"Price"}),jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:"USDC"})]}),jsxRuntime.jsx(ui.RHNumberInput,{name:"price",placeholder:"0.0 USDC",className:"w-full"})]}),jsxRuntime.jsxs("div",{className:"perp-buy-amt",style:{borderRadius:4,padding:8,backgroundColor:"rgba(26,26,26,0.5)",border:"1px solid #1c1c1c",height:64,display:"flex",flexDirection:"column",justifyContent:"center"},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:"Buy Amount"}),jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b"},children:H})]}),jsxRuntime.jsx(ui.RHNumberInput,{name:"amount",placeholder:"0.0 USDC",className:"w-full"})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx("style",{children:`
|
|
2
2
|
.perp-buy-amt input, .perp-price-box input { font-size: 18px !important; line-height: 23px !important; }
|
|
3
3
|
.perp-order-form .group,
|
|
4
4
|
.perp-order-form .group div { background: transparent !important; border: none !important; padding: 0 !important; border-radius: 0 !important; min-height: 0 !important; height: auto !important; }
|
|
5
|
-
.perp-order-form .group input { color: #
|
|
5
|
+
.perp-order-form .group input { color: #ffffff !important; }
|
|
6
6
|
.perp-slider { -webkit-appearance: none; appearance: none; background: transparent; cursor: pointer; width: 100%; height: 16px; }
|
|
7
|
-
.perp-slider::-webkit-slider-runnable-track { height: 4px; border-radius: 2px; background: #
|
|
8
|
-
.perp-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #
|
|
9
|
-
.perp-slider::-moz-range-track { height: 4px; border-radius: 2px; background: #
|
|
10
|
-
.perp-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: #
|
|
11
|
-
`}),jsxRuntime.jsx("input",{type:"range",value:Math.round(R),onChange:C=>me(Number(C.target.value)),min:0,max:100,step:1,className:"perp-slider"}),jsxRuntime.jsxs("div",{className:"flex justify-between",style:{fontSize:10,color:"#c8c9d1",marginTop:4},children:[jsxRuntime.jsx("span",{children:"0%"}),jsxRuntime.jsx("span",{children:"25%"}),jsxRuntime.jsx("span",{children:"50%"}),jsxRuntime.jsx("span",{children:"75%"}),jsxRuntime.jsx("span",{children:"100%"})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:6},children:[jsxRuntime.jsx("div",{onClick:()=>B(C=>!C),style:{width:16,height:16,borderRadius:4,border:"1px solid #323542",backgroundColor:h?"#2fe3ac":"transparent",flexShrink:0,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center"},children:h&&jsxRuntime.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",children:jsxRuntime.jsx("path",{d:"M1 4L3.5 6.5L9 1",stroke:"#090909",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),jsxRuntime.jsx("span",{style:{fontSize:12,fontWeight:500,color:"#c8c9d1"},children:"TP/SL"})]}),jsxRuntime.jsxs("div",{style:{fontSize:12,color:"#777a8c"},children:[jsxRuntime.jsx("span",{children:"Est. Liq. Price: "}),jsxRuntime.jsx("span",{style:{color:"#c8c9d1"},children:d?de(d,2):"--"})]})]}),h&&jsxRuntime.jsxs("div",{className:"flex",style:{gap:8},children:[jsxRuntime.jsxs("div",{className:"flex-1",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c",marginBottom:2,display:"block"},children:"TP Price"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"takeProfitPrice",placeholder:"Enter TP price",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #22242d",borderRadius:4}})]}),jsxRuntime.jsxs("div",{style:{width:70},children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c",marginBottom:2,display:"block"},children:"TP %"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"takeProfitPercent",placeholder:"0.0",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #22242d",borderRadius:4}})]})]}),jsxRuntime.jsx("button",{type:"button",className:"w-full cursor-pointer transition-colors",style:{height:36,fontSize:14,fontWeight:700,color:"#06070b",backgroundColor:"#2fe3ac",borderRadius:9999,border:"none"},children:"Add More Funds"}),h&&jsxRuntime.jsxs("div",{className:"flex",style:{gap:8},children:[jsxRuntime.jsxs("div",{className:"flex-1",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c",marginBottom:2,display:"block"},children:"SL Price"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"stopLossPrice",placeholder:"Enter SL price",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #22242d",borderRadius:4}})]}),jsxRuntime.jsxs("div",{style:{width:70},children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#777a8c",marginBottom:2,display:"block"},children:"SL %"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"stopLossPercent",placeholder:"0.0",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #22242d",borderRadius:4}})]})]})]})})]}),jsxRuntime.jsxs("div",{style:{padding:"10px 16px",fontSize:12,display:"flex",flexDirection:"column",gap:6},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{color:"#777a8c"},children:"Available Margin"}),jsxRuntime.jsxs("span",{style:{color:"#6683ff",fontSize:12,fontWeight:500},children:[de(u)," USDC"]})]}),jsxRuntime.jsxs("div",{className:"flex justify-between",children:[jsxRuntime.jsx("span",{style:{color:"#777a8c"},children:"Perps Account Value"}),jsxRuntime.jsxs("span",{style:{color:"#c8c9d1",fontSize:12},children:[de(f)," USDC"]})]}),jsxRuntime.jsxs("div",{className:"flex justify-between",children:[jsxRuntime.jsx("span",{style:{color:"#777a8c"},children:"Current Position"}),jsxRuntime.jsx("span",{style:{color:"#c8c9d1",fontSize:12},children:p?de(p):"--"})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-end",style:{gap:6,paddingTop:8},children:[jsxRuntime.jsx("span",{style:{fontSize:11,color:"#777a8c"},children:"powered by"}),jsxRuntime.jsx("img",{src:"https://axiom-assets.sfo3.cdn.digitaloceanspaces.com/images/hyperliquid-logo.svg",alt:"Hyperliquid",className:"h-3 opacity-60",onError:C=>{let k=C.target;k.style.display="none";}})]})]}),y&&jsxRuntime.jsx(_r,{leverage:I,maxLeverage:g,onLeverageChange:C=>t.setValue("leverage",C),onClose:()=>N(false)})]})}function Gr({symbol:t,userAddress:e,maxLeverage:r,onSuccess:s,onError:n,className:o}){let{form:i,side:a,orderType:l,setSide:c,setOrderType:d,handleSubmit:u,isSubmitting:f,currentPrice:p,estimatedFee:g,estimatedTotal:y,liquidationPrice:N,availableMargin:h,accountValue:B,currentPosition:I,maxLeverage:W}=We({symbol:t,userAddress:e,maxLeverage:r,onSuccess:s,onError:n});return jsxRuntime.jsx("div",{className:o,children:jsxRuntime.jsx(He,{methods:i,side:a,orderType:l,onSideChange:c,onOrderTypeChange:d,onSubmit:u,isSubmitting:f,symbol:t,currentPrice:p,estimatedFee:g,estimatedTotal:y,liquidationPrice:N,availableMargin:h,accountValue:B,currentPosition:I,maxLeverage:W})})}function $e({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s}){let[n,o]=react.useState([]),{data:i,isLoading:a,error:l}=ve({userAddress:t,symbol:e},{enabled:!!t}),{data:c}=oe({type:"positions",userAddress:t||"",enabled:!!t}),{mutateAsync:d,isPending:u}=ne({onSuccess:()=>{r?.();},onError:p=>{s?.(p);}});react.useEffect(()=>{i?.positions&&o(i.positions);},[i]),react.useEffect(()=>{c&&o(p=>{let g=p.findIndex(y=>y.symbol===c.symbol);if(c.quantity===0)return g!==-1?p.filter((y,N)=>N!==g):p;if(g!==-1){let y=[...p];return y[g]=c,y}return [...p,c]});},[c]);let f=react.useCallback(async p=>{if(!t)throw new Error("User address is required");let g=p.side==="long"?"short":"long";await d({symbol:p.symbol,side:g,orderType:"market",amount:Math.abs(p.quantity),leverage:p.leverage,userAddress:t});},[t,d]);return {positions:n,isLoading:a,error:l,handleClosePosition:f,isClosing:u}}function Y(t,e=2){return t.toFixed(e)}function Ke(t){return Y(t,4)}function Zr(t){return Y(Math.abs(t),4)}function es(t){return `${t>=0?"+":""}${Y(t,2)}`}function ts(t){return `${t>=0?"+":""}${Y(t,2)}%`}function Ve({positions:t,onClosePosition:e,isClosing:r}){let s=jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Position"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Position Value"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Entry Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Mark Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Liquidation"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Margin Used (PNL) \u2193"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"TP"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"SL"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#777a8c"},children:"Close"})]});return t.length===0?jsxRuntime.jsxs("div",{className:"w-full overflow-x-auto bg-transparent",children:[jsxRuntime.jsx("table",{className:"w-full",style:{fontSize:12},children:jsxRuntime.jsx("thead",{children:s})}),jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{fontSize:14,color:"#c8c9d1",padding:"24px 0"},children:"No open positions"})]}):jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:12},children:[jsxRuntime.jsx("thead",{children:s}),jsxRuntime.jsx("tbody",{children:t.map(n=>{let i=n.unrealizedPnl>=0?"text-green-500":"text-red-500";return jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{className:"font-medium",style:{color:"#fcfcfc"},children:n.symbol.split("-")[0]}),jsxRuntime.jsxs("span",{className:ui.cn(n.side==="long"?"text-green-500":"text-red-500"),children:[n.leverage,"x ",n.side.toUpperCase()]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:Zr(n.quantity)}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:["$",Y(n.notionalValue)]}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:["$",Ke(n.entryPrice)]}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:["$",Ke(n.markPrice)]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:n.liquidationPrice?`$${Ke(n.liquidationPrice)}`:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsxs("div",{className:"flex flex-col items-end",children:[jsxRuntime.jsxs("span",{style:{color:"#fcfcfc"},children:["$",Y(n.margin)]}),jsxRuntime.jsxs("span",{className:i,children:[es(n.unrealizedPnl)," (",ts(n.unrealizedPnlPercent),")"]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#c8c9d1"},children:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#c8c9d1"},children:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsx(ui.Button,{size:"sm",onClick:()=>e(n),isLoading:r,className:"bg-red-600 hover:bg-red-700 text-white text-xs px-3 py-1",children:"Close"})})]},n.symbol)})})]})})}function _e(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function rs(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:14,color:"#c8c9d1"},children:"No open positions"})}function ss({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s,className:n}){let{positions:o,isLoading:i,handleClosePosition:a,isClosing:l}=$e({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(_e,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Ve,{positions:o,onClosePosition:a,isClosing:l})})}function Ge({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s}){let[n,o]=react.useState([]),{data:i,isLoading:a,error:l}=Se({userAddress:t,symbol:e},{enabled:!!t}),{data:c}=oe({type:"orders",userAddress:t||"",enabled:!!t}),{mutateAsync:d,isPending:u}=Ce({onSuccess:()=>{r?.();},onError:p=>{s?.(p);}});react.useEffect(()=>{i?.orders&&o(i.orders);},[i]),react.useEffect(()=>{c&&o(p=>{let g=p.findIndex(y=>y.orderId===c.orderId);if(c.status==="cancelled"||c.status==="filled"||c.status==="rejected")return g!==-1?p.filter((y,N)=>N!==g):p;if(g!==-1){let y=[...p];return y[g]=c,y}return [c,...p]});},[c]);let f=react.useCallback(async p=>{if(!t)throw new Error("User address is required");await d({orderId:p.orderId,symbol:p.symbol,userAddress:t});},[t,d]);return {orders:n,isLoading:a,error:l,handleCancelOrder:f,isCanceling:u}}function _t(t,e=2){return t.toFixed(e)}function as(t){return _t(t,4)}function je(t){return _t(t,4)}function ls(t){let e=new Date(t),r=String(e.getHours()).padStart(2,"0"),s=String(e.getMinutes()).padStart(2,"0"),n=String(e.getSeconds()).padStart(2,"0");return `${r}:${s}:${n}`}function Je({orders:t,onCancelOrder:e,isCanceling:r}){return t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#c8c9d1"},children:"No open orders"}):jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:11},children:[jsxRuntime.jsx("thead",{children:jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Type"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Amount"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Filled"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Remaining"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Status"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Time"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Action"})]})}),jsxRuntime.jsx("tbody",{children:t.map(s=>jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{className:"font-medium",style:{color:"#fcfcfc"},children:s.symbol.split("-")[0]}),jsxRuntime.jsxs("span",{className:ui.cn(s.side==="long"?"text-green-500":"text-red-500"),children:[s.side.toUpperCase(),s.leverage?` ${s.leverage}x`:""]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 capitalize",style:{color:"#fcfcfc"},children:s.orderType}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:s.orderType==="market"?jsxRuntime.jsx("span",{style:{color:"#c8c9d1"},children:"Market"}):`$${as(s.price)}`}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:je(s.quantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:je(s.filledQuantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:je(s.remainingQuantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded","text-[11px]",s.status==="pending"&&"bg-yellow-600/20 text-yellow-500",s.status==="partially_filled"&&"bg-blue-600/20 text-blue-500",s.status==="filled"&&"bg-green-600/20 text-green-500",s.status==="cancelled"&&"bg-neutral-600/20 text-neutral-400",s.status==="rejected"&&"bg-red-600/20 text-red-500"),children:s.status.replace("_"," ")})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#c8c9d1"},children:ls(s.timestamp)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:s.status==="pending"||s.status==="partially_filled"?jsxRuntime.jsx(ui.Button,{size:"sm",onClick:()=>e(s),isLoading:r,className:"bg-red-600 hover:bg-red-700 text-white text-xs px-3 py-1",children:"Cancel"}):jsxRuntime.jsx("span",{className:"text-[11px]",style:{color:"#6b6d7a"},children:"-"})})]},s.orderId))})]})})}function Ye(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function Xe(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#c8c9d1"},children:"No open orders"})}function cs({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s,className:n}){let{orders:o,isLoading:i,handleCancelOrder:a,isCanceling:l}=Ge({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Ye,{})}):o.length===0?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Xe,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Je,{orders:o,onCancelOrder:a,isCanceling:l})})}function ds(t){let e=Date.now(),r=e;switch(t){case "today":let s=new Date;return s.setHours(0,0,0,0),{startTime:s.getTime(),endTime:r};case "7d":return {startTime:e-10080*60*1e3,endTime:r};case "30d":return {startTime:e-720*60*60*1e3,endTime:r};default:return {}}}function et({userAddress:t,symbol:e,initialTimeRange:r="7d",pageSize:s=50}){let[n,o]=react.useState(r),[i,a]=react.useState(1),[l,c]=react.useState([]),{startTime:d,endTime:u}=ds(n),{data:f,isLoading:p,error:g}=ke({userAddress:t,symbol:e,startTime:d,endTime:u,limit:1e3},{enabled:!!t});react.useEffect(()=>{f?.trades&&(c(f.trades),a(1));},[f]),react.useEffect(()=>{a(1);},[n]);let y=Math.ceil(l.length/s),N=(i-1)*s,h=N+s;return {trades:l.slice(N,h),isLoading:p,error:g,timeRange:n,setTimeRange:o,currentPage:i,totalPages:y,goToNextPage:()=>{i<y&&a(i+1);},goToPreviousPage:()=>{i>1&&a(i-1);},goToPage:R=>{R>=1&&R<=y&&a(R);}}}function tt(t,e=2){return t.toFixed(e)}function us(t){return tt(t,4)}function ps(t){return tt(t,4)}function ms(t){let e=new Date(t),r=String(e.getMonth()+1).padStart(2,"0"),s=String(e.getDate()).padStart(2,"0"),n=String(e.getHours()).padStart(2,"0"),o=String(e.getMinutes()).padStart(2,"0"),i=String(e.getSeconds()).padStart(2,"0");return `${r}/${s} ${n}:${o}:${i}`}var fs=[{label:"Today",value:"today"},{label:"7 Days",value:"7d"},{label:"30 Days",value:"30d"},{label:"All",value:"all"}];function rt({trades:t,timeRange:e,onTimeRangeChange:r,currentPage:s,totalPages:n,onNextPage:o,onPreviousPage:i,onGoToPage:a}){return jsxRuntime.jsxs("div",{className:"w-full flex flex-col gap-4",children:[jsxRuntime.jsx("div",{className:"flex gap-2",children:fs.map(l=>{let c=e===l.value;return jsxRuntime.jsx("button",{type:"button",className:ui.cn("rounded px-3 transition-colors",!c&&"hover:bg-[#1a1c24]"),style:{height:24,fontSize:11,border:"1px solid #22242d",backgroundColor:c?"#22242d":"transparent",color:c?"#fcfcfc":"#c8c9d1"},onClick:()=>r(l.value),children:l.label},l.value)})}),t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#c8c9d1"},children:"No trade history"}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:11},children:[jsxRuntime.jsx("thead",{children:jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Side"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Quantity"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Fee"}),jsxRuntime.jsx("th",{className:"text-center py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Maker/Taker"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#c8c9d1"},children:"Time"})]})}),jsxRuntime.jsx("tbody",{children:t.map(l=>jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #22242d"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3 font-medium",style:{color:"#fcfcfc"},children:l.symbol.split("-")[0]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded text-[11px]",l.side==="long"?"bg-green-600/20 text-green-500":"bg-red-600/20 text-red-500"),children:l.side.toUpperCase()})}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:["$",us(l.price)]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:ps(l.quantity)}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#fcfcfc"},children:[tt(l.fee,4)," ",l.feeCurrency]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-center",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded text-[11px]",l.isMaker?"bg-blue-600/20 text-blue-500":"bg-purple-600/20 text-purple-500"),children:l.isMaker?"Maker":"Taker"})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#c8c9d1"},children:ms(l.timestamp)})]},l.tradeId))})]})}),n>1&&jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"text-sm text-neutral-400",children:["Page ",s," of ",n]}),jsxRuntime.jsxs("div",{className:"flex gap-2",children:[jsxRuntime.jsx(ui.Button,{size:"sm",onClick:i,disabled:s===1,className:"bg-neutral-800 hover:bg-neutral-700 text-white disabled:opacity-50 disabled:cursor-not-allowed",children:"Previous"}),jsxRuntime.jsx("div",{className:"flex gap-1",children:Array.from({length:Math.min(5,n)},(l,c)=>{let d;return n<=5||s<=3?d=c+1:s>=n-2?d=n-4+c:d=s-2+c,jsxRuntime.jsx("button",{type:"button",className:ui.cn("w-8 h-8 text-sm rounded transition-colors",s===d?"bg-neutral-700 text-white":"text-neutral-400 hover:bg-neutral-800 hover:text-white"),onClick:()=>a(d),children:d},d)})}),jsxRuntime.jsx(ui.Button,{size:"sm",onClick:o,disabled:s===n,className:"bg-neutral-800 hover:bg-neutral-700 text-white disabled:opacity-50 disabled:cursor-not-allowed",children:"Next"})]})]})]})]})}function st(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function nt(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#c8c9d1"},children:"No trade history"})}function gs({userAddress:t,symbol:e,initialTimeRange:r="7d",pageSize:s=50,className:n}){let{trades:o,isLoading:i,timeRange:a,setTimeRange:l,currentPage:c,totalPages:d,goToNextPage:u,goToPreviousPage:f,goToPage:p}=et({userAddress:t,symbol:e,initialTimeRange:r,pageSize:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(st,{})}):o.length===0?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(nt,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(rt,{trades:o,timeRange:a,onTimeRangeChange:l,currentPage:c,totalPages:d,onNextPage:u,onPreviousPage:f,onGoToPage:p})})}
|
|
12
|
-
exports.CoinInfoNotFoundUI=Te;exports.CoinInfoSkeletonsUI=Ue;exports.CoinInfoUI=Ie;exports.CoinInfoWidget=kr;exports.HyperliquidApiError=V;exports.HyperliquidPerpetualsClient=ge;exports.OpenOrdersEmpty=Xe;exports.OpenOrdersSkeleton=Ye;exports.OpenOrdersUI=Je;exports.OpenOrdersWidget=cs;exports.OrderBookUI=Qe;exports.OrderBookWidget=
|
|
7
|
+
.perp-slider::-webkit-slider-runnable-track { height: 4px; border-radius: 2px; background: #1c1c1c; }
|
|
8
|
+
.perp-slider::-webkit-slider-thumb { -webkit-appearance: none; width: 12px; height: 12px; border-radius: 50%; background: #C7FF2E; margin-top: -4px; border: none; }
|
|
9
|
+
.perp-slider::-moz-range-track { height: 4px; border-radius: 2px; background: #1c1c1c; border: none; }
|
|
10
|
+
.perp-slider::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: #C7FF2E; border: none; }
|
|
11
|
+
`}),jsxRuntime.jsx("input",{type:"range",value:Math.round(E),onChange:C=>me(Number(C.target.value)),min:0,max:100,step:1,className:"perp-slider"}),jsxRuntime.jsxs("div",{className:"flex justify-between",style:{fontSize:10,color:"#b5b5b5",marginTop:4},children:[jsxRuntime.jsx("span",{children:"0%"}),jsxRuntime.jsx("span",{children:"25%"}),jsxRuntime.jsx("span",{children:"50%"}),jsxRuntime.jsx("span",{children:"75%"}),jsxRuntime.jsx("span",{children:"100%"})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"flex items-center",style:{gap:6},children:[jsxRuntime.jsx("div",{onClick:()=>A(C=>!C),style:{width:16,height:16,borderRadius:4,border:"1px solid #2a2a2a",backgroundColor:x?"#C7FF2E":"transparent",flexShrink:0,cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center"},children:x&&jsxRuntime.jsx("svg",{width:"10",height:"8",viewBox:"0 0 10 8",fill:"none",children:jsxRuntime.jsx("path",{d:"M1 4L3.5 6.5L9 1",stroke:"#000000",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})})}),jsxRuntime.jsx("span",{style:{fontSize:12,fontWeight:500,color:"#b5b5b5"},children:"TP/SL"})]}),jsxRuntime.jsxs("div",{style:{fontSize:12,color:"#6b6b6b"},children:[jsxRuntime.jsx("span",{children:"Est. Liq. Price: "}),jsxRuntime.jsx("span",{style:{color:"#b5b5b5"},children:u?ue(u,2):"--"})]})]}),x&&jsxRuntime.jsxs("div",{className:"flex",style:{gap:8},children:[jsxRuntime.jsxs("div",{className:"flex-1",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b",marginBottom:2,display:"block"},children:"TP Price"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"takeProfitPrice",placeholder:"Enter TP price",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #1c1c1c",borderRadius:4}})]}),jsxRuntime.jsxs("div",{style:{width:70},children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b",marginBottom:2,display:"block"},children:"TP %"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"takeProfitPercent",placeholder:"0.0",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #1c1c1c",borderRadius:4}})]})]}),jsxRuntime.jsx("button",{type:"button",className:"w-full cursor-pointer transition-colors",style:{height:36,fontSize:14,fontWeight:700,color:"#000000",backgroundColor:"#C7FF2E",borderRadius:9999,border:"none"},children:"Add More Funds"}),x&&jsxRuntime.jsxs("div",{className:"flex",style:{gap:8},children:[jsxRuntime.jsxs("div",{className:"flex-1",children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b",marginBottom:2,display:"block"},children:"SL Price"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"stopLossPrice",placeholder:"Enter SL price",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #1c1c1c",borderRadius:4}})]}),jsxRuntime.jsxs("div",{style:{width:70},children:[jsxRuntime.jsx("span",{style:{fontSize:12,color:"#6b6b6b",marginBottom:2,display:"block"},children:"SL %"}),jsxRuntime.jsx(ui.RHNumberInput,{name:"stopLossPercent",placeholder:"0.0",className:"w-full",style:{fontSize:12,height:32,padding:"0 8px",border:"1px solid #1c1c1c",borderRadius:4}})]})]})]})})]}),jsxRuntime.jsxs("div",{style:{padding:"10px 16px",fontSize:12,display:"flex",flexDirection:"column",gap:6},children:[jsxRuntime.jsxs("div",{className:"flex justify-between items-center",children:[jsxRuntime.jsx("span",{style:{color:"#6b6b6b"},children:"Available Margin"}),jsxRuntime.jsxs("span",{style:{color:"#C7FF2E",fontSize:12,fontWeight:500},children:[ue(d)," USDC"]})]}),jsxRuntime.jsxs("div",{className:"flex justify-between",children:[jsxRuntime.jsx("span",{style:{color:"#6b6b6b"},children:"Perps Account Value"}),jsxRuntime.jsxs("span",{style:{color:"#b5b5b5",fontSize:12},children:[ue(f)," USDC"]})]}),jsxRuntime.jsxs("div",{className:"flex justify-between",children:[jsxRuntime.jsx("span",{style:{color:"#6b6b6b"},children:"Current Position"}),jsxRuntime.jsx("span",{style:{color:"#b5b5b5",fontSize:12},children:p?ue(p):"--"})]}),jsxRuntime.jsxs("div",{className:"flex items-center justify-end",style:{gap:6,paddingTop:8},children:[jsxRuntime.jsx("span",{style:{fontSize:11,color:"#6b6b6b"},children:"powered by"}),jsxRuntime.jsx("img",{src:"https://axiom-assets.sfo3.cdn.digitaloceanspaces.com/images/hyperliquid-logo.svg",alt:"Hyperliquid",className:"h-3 opacity-60",onError:C=>{let k=C.target;k.style.display="none";}})]})]}),y&&jsxRuntime.jsx(_r,{leverage:I,maxLeverage:g,onLeverageChange:C=>t.setValue("leverage",C),onClose:()=>N(false)})]})}function Gr({symbol:t,userAddress:e,maxLeverage:r,onSuccess:s,onError:n,className:o}){let{form:i,side:a,orderType:l,setSide:c,setOrderType:u,handleSubmit:d,isSubmitting:f,currentPrice:p,estimatedFee:g,estimatedTotal:y,liquidationPrice:N,availableMargin:x,accountValue:A,currentPosition:I,maxLeverage:W}=We({symbol:t,userAddress:e,maxLeverage:r,onSuccess:s,onError:n});return jsxRuntime.jsx("div",{className:o,children:jsxRuntime.jsx(He,{methods:i,side:a,orderType:l,onSideChange:c,onOrderTypeChange:u,onSubmit:d,isSubmitting:f,symbol:t,currentPrice:p,estimatedFee:g,estimatedTotal:y,liquidationPrice:N,availableMargin:x,accountValue:A,currentPosition:I,maxLeverage:W})})}function $e({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s}){let[n,o]=react.useState([]),{data:i,isLoading:a,error:l}=ve({userAddress:t,symbol:e},{enabled:!!t}),{data:c}=oe({type:"positions",userAddress:t||"",enabled:!!t}),{mutateAsync:u,isPending:d}=ne({onSuccess:()=>{r?.();},onError:p=>{s?.(p);}});react.useEffect(()=>{i?.positions&&o(i.positions);},[i]),react.useEffect(()=>{c&&o(p=>{let g=p.findIndex(y=>y.symbol===c.symbol);if(c.quantity===0)return g!==-1?p.filter((y,N)=>N!==g):p;if(g!==-1){let y=[...p];return y[g]=c,y}return [...p,c]});},[c]);let f=react.useCallback(async p=>{if(!t)throw new Error("User address is required");let g=p.side==="long"?"short":"long";await u({symbol:p.symbol,side:g,orderType:"market",amount:Math.abs(p.quantity),leverage:p.leverage,userAddress:t});},[t,u]);return {positions:n,isLoading:a,error:l,handleClosePosition:f,isClosing:d}}function Y(t,e=2){return t.toFixed(e)}function Ke(t){return Y(t,4)}function Zr(t){return Y(Math.abs(t),4)}function es(t){return `${t>=0?"+":""}${Y(t,2)}`}function ts(t){return `${t>=0?"+":""}${Y(t,2)}%`}function Ve({positions:t,onClosePosition:e,isClosing:r}){let s=jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Position"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Position Value"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Entry Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Mark Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Liquidation"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Margin Used (PNL) \u2193"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"TP"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"SL"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:12,color:"#6b6b6b"},children:"Close"})]});return t.length===0?jsxRuntime.jsxs("div",{className:"w-full overflow-x-auto bg-transparent",children:[jsxRuntime.jsx("table",{className:"w-full",style:{fontSize:12},children:jsxRuntime.jsx("thead",{children:s})}),jsxRuntime.jsx("div",{className:"flex items-center justify-center",style:{fontSize:14,color:"#b5b5b5",padding:"24px 0"},children:"No open positions"})]}):jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:12},children:[jsxRuntime.jsx("thead",{children:s}),jsxRuntime.jsx("tbody",{children:t.map(n=>{let i=n.unrealizedPnl>=0?"text-bullish":"text-bearish";return jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{className:"font-medium",style:{color:"#ffffff"},children:n.symbol.split("-")[0]}),jsxRuntime.jsxs("span",{className:ui.cn(n.side==="long"?"text-bullish":"text-bearish"),children:[n.leverage,"x ",n.side.toUpperCase()]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:Zr(n.quantity)}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:["$",Y(n.notionalValue)]}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:["$",Ke(n.entryPrice)]}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:["$",Ke(n.markPrice)]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:n.liquidationPrice?`$${Ke(n.liquidationPrice)}`:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsxs("div",{className:"flex flex-col items-end",children:[jsxRuntime.jsxs("span",{style:{color:"#ffffff"},children:["$",Y(n.margin)]}),jsxRuntime.jsxs("span",{className:i,children:[es(n.unrealizedPnl)," (",ts(n.unrealizedPnlPercent),")"]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#b5b5b5"},children:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#b5b5b5"},children:"-"}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsx(ui.Button,{size:"sm",onClick:()=>e(n),isLoading:r,className:"bg-red-600 hover:bg-red-700 text-white text-xs px-3 py-1",children:"Close"})})]},n.symbol)})})]})})}function _e(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function rs(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:14,color:"#b5b5b5"},children:"No open positions"})}function ss({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s,className:n}){let{positions:o,isLoading:i,handleClosePosition:a,isClosing:l}=$e({userAddress:t,symbol:e,onCloseSuccess:r,onCloseError:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(_e,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Ve,{positions:o,onClosePosition:a,isClosing:l})})}function Ge({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s}){let[n,o]=react.useState([]),{data:i,isLoading:a,error:l}=Se({userAddress:t,symbol:e},{enabled:!!t}),{data:c}=oe({type:"orders",userAddress:t||"",enabled:!!t}),{mutateAsync:u,isPending:d}=Ce({onSuccess:()=>{r?.();},onError:p=>{s?.(p);}});react.useEffect(()=>{i?.orders&&o(i.orders);},[i]),react.useEffect(()=>{c&&o(p=>{let g=p.findIndex(y=>y.orderId===c.orderId);if(c.status==="cancelled"||c.status==="filled"||c.status==="rejected")return g!==-1?p.filter((y,N)=>N!==g):p;if(g!==-1){let y=[...p];return y[g]=c,y}return [c,...p]});},[c]);let f=react.useCallback(async p=>{if(!t)throw new Error("User address is required");await u({orderId:p.orderId,symbol:p.symbol,userAddress:t});},[t,u]);return {orders:n,isLoading:a,error:l,handleCancelOrder:f,isCanceling:d}}function _t(t,e=2){return t.toFixed(e)}function as(t){return _t(t,4)}function je(t){return _t(t,4)}function ls(t){let e=new Date(t),r=String(e.getHours()).padStart(2,"0"),s=String(e.getMinutes()).padStart(2,"0"),n=String(e.getSeconds()).padStart(2,"0");return `${r}:${s}:${n}`}function Je({orders:t,onCancelOrder:e,isCanceling:r}){return t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#b5b5b5"},children:"No open orders"}):jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:11},children:[jsxRuntime.jsx("thead",{children:jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Type"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Amount"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Filled"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Remaining"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Status"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Time"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Action"})]})}),jsxRuntime.jsx("tbody",{children:t.map(s=>jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsxs("div",{className:"flex flex-col",children:[jsxRuntime.jsx("span",{className:"font-medium",style:{color:"#ffffff"},children:s.symbol.split("-")[0]}),jsxRuntime.jsxs("span",{className:ui.cn(s.side==="long"?"text-bullish":"text-bearish"),children:[s.side.toUpperCase(),s.leverage?` ${s.leverage}x`:""]})]})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 capitalize",style:{color:"#ffffff"},children:s.orderType}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:s.orderType==="market"?jsxRuntime.jsx("span",{style:{color:"#b5b5b5"},children:"Market"}):`$${as(s.price)}`}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:je(s.quantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:je(s.filledQuantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:je(s.remainingQuantity)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded","text-[11px]",s.status==="pending"&&"bg-yellow-600/20 text-yellow-500",s.status==="partially_filled"&&"bg-blue-600/20 text-blue-500",s.status==="filled"&&"bg-green-600/20 text-green-500",s.status==="cancelled"&&"bg-neutral-600/20 text-neutral-400",s.status==="rejected"&&"bg-red-600/20 text-red-500"),children:s.status.replace("_"," ")})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#b5b5b5"},children:ls(s.timestamp)}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",children:s.status==="pending"||s.status==="partially_filled"?jsxRuntime.jsx(ui.Button,{size:"sm",onClick:()=>e(s),isLoading:r,className:"bg-red-600 hover:bg-red-700 text-white text-xs px-3 py-1",children:"Cancel"}):jsxRuntime.jsx("span",{className:"text-[11px]",style:{color:"#6b6d7a"},children:"-"})})]},s.orderId))})]})})}function Ye(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function Xe(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#b5b5b5"},children:"No open orders"})}function cs({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s,className:n}){let{orders:o,isLoading:i,handleCancelOrder:a,isCanceling:l}=Ge({userAddress:t,symbol:e,onCancelSuccess:r,onCancelError:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Ye,{})}):o.length===0?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Xe,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(Je,{orders:o,onCancelOrder:a,isCanceling:l})})}function us(t){let e=Date.now(),r=e;switch(t){case "today":let s=new Date;return s.setHours(0,0,0,0),{startTime:s.getTime(),endTime:r};case "7d":return {startTime:e-10080*60*1e3,endTime:r};case "30d":return {startTime:e-720*60*60*1e3,endTime:r};default:return {}}}function et({userAddress:t,symbol:e,initialTimeRange:r="7d",pageSize:s=50}){let[n,o]=react.useState(r),[i,a]=react.useState(1),[l,c]=react.useState([]),{startTime:u,endTime:d}=us(n),{data:f,isLoading:p,error:g}=ke({userAddress:t,symbol:e,startTime:u,endTime:d,limit:1e3},{enabled:!!t});react.useEffect(()=>{f?.trades&&(c(f.trades),a(1));},[f]),react.useEffect(()=>{a(1);},[n]);let y=Math.ceil(l.length/s),N=(i-1)*s,x=N+s;return {trades:l.slice(N,x),isLoading:p,error:g,timeRange:n,setTimeRange:o,currentPage:i,totalPages:y,goToNextPage:()=>{i<y&&a(i+1);},goToPreviousPage:()=>{i>1&&a(i-1);},goToPage:E=>{E>=1&&E<=y&&a(E);}}}function tt(t,e=2){return t.toFixed(e)}function ds(t){return tt(t,4)}function ps(t){return tt(t,4)}function ms(t){let e=new Date(t),r=String(e.getMonth()+1).padStart(2,"0"),s=String(e.getDate()).padStart(2,"0"),n=String(e.getHours()).padStart(2,"0"),o=String(e.getMinutes()).padStart(2,"0"),i=String(e.getSeconds()).padStart(2,"0");return `${r}/${s} ${n}:${o}:${i}`}var fs=[{label:"Today",value:"today"},{label:"7 Days",value:"7d"},{label:"30 Days",value:"30d"},{label:"All",value:"all"}];function rt({trades:t,timeRange:e,onTimeRangeChange:r,currentPage:s,totalPages:n,onNextPage:o,onPreviousPage:i,onGoToPage:a}){return jsxRuntime.jsxs("div",{className:"w-full flex flex-col gap-4",children:[jsxRuntime.jsx("div",{className:"flex gap-2",children:fs.map(l=>{let c=e===l.value;return jsxRuntime.jsx("button",{type:"button",className:ui.cn("rounded px-3 transition-colors",!c&&"hover:bg-[#1A1A1A]"),style:{height:24,fontSize:11,border:"1px solid #1c1c1c",backgroundColor:c?"#1c1c1c":"transparent",color:c?"#ffffff":"#b5b5b5"},onClick:()=>r(l.value),children:l.label},l.value)})}),t.length===0?jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#b5b5b5"},children:"No trade history"}):jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",{className:"w-full overflow-x-auto bg-transparent",children:jsxRuntime.jsxs("table",{className:"w-full",style:{fontSize:11},children:[jsxRuntime.jsx("thead",{children:jsxRuntime.jsxs("tr",{style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Asset"}),jsxRuntime.jsx("th",{className:"text-left py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Side"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Price"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Quantity"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Fee"}),jsxRuntime.jsx("th",{className:"text-center py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Maker/Taker"}),jsxRuntime.jsx("th",{className:"text-right py-1.5 px-3 font-normal",style:{fontSize:11,color:"#b5b5b5"},children:"Time"})]})}),jsxRuntime.jsx("tbody",{children:t.map(l=>jsxRuntime.jsxs("tr",{className:"hover:bg-neutral-900/50",style:{borderBottom:"1px solid #1c1c1c"},children:[jsxRuntime.jsx("td",{className:"py-1.5 px-3 font-medium",style:{color:"#ffffff"},children:l.symbol.split("-")[0]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded text-[11px]",l.side==="long"?"bg-bullish/20 text-bullish":"bg-bearish/20 text-bearish"),children:l.side.toUpperCase()})}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:["$",ds(l.price)]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:ps(l.quantity)}),jsxRuntime.jsxs("td",{className:"py-1.5 px-3 text-right",style:{color:"#ffffff"},children:[tt(l.fee,4)," ",l.feeCurrency]}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-center",children:jsxRuntime.jsx("span",{className:ui.cn("px-2 py-0.5 rounded text-[11px]",l.isMaker?"bg-blue-600/20 text-blue-500":"bg-purple-600/20 text-purple-500"),children:l.isMaker?"Maker":"Taker"})}),jsxRuntime.jsx("td",{className:"py-1.5 px-3 text-right",style:{color:"#b5b5b5"},children:ms(l.timestamp)})]},l.tradeId))})]})}),n>1&&jsxRuntime.jsxs("div",{className:"flex items-center justify-between",children:[jsxRuntime.jsxs("div",{className:"text-sm text-neutral-400",children:["Page ",s," of ",n]}),jsxRuntime.jsxs("div",{className:"flex gap-2",children:[jsxRuntime.jsx(ui.Button,{size:"sm",onClick:i,disabled:s===1,className:"bg-neutral-800 hover:bg-neutral-700 text-white disabled:opacity-50 disabled:cursor-not-allowed",children:"Previous"}),jsxRuntime.jsx("div",{className:"flex gap-1",children:Array.from({length:Math.min(5,n)},(l,c)=>{let u;return n<=5||s<=3?u=c+1:s>=n-2?u=n-4+c:u=s-2+c,jsxRuntime.jsx("button",{type:"button",className:ui.cn("w-8 h-8 text-sm rounded transition-colors",s===u?"bg-neutral-700 text-white":"text-neutral-400 hover:bg-neutral-800 hover:text-white"),onClick:()=>a(u),children:u},u)})}),jsxRuntime.jsx(ui.Button,{size:"sm",onClick:o,disabled:s===n,className:"bg-neutral-800 hover:bg-neutral-700 text-white disabled:opacity-50 disabled:cursor-not-allowed",children:"Next"})]})]})]})]})}function st(){return jsxRuntime.jsxs("div",{className:"w-full space-y-4 p-4",children:[jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"}),jsxRuntime.jsx("div",{className:"h-4 bg-neutral-800 rounded w-full animate-pulse"})]})}function nt(){return jsxRuntime.jsx("div",{className:"flex items-center justify-center h-24",style:{fontSize:11,color:"#b5b5b5"},children:"No trade history"})}function gs({userAddress:t,symbol:e,initialTimeRange:r="7d",pageSize:s=50,className:n}){let{trades:o,isLoading:i,timeRange:a,setTimeRange:l,currentPage:c,totalPages:u,goToNextPage:d,goToPreviousPage:f,goToPage:p}=et({userAddress:t,symbol:e,initialTimeRange:r,pageSize:s});return i?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(st,{})}):o.length===0?jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(nt,{})}):jsxRuntime.jsx("div",{className:n,children:jsxRuntime.jsx(rt,{trades:o,timeRange:a,onTimeRangeChange:l,currentPage:c,totalPages:u,onNextPage:d,onPreviousPage:f,onGoToPage:p})})}
|
|
12
|
+
exports.CoinInfoNotFoundUI=Te;exports.CoinInfoSkeletonsUI=Ue;exports.CoinInfoUI=Ie;exports.CoinInfoWidget=kr;exports.HyperliquidApiError=V;exports.HyperliquidPerpetualsClient=ge;exports.OpenOrdersEmpty=Xe;exports.OpenOrdersSkeleton=Ye;exports.OpenOrdersUI=Je;exports.OpenOrdersWidget=cs;exports.OrderBookUI=Qe;exports.OrderBookWidget=Er;exports.PerpetualsContext=re;exports.PerpetualsProvider=Xt;exports.PlaceOrderFormUI=He;exports.PlaceOrderFormWidget=Gr;exports.PositionsEmpty=rs;exports.PositionsSkeleton=_e;exports.PositionsUI=Ve;exports.PositionsWidget=ss;exports.SearchCoinsUI=Re;exports.SearchCoinsWidget=Tr;exports.TradeHistoryEmpty=nt;exports.TradeHistorySkeleton=st;exports.TradeHistoryUI=rt;exports.TradeHistoryWidget=gs;exports.TradesUI=Be;exports.TradesWidget=Lr;exports.cancelOrder=Nt;exports.coinsQueryKey=it;exports.createOrder=Ct;exports.fetchCoins=at;exports.fetchKlines=mt;exports.fetchMarket=ct;exports.fetchMarkets=dt;exports.fetchOrderBook=yt;exports.fetchOrders=vt;exports.fetchPositions=xt;exports.fetchRecentTrades=bt;exports.fetchTrades=kt;exports.klinesQueryKey=pt;exports.marketQueryKey=lt;exports.marketsQueryKey=ut;exports.orderBookQueryKey=ft;exports.ordersQueryKey=Pt;exports.positionsQueryKey=ht;exports.recentTradesQueryKey=gt;exports.tradesQueryKey=St;exports.useCancelOrderMutation=Ce;exports.useCandlesSubscription=br;exports.useCoinInfo=Me;exports.useCoinsQuery=be;exports.useCreateOrderMutation=ne;exports.useKlinesQuery=or;exports.useMarketDataSubscription=_;exports.useMarketQuery=se;exports.useMarketsQuery=he;exports.useOpenOrdersScript=Ge;exports.useOrderBookQuery=xe;exports.useOrderBookScript=ze;exports.useOrdersQuery=Se;exports.usePerpetualsClient=P;exports.usePlaceOrderFormScript=We;exports.usePositionsQuery=ve;exports.usePositionsScript=$e;exports.useRecentTradesQuery=Pe;exports.useSearchCoinsScript=Ee;exports.useTradeHistoryScript=et;exports.useTradesQuery=ke;exports.useTradesScript=qe;exports.useUserDataSubscription=oe;exports.version=Jt;//# sourceMappingURL=index.js.map
|
|
13
13
|
//# sourceMappingURL=index.js.map
|