@orderly.network/ui-order-entry 2.0.0 → 2.0.1-alpha.0

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.
Files changed (8) hide show
  1. package/dist/index.d.mts +16 -7
  2. package/dist/index.d.ts +16 -7
  3. package/dist/index.js +8 -7
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +7 -6
  6. package/dist/index.mjs.map +1 -1
  7. package/dist/styles.css +1 -1
  8. package/package.json +11 -7
package/dist/index.mjs CHANGED
@@ -1,13 +1,14 @@
1
1
  import { AuthGuard } from '@orderly.network/ui-connector';
2
- import { Grid, registerSimpleDialog, Input, inputFormatter, cn, Flex, Text, Badge, Divider, textVariants, Checkbox, Button, Switch, Box, Slider, Select, PopoverRoot, PopoverTrigger, PopoverContent, SimpleDropdownMenu, CaretDownIcon, modal, toast, convertValueToPercentage } from '@orderly.network/ui';
3
- import pe, { createContext, forwardRef, useContext, useMemo, useState, useEffect, useRef } from 'react';
4
- import { OrderSide, OrderType, SDKError } from '@orderly.network/types';
2
+ import { Grid, registerSimpleDialog, Input, inputFormatter, cn, Flex, Text, Badge, Divider, textVariants, Checkbox, Button, ThrottledButton, Switch, Box, Slider, Select, PopoverRoot, PopoverTrigger, PopoverContent, SimpleDropdownMenu, CaretDownIcon, ExclamationFillIcon, modal, toast, convertValueToPercentage } from '@orderly.network/ui';
3
+ import Me, { createContext, forwardRef, useContext, useState, useMemo, useEffect, useRef } from 'react';
4
+ import { OrderSide, OrderType, SDKError, AccountStatusEnum } from '@orderly.network/types';
5
5
  import { Decimal, todpIfNeed, removeTrailingZeros } from '@orderly.network/utils';
6
- import { useLocalStorage, useOrderEntryNext, useMarginRatio, useEventEmitter } from '@orderly.network/hooks';
6
+ import { useLocalStorage, useOrderEntry, useAccount, useMarginRatio, useEventEmitter, utils } from '@orderly.network/hooks';
7
7
  import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
8
+ import { useAppContext } from '@orderly.network/react-app';
8
9
 
9
- var le=createContext({}),H=()=>useContext(le),U=e=>{let{type:t,values:r}=e,[o,i]=useLocalStorage("TP/SL_Mode","Offset%"),l=useMemo(()=>!r.PnL||!e.values.trigger_price?null:jsxs(Flex,{children:[jsx("span",{className:"oui-text-xs oui-text-base-contrast-54",children:`Est.${o==="PnL"?"ROI":"PNL"}:`}),o==="PnL"?jsx(Text.numeral,{rule:"percentages",className:cn("oui-text-xs oui-ml-1",t==="TP"?"oui-text-trade-profit":"oui-text-trade-loss"),children:r.ROI}):jsx(Text.numeral,{rule:"price",className:cn("oui-text-xs oui-ml-1",t==="TP"?"oui-text-trade-profit":"oui-text-trade-loss"),children:r.PnL})]}),[o,e.values.PnL,e.values.trigger_price]);return jsx(le.Provider,{value:{mode:o,setMode:i,tipsEle:l},children:e.children})};var de=e=>{let{type:t,values:r}=e,{mode:o,setMode:i,tipsEle:l}=H(),[f,g]=useState(!1),u=useMemo(()=>{switch(o){case"Offset":return `${t.toLowerCase()}_offset`;case"Offset%":return `${t.toLowerCase()}_offset_percentage`;default:return `${t.toLowerCase()}_pnl`}},[o]),L=useMemo(()=>r[o],[r,o]),T=useMemo(()=>[{label:"PnL",value:"PnL",testId:"PnL_menu_item"},{label:"Offset",value:"Offset",testId:"Offset_mneu_item"},{label:"Offset%",value:"Offset%",testId:"Offset%_menu_item"}],[]),_=useRef("");return {mode:o,modes:T,formatter:m=>{let{dp:x=2}=m;return {onRenderBefore:(a,I)=>(a=`${a}`,t==="SL"&&o==="PnL"&&(a=a.startsWith("-")?a:"-"+a),a===""||a==="-"?"":o==="Offset%"?`${new Decimal(a).mul(100).todp(2,4).toString()}${_.current}`:(o==="Offset"&&(a=todpIfNeed(a,x)),`${a}`)),onSendBefore:a=>/^\-?0{2,}$/.test(a)?"0":(o==="Offset%"?a!==""&&(_.current=a.endsWith(".")?".":"",a=new Decimal(a).div(100).todp(4,4).toString()):a=todpIfNeed(a,x),a===""||a==="-"?"":a)}},onModeChange:m=>{i(m);},onFocus:()=>{g(!0);},onBlur:()=>{g(!1);},value:L,onValueChange:m=>{e.onChange(u,m);},quote_db:e.quote_dp,tips:f?l:void 0}};var ce=e=>{let{mode:t,modes:r,onModeChange:o,onValueChange:i,quote:l,quote_db:f,value:g,type:u,tips:L,onFocus:T,onBlur:_}=e,O=useMemo(()=>`${u.toLowerCase()}_${t.toLowerCase()}`,[]);return jsx(Input.tooltip,{prefix:t,size:"md",placeholder:t==="Offset%"?"%":l,id:O,align:"right",value:g,tooltip:L,tooltipProps:{content:{side:e.type==="TP"?"top":"bottom"}},"data-testid":e.testId,autoComplete:"off",onValueChange:i,formatters:[e.formatter({dp:f,mode:t,type:u}),inputFormatter.currencyFormatter],classNames:{additional:"oui-text-base-contrast-54",input:u==="TP"?"oui-text-trade-profit":"oui-text-trade-loss"},onFocus:T,onBlur:_,suffix:jsx(We,{modes:r,onModeChange:S=>o(S.value)})})},We=e=>jsx(SimpleDropdownMenu,{menu:e.modes,align:"end",size:"xs",className:"oui-min-w-[80px]",onCloseAutoFocus:t=>t.preventDefault(),onSelect:t=>e.onModeChange(t),children:jsx("button",{className:"oui-p-2",children:jsx(CaretDownIcon,{size:12,color:"white"})})});var me=e=>{let{testId:t,quote:r,...o}=e,i=de(o);return jsx(ce,{...i,testId:t,quote:r,type:e.type})};var z=createContext({}),fe=z.Provider;var xe=e=>{let[t,r]=useState(!1),o=pe.useRef(null);return useEffect(()=>{e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET&&(r(!1),e.onCancelTPSL());},[e.orderType]),e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET||e.isReduceOnly?null:jsxs("div",{children:[jsxs(Flex,{itemAlign:"center",gapX:1,children:[jsx(Switch,{id:"order_entry_tpsl",checked:t,disabled:e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET||e.isReduceOnly,onCheckedChange:i=>{r(i),i||e.onCancelTPSL();}}),jsx("label",{htmlFor:"order_entry_tpsl",className:"oui-text-xs",children:"TP/SL"})]}),jsx("div",{className:cn("oui-max-h-0 oui-overflow-hidden oui-transition-all",t&&"oui-max-h-[100px]"),onTransitionEnd:()=>{o.current?.style.setProperty("opacity",t?"1":"0");},children:jsx(Pe,{ref:o,onChange:e.onChange,values:e.values,errors:e.errors})})]})},Pe=pe.forwardRef((e,t)=>jsxs("div",{ref:t,className:"oui-transition-all oui-pt-2 oui-pb-2 oui-px-1 oui-space-y-1",children:[jsx(U,{values:e.values.tp,type:"TP",children:jsx(ge,{type:"TP",error:e.errors?e.errors.tp_trigger_price?.message:"",onChange:e.onChange,values:e.values.tp})}),jsx(U,{values:e.values.sl,type:"SL",children:jsx(ge,{type:"SL",error:e.errors?e.errors.sl_trigger_price?.message:"",onChange:e.onChange,values:e.values.sl})})]}));Pe.displayName="TPSLInputForm";var ot=e=>{let{errorMsgVisible:t}=useContext(z),{tipsEle:r}=H(),[o,i]=useState(!1),l=useMemo(()=>e.error&&t?e.error:o?r:null,[e.error,t,o,r]);return jsx(Input.tooltip,{prefix:"TP Price",size:"md",placeholder:"USDC",align:"right",onFocus:()=>{i(!0);},onBlur:()=>{i(!1);},tooltip:l,tooltipProps:{content:{side:e.type==="TP"?"top":"bottom"}},color:e.error?"danger":void 0,autoComplete:"off",value:e.values.trigger_price,classNames:{additional:"oui-text-base-contrast-54"},onChange:e.onChange})},ge=e=>{let t=e.type==="SL"?"sl_trigger_price":"tp_trigger_price";return jsxs(Grid,{cols:2,gapX:1,children:[jsx(ot,{type:e.type,error:e.error,values:e.values??"",onChange:r=>{e.onChange(t,r.target.value);}}),jsx(me,{onChange:e.onChange,quote:"USDC",type:e.type,values:{PnL:e.values.PnL,Offset:e.values.Offset,"Offset%":e.values["Offset%"],ROI:e.values.ROI}})]})};var Z=e=>{let{baseDP:t,quoteDP:r,order:o,onConfirm:i,onCancel:l}=e,{side:f,order_type:g,symbol:u}=o,[L,T]=useLocalStorage("orderly_order_confirm",!0);return jsxs(Fragment,{children:[jsxs(Flex,{justify:"between",children:[jsx(Text.formatted,{rule:"symbol",showIcon:!0,children:o.symbol}),jsxs(Flex,{justify:"end",gapX:1,children:[jsx(dt,{type:o.order_type}),f===OrderSide.BUY?jsx(Badge,{color:"buy",size:"sm",children:"Buy"}):jsx(Badge,{color:"sell",size:"sm",children:"Sell"})]})]}),jsx(Divider,{className:"oui-my-4"}),jsxs("div",{className:textVariants({size:"sm",intensity:54,className:"oui-space-y-1"}),children:[jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Qty."}),jsx(Text.numeral,{rule:"price",dp:t,className:"oui-text-base-contrast",children:o.order_quantity})]}),o.trigger_price?jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Trigger"}),jsx(Text.numeral,{unit:"USDC",rule:"price",className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:o.trigger_price})]}):null,jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Price"}),o.order_type===OrderType.MARKET?jsx(Text,{intensity:80,children:"Market"}):jsx(Text.numeral,{unit:"USDC",rule:"price",className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:o.order_price})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Est. Total"}),jsx(Text.numeral,{unit:"USDC",rule:"price",dp:r,className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:o.total})]})]}),o.tp_trigger_price||o.sl_trigger_price?jsxs(Fragment,{children:[jsx(Divider,{className:"oui-my-4"}),jsxs("div",{className:textVariants({size:"sm",intensity:54,className:"oui-space-y-1"}),children:[o.tp_trigger_price&&jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"TP Price"}),jsx(Text.numeral,{unit:"ETH",rule:"price",coloring:!0,dp:r,unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:o.tp_trigger_price})]}),o.sl_trigger_price&&jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"SL Price"}),jsx(Text.numeral,{unit:"ETH",rule:"price",coloring:!0,className:"oui-text-trade-loss",unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:o.sl_trigger_price})]})]})]}):null,jsxs(Flex,{gapX:1,pt:8,pb:3,children:[jsx(Checkbox,{id:"orderConfirm",color:"white",onCheckedChange:_=>{T(!_);}}),jsx("label",{htmlFor:"orderConfirm",className:textVariants({size:"xs",intensity:54}),children:"Disable order confirmation"})]}),jsxs(Grid,{cols:2,gapX:3,children:[jsx(Button,{color:"secondary",size:"md",onClick:()=>l(),children:"Cancel"}),jsx(Button,{size:"md",onClick:()=>i(),children:"Confirm"})]})]})};Z.displayName="OrderConfirmDialog";var dt=e=>{let t=useMemo(()=>{switch(e.type){case OrderType.LIMIT:return "Limit";case OrderType.MARKET:return "Market";case OrderType.STOP_LIMIT:return "Stop Limit";case OrderType.STOP_MARKET:return "Stop Market";default:return ""}},[e.type]);return jsx(Badge,{color:"neutral",size:"sm",children:t})},ct=e=>{let{close:t,resolve:r,reject:o,...i}=e;return jsx(Z,{...i,onCancel:t,onConfirm:()=>{r(),t();}})},J="orderConfirm";registerSimpleDialog(J,ct,{size:"sm",title:"Order confirm"});var Ce=e=>{let{pinned:t,orderTypeExtra:r}=e,o=i=>l=>{e.onValueChange&&e.onValueChange("order_type_ext",l?i:"");};return jsxs("div",{className:"oui-text-base-contrast-54",children:[e.showExtra&&jsxs(Flex,{gapX:5,justify:t?"start":"between",mb:3,width:t?"unset":"100%",children:[jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_post_only",color:"white",variant:"radio",checked:r===OrderType.POST_ONLY,onCheckedChange:o(OrderType.POST_ONLY)}),jsx("label",{htmlFor:"toggle_order_post_only",className:"oui-text-2xs oui-ml-1",children:"Post only"})]}),jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_iov",color:"white",variant:"radio",checked:r===OrderType.IOC,onCheckedChange:o(OrderType.IOC)}),jsx("label",{htmlFor:"toggle_order_iov",className:"oui-text-2xs oui-ml-1",children:"IOC"})]}),jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_fok",color:"white",variant:"radio",checked:r===OrderType.FOK,onCheckedChange:o(OrderType.FOK)}),jsx("label",{htmlFor:"toggle_order_fok",className:"oui-text-2xs oui-ml-1",children:"FOK"})]})]}),jsxs(Flex,{gapX:6,children:[jsxs(Flex,{children:[jsx(Checkbox,{id:"toggle_order_confirm",color:"white",checked:e.needConfirm,onCheckedChange:i=>{e.setNeedConfirm(!!i);}}),jsx("label",{htmlFor:"toggle_order_confirm",className:"oui-text-2xs oui-ml-1",children:"Order confirm"})]}),jsxs(Flex,{children:[jsx(Checkbox,{id:"toggle_order_hidden",color:"white",onCheckedChange:i=>{e.onValueChange?.("visible_quantity",i?0:1);}}),jsx("label",{htmlFor:"toggle_order_hidden",className:"oui-text-2xs oui-ml-1",children:"Hidden"})]})]}),!t&&jsxs(Fragment,{children:[jsx(Divider,{className:"oui-my-3"}),jsxs(Flex,{children:[jsx(Switch,{id:"toggle_order_keep_visible",onCheckedChange:i=>{e.setPinned(i);}}),jsx("label",{htmlFor:"toggle_order_keep_visible",className:"oui-text-2xs oui-ml-1",children:"Keep visible"})]})]})]})};var be=()=>({});var $=e=>{let t=be();return jsx(Ce,{...t,...e})};var te=e=>{let{side:t,formattedOrder:r,setOrderValue:o,symbolInfo:i,maxQty:l,freeCollateral:f,helper:g,submit:u,metaState:L,refs:T}=e,{errors:_,validated:O}=L,[S,w]=useState(!1),[V,m]=useLocalStorage("orderly_order_confirm",!0),[x,a]=useLocalStorage("orderly-order-additional-pinned",!0),I=useMemo(()=>t===OrderSide.BUY?"Buy / Long":"Sell / Short",[t]);useEffect(()=>{O&&w(!0);},[O]),useEffect(()=>{let d=A=>{A.target.closest("#order-entry-submit-button")||w(ne=>ne&&!1);};return S?document.addEventListener("click",d):document.removeEventListener("click",d),()=>{document.removeEventListener("click",d);}},[S]);let Me=()=>{g.validate().then(d=>V?modal.show(J,{order:r,quote:i.quote,base:i.base,quoteDP:i.quote_dp,baseDP:i.base_dp}):!0,d=>{w(!0);}).then(()=>u()).catch(d=>{d instanceof SDKError&&toast.error(`Error:${d.message}`);});};return jsx(fe,{value:{errorMsgVisible:S},children:jsxs("div",{className:"oui-space-y-3 oui-text-base-contrast-54",ref:e.containerRef,children:[jsxs(Flex,{gapX:2,className:"oui-flex-col lg:oui-flex-row oui-gap-y-2",children:[jsxs("div",{className:"oui-grid oui-grid-cols-2 oui-w-full oui-flex-1 oui-gap-x-2 lg:oui-flex lg:oui-gap-x-[6px]",children:[jsx(Button,{onClick:()=>{e.setOrderValue("side",OrderSide.BUY);},size:"md",fullWidth:!0,color:t===OrderSide.BUY?"buy":"secondary",children:"Buy"}),jsx(Button,{onClick:()=>{e.setOrderValue("side",OrderSide.SELL);},fullWidth:!0,size:"md",color:t===OrderSide.SELL?"sell":"secondary",children:"Sell"})]}),jsx("div",{className:"oui-w-full lg:oui-flex-1",children:jsx(Bt,{type:r.order_type,onChange:d=>{o("order_type",d);}})})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Available"}),jsx(Text.numeral,{unit:i.quote,size:"2xs",className:"oui-text-base-contrast-80",unitClassName:"oui-ml-1 oui-text-base-contrast-54",children:f})]}),jsx(wt,{type:e.type,symbolInfo:i,values:{quantity:r.order_quantity,price:r.order_price,trigger_price:r.trigger_price,total:r.total},errors:O?_:null,onChange:(d,A)=>{e.setOrderValue(d,A);},refs:e.refs,onBlur:e.onBlur,onFocus:e.onFocus}),jsx(kt,{maxQty:l,currentQtyPercentage:e.currentQtyPercentage,value:r.order_quantity?Number(r.order_quantity):0,tick:i.base_tick,dp:i.base_dp,setMaxQty:e.setMaxQty,onValueChange:d=>{o("order_quantity",d);},side:e.side}),jsx(AuthGuard,{buttonProps:{fullWidth:!0},children:jsx(Button,{fullWidth:!0,id:"order-entry-submit-button",color:t===OrderSide.BUY?"buy":"sell",onClick:()=>{Me();},loading:e.isMutating,children:I})}),jsx(At,{quote:i.quote,estLiqPrice:e.estLiqPrice,estLeverage:e.estLeverage,currentLeverage:e.currentLeverage}),jsx(Divider,{}),jsx(xe,{onCancelTPSL:e.cancelTP_SL,orderType:r.order_type,errors:O?_:null,isReduceOnly:r.reduce_only,values:{tp:{trigger_price:r.tp_trigger_price??"",PnL:r.tp_pnl??"",Offset:r.tp_offset??"","Offset%":r.tp_offset_percentage??"",ROI:r.tp_ROI??""},sl:{trigger_price:r.sl_trigger_price??"",PnL:r.sl_pnl??"",Offset:r.sl_offset??"","Offset%":r.sl_offset_percentage??"",ROI:r.sl_ROI??""}},onChange:(d,A)=>{e.setOrderValue(d,A);}}),jsxs(Flex,{justify:"between",itemAlign:"center",children:[jsxs(Flex,{itemAlign:"center",gapX:1,children:[jsx(Switch,{id:"reduceOnly",checked:e.formattedOrder.reduce_only,onCheckedChange:d=>{e.setOrderValue("reduce_only",d);}}),jsx("label",{htmlFor:"reduceOnly",className:"oui-text-xs",children:"Reduce only"})]}),!x&&jsx(qt,{pinned:x,setPinned:a,needConfirm:V,setNeedConfirm:m,onValueChange:o,orderTypeExtra:r.order_type_ext,showExtra:r.order_type===OrderType.LIMIT})]}),x&&jsxs(Box,{p:2,r:"md",intensity:700,position:"relative",children:[jsx($,{pinned:x,setPinned:a,needConfirm:V,setNeedConfirm:m,onValueChange:o,orderTypeExtra:r.order_type_ext,showExtra:r.order_type===OrderType.LIMIT}),jsx("button",{onClick:()=>{a(!1);},className:"oui-absolute oui-top-2 oui-right-2",children:jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsx("path",{d:"M4.67 1.953A2.667 2.667 0 0 0 2.005 4.62v6.667a2.667 2.667 0 0 0 2.667 2.666h6.666a2.667 2.667 0 0 0 2.667-2.666V4.62a2.667 2.667 0 0 0-2.667-2.667zm1.334 3.334c.17 0 .349.057.48.187l1.52 1.52 1.52-1.52a.68.68 0 0 1 .48-.187c.17 0 .349.057.48.187.26.26.26.698 0 .958L8.962 7.954l1.52 1.52c.26.262.26.699 0 .96a.687.687 0 0 1-.958 0l-1.52-1.522-1.52 1.52a.687.687 0 0 1-.96 0 .687.687 0 0 1 0-.958l1.521-1.52-1.52-1.521a.687.687 0 0 1 0-.96.68.68 0 0 1 .479-.186",fill:"#fff",fillOpacity:".2"})})})]})]})})},wt=e=>{let{type:t,symbolInfo:r,errors:o,values:i,onFocus:l,onBlur:f}=e,g=u=>o&&o[u]?o[u].message:"";return jsxs("div",{className:"oui-space-y-1",children:[t===OrderType.STOP_LIMIT||t===OrderType.STOP_MARKET?jsx("div",{className:"oui-group",children:jsx(Q,{label:"Trigger",suffix:r.quote,error:g("trigger_price"),id:"trigger",ref:e.refs.triggerPriceInputRef,value:i.trigger_price,onChange:u=>{e.onChange("trigger_price",u.target.value);},onFocus:l(1),onBlur:f(1)})}):null,t===OrderType.LIMIT||t===OrderType.STOP_LIMIT?jsx("div",{className:"oui-group",children:jsx(Q,{label:"Price",suffix:r.quote,id:"price",value:i.price,error:g("order_price"),ref:e.refs.priceInputRef,onChange:u=>{e.onChange("order_price",u.target.value);},onFocus:l(0),onBlur:f(0)})}):null,jsxs(Grid,{cols:2,className:"oui-space-x-1 oui-group",children:[jsx(Q,{label:"Quantity",suffix:r.base,id:"order_quantity_input",name:"order_quantity_input",className:"!oui-rounded-br !oui-rounded-tr",value:i.quantity,error:g("order_quantity"),onChange:u=>{e.onChange("order_quantity",u.target.value);},onFocus:l(2),onBlur:f(2)}),jsx(Q,{label:"Total\u2248",suffix:r.quote,id:"total",className:"!oui-rounded-bl !oui-rounded-tl",value:i.total,onChange:u=>{e.onChange("total",u.target.value);},onFocus:l(3),onBlur:f(3)})]})]})},Q=forwardRef((e,t)=>{let{errorMsgVisible:r}=useContext(z);return jsx(Input.tooltip,{ref:t,tooltip:r?e.error:void 0,autoComplete:"off",autoFocus:e.autoFocus,size:"lg",placeholder:"0",id:e.id,name:e.name,color:e.error?"danger":void 0,prefix:jsx(Vt,{id:e.id,children:e.label}),suffix:e.suffix,value:e.value,onChange:e.onChange,onFocus:e.onFocus,onBlur:e.onBlur,formatters:[inputFormatter.numberFormatter,inputFormatter.currencyFormatter],classNames:{root:cn("oui-relative oui-pt-8 oui-h-[54px] oui-px-2 oui-py-1 oui-pr-10 oui-border oui-border-solid oui-border-line oui-rounded group-first:oui-rounded-t-xl group-last:oui-rounded-b-xl",e.className),input:"oui-mt-5 oui-mb-1 oui-h-5",prefix:"oui-absolute oui-left-2 oui-top-[7px] oui-text-base-contrast-36",suffix:"oui-absolute oui-right-0 oui-top-0 oui-text-base-contrast-36 oui-text-2xs"}})});Q.displayName="CustomInput";var Vt=e=>jsx("label",{htmlFor:e.id,className:"oui-absolute oui-left-2 oui-top-[7px] oui-text-base-contrast-36 oui-text-2xs",children:e.children}),kt=e=>{let t=useMemo(()=>e.side===OrderSide.BUY?"buy":"sell",[e.side]);return jsxs("div",{children:[jsx(Slider.single,{disabled:e.maxQty===0,value:e.value,color:t,markCount:4,showTip:!0,max:e.maxQty,step:e.tick,onValueChange:e.onValueChange}),jsxs(Flex,{justify:"between",pt:2,children:[jsx(Text.numeral,{rule:"percentages",size:"2xs",color:t,children:e.currentQtyPercentage}),jsxs(Flex,{children:[jsx("button",{className:textVariants({size:"2xs",className:"oui-mr-1"}),onClick:()=>e.setMaxQty(),children:"Max buy"}),jsx(Text.numeral,{size:"2xs",color:t,dp:e.dp,children:e.maxQty})]})]})]})},Bt=e=>{let t=[{label:"Limit order",value:OrderType.LIMIT},{label:"Market order",value:OrderType.MARKET},{label:"Stop limit",value:OrderType.STOP_LIMIT},{label:"Stop market",value:OrderType.STOP_MARKET}];return jsx(Select.options,{value:e.type,options:t,onValueChange:e.onChange,valueFormatter:(r,o)=>{let i=t.find(l=>l.value===r);return i?jsx(Text,{size:"2xs",children:i?.label.replace(" order","")}):jsx(Text,{size:"2xs",children:o.placeholder})},size:"md"})};function At(e){return jsxs("div",{className:"oui-space-y-1",children:[jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Est. Liq. price"}),jsx(Text.numeral,{unit:e.quote,size:"2xs",className:"oui-text-base-contrast-80",unitClassName:"oui-ml-1 oui-text-base-contrast-36",children:e.estLiqPrice??"--"})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Account leverage"}),jsxs(Flex,{gapX:1,className:textVariants({size:"2xs",intensity:80}),children:[jsx(Text.numeral,{unit:"x",children:e.currentLeverage}),e.estLeverage&&jsxs(Fragment,{children:[jsx("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsx("path",{d:"M2.505 4.997c0-.23.186-.416.416-.416H6.07L4.833 3.332l.586-.585 1.964 1.95a.42.42 0 0 1 .122.3.42.42 0 0 1-.122.3l-1.964 1.95-.586-.585L6.07 5.413H2.921a.416.416 0 0 1-.416-.416",fill:"#fff",fillOpacity:".54"})}),jsx("span",{children:`${e.estLeverage}x`})]})]})]})]})}function qt(e){let[t,r]=useState(!1);return jsxs(PopoverRoot,{open:t,onOpenChange:r,children:[jsx(PopoverTrigger,{asChild:!0,children:jsx("button",{onClick:()=>{r(!0);},children:jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsx("path",{d:"M3.332 2.665a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm-8 4a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm-8 4a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667z",fill:"#fff",fillOpacity:t?.8:.36})})})}),jsx(PopoverContent,{side:"top",align:"end",className:"oui-w-[230px]",children:jsx($,{...e})})]})}var Se=e=>{let{formattedOrder:t,setValue:r,setValues:o,symbolInfo:i,...l}=useOrderEntryNext(e.symbol,{}),{currentLeverage:f}=useMarginRatio(),g=useEventEmitter(),u=useRef(4),L=useRef(null),T=useRef(null),_=useMemo(()=>Number(t.order_quantity)>=Number(l.maxQty)?1:convertValueToPercentage(Number(t.order_quantity??0),0,l.maxQty)/100,[t.order_quantity,l.maxQty]),O=m=>x=>{u.current=m;},S=m=>x=>{setTimeout(()=>{u.current===m&&(u.current=4);},300);};useEffect(()=>{let m=x=>{if(u.current===1)(t.order_type===OrderType.STOP_LIMIT||t.order_type===OrderType.STOP_MARKET)&&(r("trigger_price",removeTrailingZeros(x[0])),a(L.current));else if(t.order_type===OrderType.STOP_LIMIT||t.order_type===OrderType.LIMIT)r("order_price",removeTrailingZeros(x[0])),a(T.current);else {let I;t.order_type===OrderType.STOP_MARKET?I=OrderType.STOP_LIMIT:t.order_type===OrderType.MARKET&&(I=OrderType.LIMIT),typeof I<"u"&&r("order_type",I),r("order_price",removeTrailingZeros(x[0])),a(T.current);}function a(I){setTimeout(()=>{I?.focus();},0);}};return g.on("orderbook:item:click",m),()=>{g.off("orderbook:item:click",m);}},[t.order_type]);let w=()=>{o({tp_trigger_price:"",sl_trigger_price:""});},V=()=>{r("order_quantity",l.maxQty);};return {...l,currentQtyPercentage:_,side:t.side,type:t.order_type,setOrderValue:r,currentLeverage:f,formattedOrder:t,cancelTP_SL:w,setMaxQty:V,symbolInfo:i,onFocus:O,onBlur:S,refs:{triggerPriceInputRef:L,priceInputRef:T}}};var $t=e=>{let t=Se(e);return jsx(te,{...t,containerRef:e.containerRef})};
10
+ var ve=createContext({}),Z=()=>useContext(ve),ie=e=>{let{type:t,values:r}=e,[n,o]=useLocalStorage("TP/SL_Mode","Offset%"),a=useMemo(()=>!r.PnL||!e.values.trigger_price?null:jsxs(Flex,{children:[jsx("span",{className:"oui-text-xs oui-text-base-contrast-54",children:`Est.${n==="PnL"?"ROI":"PNL"}:`}),n==="PnL"?jsx(Text.numeral,{rule:"percentages",className:cn("oui-text-xs oui-ml-1",t==="TP"?"oui-text-trade-profit":"oui-text-trade-loss"),children:r.ROI}):jsx(Text.numeral,{rule:"price",className:cn("oui-text-xs oui-ml-1",t==="TP"?"oui-text-trade-profit":"oui-text-trade-loss"),children:r.PnL})]}),[n,e.values.PnL,e.values.trigger_price]);return jsx(ve.Provider,{value:{mode:n,setMode:o,tipsEle:a},children:e.children})};var Le=e=>{let{type:t,values:r,quote_dp:n}=e,{mode:o,setMode:a,tipsEle:d}=Z(),[c,l]=useState(!1),x=useMemo(()=>{switch(o){case"Offset":return `${t.toLowerCase()}_offset`;case"Offset%":return `${t.toLowerCase()}_offset_percentage`;default:return `${t.toLowerCase()}_pnl`}},[o]),F=useMemo(()=>r[o],[r,o]),O=useMemo(()=>[{label:"PnL",value:"PnL",testId:"PnL_menu_item"},{label:"Offset",value:"Offset",testId:"Offset_mneu_item"},{label:"Offset%",value:"Offset%",testId:"Offset%_menu_item"}],[]),y=useRef("");return {mode:o,modes:O,formatter:p=>{let{dp:M=2}=p;return {onRenderBefore:(s,V)=>(s=`${s}`,t==="SL"&&o==="PnL"&&(s=s.startsWith("-")?s:"-"+s),s===""||s==="-"?"":o==="Offset%"?`${new Decimal(s.replace(new RegExp(y.current.replace(".","\\.")+"$"),"")).mul(100).todp(2,4).toString()}${y.current}`:(o==="Offset"&&(s=todpIfNeed(s,M)),`${s}`)),onSendBefore:s=>{if(/^\-?0{2,}$/.test(s))return "0";if(o==="Offset%"){if(s!==""){s=todpIfNeed(s,2);let V=s.match(/\.0{0,2}$/);V?y.current=V[0]:y.current="",s=new Decimal(s).div(100).toString(),s=`${s}${y.current}`;}}else s=todpIfNeed(s,M);return s===""||s==="-"?"":s}}},onModeChange:p=>{a(p);},onFocus:()=>{l(!0);},onBlur:()=>{l(!1);},value:F,onValueChange:p=>{e.onChange(x,p);},quote_dp:n,tips:c?d:void 0}};var Ee=e=>{let{mode:t,modes:r,onModeChange:n,onValueChange:o,quote:a,quote_dp:d,value:c,type:l,tips:x,onFocus:F,onBlur:O}=e,[y,P]=useState(t);useEffect(()=>{P(t),I(t==="Offset%"?"%":a);},[t]);let[k,I]=useState(t==="Offset%"?"%":a);useEffect(()=>{P(c?"":t);},[c]);let q=useMemo(()=>`${l.toLowerCase()}_${t.toLowerCase()}`,[]);return jsx(Input.tooltip,{prefix:y,size:"md",placeholder:k,id:q,align:"right",value:c,tooltip:x,tooltipProps:{content:{side:e.type==="TP"?"top":"bottom"}},"data-testid":e.testId,autoComplete:"off",onValueChange:o,formatters:[e.formatter({dp:d,mode:t,type:l}),inputFormatter.currencyFormatter],classNames:{root:l==="TP"?"oui-text-trade-profit":"oui-text-trade-loss",additional:"oui-text-base-contrast-54",input:"oui-text-inherit"},onFocus:()=>{P(""),I(""),F();},onBlur:()=>{P(c?"":t),I(t==="Offset%"?"%":a),O();},suffix:jsxs(Fragment,{children:[t==="Offset%"&&!!c&&jsx(Text,{size:"2xs",color:"inherit",className:"oui-ml-[2px]",children:"%"}),jsx(dt,{mode:t,modes:r,onModeChange:p=>n(p.value)})]})})},dt=e=>jsx(SimpleDropdownMenu,{currentValue:e.mode,menu:e.modes,align:"end",size:"xs",className:"oui-min-w-[80px]",onCloseAutoFocus:t=>t.preventDefault(),onSelect:t=>e.onModeChange(t),children:jsx("button",{className:"oui-p-2",children:jsx(CaretDownIcon,{size:12,color:"white"})})});var Se=e=>{let{testId:t,quote:r,...n}=e,o=Le(n);return jsx(Ee,{...o,testId:t,quote:r,type:e.type})};var $=createContext({}),Ne=$.Provider;var Re=e=>{let t=Me.useRef(null);return useEffect(()=>{e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET&&e.onSwitchChanged(!1);},[e.orderType]),e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET||e.isReduceOnly?null:jsxs("div",{children:[jsxs(Flex,{itemAlign:"center",gapX:1,children:[jsx(Switch,{id:"order_entry_tpsl",className:"oui-h-[14px]",checked:e.switchState,disabled:e.orderType!==OrderType.LIMIT&&e.orderType!==OrderType.MARKET||e.isReduceOnly,onCheckedChange:r=>{e.onSwitchChanged(r);}}),jsx("label",{htmlFor:"order_entry_tpsl",className:"oui-text-xs",children:"TP/SL"}),jsx(ExclamationFillIcon,{color:"white",size:14,opacity:1,className:"oui-text-white/[.36] hover:oui-text-white/80 oui-cursor-pointer",onClick:()=>{modal.dialog({title:"Tips",size:"xs",content:jsx(Text,{intensity:54,children:"TP/SL applies to the entire position. For partial TP/SL, set it in open positions."})});}})]}),jsx("div",{className:cn("oui-max-h-0 oui-overflow-hidden oui-transition-all",e.switchState&&"oui-max-h-[100px]"),onTransitionEnd:()=>{t.current?.style.setProperty("opacity",e.switchState?"1":"0");},children:jsx(ke,{ref:t,onChange:e.onChange,values:e.values,errors:e.errors,quote_dp:e.quote_dp})})]})},ke=Me.forwardRef((e,t)=>jsxs("div",{ref:t,className:"oui-transition-all oui-pt-2 oui-pb-2 oui-px-[1px] oui-space-y-1",children:[jsx(ie,{values:e.values.tp,type:"TP",children:jsx(Fe,{type:"TP",error:e.errors?e.errors.tp_trigger_price?.message:"",onChange:e.onChange,values:e.values.tp,quote_dp:e.quote_dp})}),jsx(ie,{values:e.values.sl,type:"SL",children:jsx(Fe,{type:"SL",error:e.errors?e.errors.sl_trigger_price?.message:"",onChange:e.onChange,values:e.values.sl,quote_dp:e.quote_dp})})]}));ke.displayName="TPSLInputForm";var Lt=e=>{let {errorMsgVisible:t}=useContext($),{tipsEle:r}=Z(),[n,o]=useState(`${e.type} Price`),[a,d]=useState("USDC"),[c,l]=useState(!1),x=useMemo(()=>e.error&&t?e.error:c?r:null,[e.error,t,c,r]);e.type==="SL"?"sl_trigger_price":"tp_trigger_price";return useEffect(()=>{o(e.values.trigger_price?e.type:`${e.type} Price`);},[e.values.trigger_price]),jsx(Input.tooltip,{prefix:n,size:"md",placeholder:a,align:"right",onFocus:()=>{o(e.type),d(""),l(!0);},onBlur:()=>{o(e.values.trigger_price?e.type:`${e.type} Price`),d("USDC"),l(!1);},tooltip:x,tooltipProps:{content:{side:e.type==="TP"?"top":"bottom"}},color:e.error?"danger":void 0,autoComplete:"off",value:e.values.trigger_price,classNames:{additional:"oui-text-base-contrast-54",root:"oui-pr-2 md:oui-pr-3",prefix:"oui-pr-1 md:oui-pr-2"},onValueChange:e.onChange,formatters:[inputFormatter.numberFormatter,inputFormatter.dpFormatter(e.quote_dp??2),inputFormatter.currencyFormatter]})},Fe=e=>{let t=e.type==="SL"?"sl_trigger_price":"tp_trigger_price";return jsxs(Grid,{cols:2,gapX:1,children:[jsx(Lt,{type:e.type,error:e.error,values:e.values??"",onChange:r=>{e.onChange(t,r);},quote_dp:e.quote_dp}),jsx(Se,{onChange:e.onChange,quote:"USDC",quote_dp:e.quote_dp,type:e.type,values:{PnL:e.values.PnL,Offset:e.values.Offset,"Offset%":e.values["Offset%"],ROI:e.values.ROI}})]})};var me=e=>{let{baseDP:t,quoteDP:r,order:n,onConfirm:o,onCancel:a}=e,{side:d,order_type:c,symbol:l}=n,[x,F]=useLocalStorage("orderly_order_confirm",!0);return jsxs(Fragment,{children:[jsxs(Flex,{justify:"between",children:[jsx(Text.formatted,{rule:"symbol",showIcon:!0,children:n.symbol}),jsxs(Flex,{justify:"end",gapX:1,children:[jsx(Mt,{type:n.order_type}),d===OrderSide.BUY?jsx(Badge,{color:"buy",size:"sm",children:"Buy"}):jsx(Badge,{color:"sell",size:"sm",children:"Sell"})]})]}),jsx(Divider,{className:"oui-my-4"}),jsxs("div",{className:textVariants({size:"sm",intensity:54,className:"oui-space-y-1"}),children:[jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Qty."}),jsx(Text.numeral,{rule:"price",dp:t,padding:!1,className:"oui-text-base-contrast",children:n.order_quantity})]}),n.trigger_price?jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Trigger"}),jsx(Text.numeral,{unit:"USDC",rule:"price",className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",dp:r,padding:!1,children:n.trigger_price})]}):null,jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Price"}),n.order_type===OrderType.MARKET||n.order_type===OrderType.STOP_MARKET?jsx(Text,{intensity:80,children:"Market"}):jsx(Text.numeral,{unit:"USDC",rule:"price",className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",dp:r,padding:!1,children:n.order_price})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"Est. Total"}),jsx(Text.numeral,{unit:"USDC",rule:"price",dp:r,padding:!1,className:"oui-text-base-contrast",unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:n.total})]})]}),n.tp_trigger_price||n.sl_trigger_price?jsxs(Fragment,{children:[jsx(Divider,{className:"oui-my-4"}),jsxs("div",{className:textVariants({size:"sm",intensity:54,className:"oui-space-y-1"}),children:[n.tp_trigger_price&&jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"TP Price"}),jsx(Text.numeral,{unit:"USDC",rule:"price",coloring:!0,dp:r,padding:!1,unitClassName:"oui-text-base-contrast-36 oui-ml-1",children:n.tp_trigger_price})]}),n.sl_trigger_price&&jsxs(Flex,{justify:"between",children:[jsx(Text,{children:"SL Price"}),jsx(Text.numeral,{unit:"USDC",rule:"price",coloring:!0,className:"oui-text-trade-loss",unitClassName:"oui-text-base-contrast-36 oui-ml-1",dp:r,padding:!1,children:n.sl_trigger_price})]})]})]}):null,jsxs(Flex,{gapX:1,pt:8,pb:3,children:[jsx(Checkbox,{id:"orderConfirm",color:"white",onCheckedChange:O=>{F(!O);}}),jsx("label",{htmlFor:"orderConfirm",className:textVariants({size:"xs",intensity:54}),children:"Disable order confirmation"})]}),jsxs(Grid,{cols:2,gapX:3,children:[jsx(Button,{color:"secondary",size:"md",onClick:()=>a(),children:"Cancel"}),jsx(Button,{size:"md",onClick:()=>o(),children:"Confirm"})]})]})};me.displayName="OrderConfirmDialog";var Mt=e=>{let t=useMemo(()=>{switch(e.type){case OrderType.LIMIT:return "Limit";case OrderType.MARKET:return "Market";case OrderType.STOP_LIMIT:return "Stop Limit";case OrderType.STOP_MARKET:return "Stop Market";default:return ""}},[e.type]);return jsx(Badge,{color:"neutral",size:"sm",children:t})},wt=e=>{let{close:t,resolve:r,reject:n,...o}=e;return jsx(me,{...o,onCancel:t,onConfirm:()=>{r(),t();}})},fe="orderConfirm";registerSimpleDialog(fe,wt,{size:"sm",title:"Order confirm"});var Be=e=>{let{pinned:t,orderTypeExtra:r}=e,n=o=>a=>{e.onValueChange&&e.onValueChange("order_type_ext",a?o:"");};return useEffect(()=>{e.onValueChange?.("visible_quantity",e.hidden?0:1);},[e.hidden]),jsxs("div",{className:"oui-text-base-contrast-54",children:[jsxs(Flex,{gapX:3,justify:t?"start":"between",mb:3,width:t?"unset":"100%",children:[jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_post_only",className:"oui-peer",color:"white",variant:"radio",disabled:!e.showExtra,checked:r===OrderType.POST_ONLY,onCheckedChange:n(OrderType.POST_ONLY)}),jsx("label",{htmlFor:"toggle_order_post_only",className:"oui-text-2xs oui-ml-1 peer-data-[disabled]:oui-text-base-contrast-20",children:"Post only"})]}),jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_iov",color:"white",className:"oui-peer",variant:"radio",checked:r===OrderType.IOC,onCheckedChange:n(OrderType.IOC),disabled:!e.showExtra}),jsx("label",{htmlFor:"toggle_order_iov",className:"oui-text-2xs oui-ml-1 peer-data-[disabled]:oui-text-base-contrast-20",children:"IOC"})]}),jsxs(Flex,{itemAlign:"center",children:[jsx(Checkbox,{id:"toggle_order_fok",color:"white",variant:"radio",className:"oui-peer",checked:r===OrderType.FOK,onCheckedChange:n(OrderType.FOK),disabled:!e.showExtra}),jsx("label",{htmlFor:"toggle_order_fok",className:"oui-text-2xs oui-ml-1 peer-data-[disabled]:oui-text-base-contrast-20",children:"FOK"})]})]}),jsxs(Flex,{gapX:6,children:[jsxs(Flex,{children:[jsx(Checkbox,{id:"toggle_order_confirm",color:"white",checked:e.needConfirm,onCheckedChange:o=>{e.setNeedConfirm(!!o);}}),jsx("label",{htmlFor:"toggle_order_confirm",className:"oui-text-2xs oui-ml-1",children:"Order confirm"})]}),jsxs(Flex,{children:[jsx(Checkbox,{id:"toggle_order_hidden",color:"white",checked:e.hidden,onCheckedChange:o=>{e.setHidden(o);}}),jsx("label",{htmlFor:"toggle_order_hidden",className:"oui-text-2xs oui-ml-1",children:"Hidden"})]})]}),!t&&jsxs(Fragment,{children:[jsx(Divider,{className:"oui-my-3"}),jsxs(Flex,{children:[jsx(Switch,{id:"toggle_order_keep_visible",onCheckedChange:o=>{e.setPinned(o);}}),jsx("label",{htmlFor:"toggle_order_keep_visible",className:"oui-text-2xs oui-ml-1",children:"Keep visible"})]})]})]})};var ze=()=>({});var ee=e=>{let t=ze();return jsx(Be,{...t,...e})};var ye=e=>{let{side:t,formattedOrder:r,setOrderValue:n,symbolInfo:o,maxQty:a,freeCollateral:d,helper:c,submit:l,metaState:x,refs:F}=e,{errors:O,validated:y}=x,[P,k]=useState(!1),[I,q]=useLocalStorage("orderly_order_confirm",!0),[p,M]=useLocalStorage("orderly-order-additional-pinned",!0),[s,V]=useLocalStorage("orderly-order-hidden",!1),oe=useMemo(()=>t===OrderSide.BUY?"Buy / Long":"Sell / Short",[t]);useEffect(()=>{y&&k(!0);},[y]),useEffect(()=>{let m=A=>{A.target.closest("#order-entry-submit-button")||k(X=>X&&!1);};return P?document.addEventListener("click",m):document.removeEventListener("click",m),()=>{document.removeEventListener("click",m);}},[P]);let ne=()=>{c.validate().then(m=>I?modal.show(fe,{order:r,quote:o.quote,base:o.base,quoteDP:o.quote_dp,baseDP:o.base_dp}):!0,m=>{k(!0);}).then(()=>l().then(()=>{n("order_quantity","");})).catch(m=>{m instanceof SDKError&&toast.error(`Error:${m.message}`);});};return jsx(Ne,{value:{errorMsgVisible:P},children:jsxs("div",{className:"oui-space-y-2 xl:oui-space-y-3 oui-text-base-contrast-54",ref:e.containerRef,children:[jsxs(Flex,{gapX:2,className:"oui-flex-col lg:oui-flex-row oui-gap-y-3",children:[jsxs("div",{className:"oui-grid oui-grid-cols-2 oui-w-full oui-flex-1 oui-gap-x-2 lg:oui-flex lg:oui-gap-x-[6px]",children:[jsx(Button,{onClick:()=>{e.setOrderValue("side",OrderSide.BUY);},size:"md",fullWidth:!0,"data-type":OrderSide.BUY,className:cn(t===OrderSide.BUY&&e.canTrade?"oui-bg-success-darken hover:oui-bg-success-darken/80 active:oui-bg-success-darken/80":"oui-bg-base-7 hover:oui-bg-base-6 active:oui-bg-base-6 oui-text-base-contrast-36"),children:"Buy"}),jsx(Button,{onClick:()=>{e.setOrderValue("side",OrderSide.SELL);},"data-type":OrderSide.SELL,fullWidth:!0,size:"md",className:cn(t===OrderSide.SELL&&e.canTrade?"oui-bg-danger-darken hover:oui-bg-danger-darken/80 active:oui-bg-danger-darken/80":"oui-bg-base-7 hover:oui-bg-base-6 active:oui-bg-base-6 oui-text-base-contrast-36"),children:"Sell"})]}),jsx("div",{className:"oui-w-full lg:oui-flex-1",children:jsx(sr,{type:r.order_type,side:t,canTrade:e.canTrade,onChange:m=>{n("order_type",m);}})})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Available"}),jsx(Text.numeral,{unit:o.quote,size:"2xs",className:"oui-text-base-contrast-80",unitClassName:"oui-ml-1 oui-text-base-contrast-54",dp:2,padding:!1,children:e.canTrade?d:0})]}),jsx(nr,{type:e.type,symbolInfo:o,values:{quantity:r.order_quantity,price:r.order_price,trigger_price:r.trigger_price,total:r.total},errors:y?O:null,onChange:(m,A)=>{e.setOrderValue(m,A);},refs:e.refs,onBlur:e.onBlur,onFocus:e.onFocus}),jsx(ar,{canTrade:e.canTrade,maxQty:a,currentQtyPercentage:e.currentQtyPercentage,value:r.order_quantity?Number(r.order_quantity):0,tick:o.base_tick,dp:o.base_dp,setMaxQty:e.setMaxQty,onValueChange:m=>{n("order_quantity",m);},side:e.side}),jsx(AuthGuard,{buttonProps:{fullWidth:!0},children:jsx(ThrottledButton,{fullWidth:!0,id:"order-entry-submit-button","data-type":OrderSide.BUY,className:cn(t===OrderSide.BUY?"orderly-order-entry-submit-button-buy oui-bg-success-darken hover:oui-bg-success-darken/80 active:oui-bg-success-darken/80":"orderly-order-entry-submit-button-sell oui-bg-danger-darken hover:oui-bg-danger-darken/80 active:oui-bg-danger-darken/80"),onClick:()=>{ne();},loading:e.isMutating,children:oe})}),jsx(lr,{canTrade:e.canTrade,quote:o.quote,estLiqPrice:e.estLiqPrice,estLeverage:e.estLeverage,currentLeverage:e.currentLeverage}),jsx(Divider,{className:"oui-w-full"}),jsx(Re,{quote_dp:e.symbolInfo.quote_dp,switchState:e.tpslSwitch,onSwitchChanged:e.setTpslSwitch,orderType:r.order_type,errors:y?O:null,isReduceOnly:r.reduce_only,values:{tp:{trigger_price:r.tp_trigger_price??"",PnL:r.tp_pnl??"",Offset:r.tp_offset??"","Offset%":r.tp_offset_percentage??"",ROI:r.tp_ROI??""},sl:{trigger_price:r.sl_trigger_price??"",PnL:r.sl_pnl??"",Offset:r.sl_offset??"","Offset%":r.sl_offset_percentage??"",ROI:r.sl_ROI??""}},onChange:(m,A)=>{e.setOrderValue(m,A);}}),jsxs(Flex,{justify:"between",itemAlign:"center",className:"!oui-mt-[0px] xl:!oui-mt-3",children:[jsxs(Flex,{itemAlign:"center",gapX:1,children:[jsx(Switch,{className:"oui-h-[14px]",id:"reduceOnly",checked:e.formattedOrder.reduce_only,onCheckedChange:m=>{e.setOrderValue("reduce_only",m),m&&e.setOrderValue("order_type_ext","");}}),jsx("label",{htmlFor:"reduceOnly",className:"oui-text-xs",children:"Reduce only"})]}),!p&&jsx(ur,{pinned:p,setPinned:M,needConfirm:I,setNeedConfirm:q,onValueChange:n,orderTypeExtra:r.order_type_ext,showExtra:r.order_type===OrderType.LIMIT&&!e.tpslSwitch,hidden:s,setHidden:V})]}),p&&jsxs(Box,{p:2,r:"md",intensity:700,position:"relative",children:[jsx(ee,{pinned:p,setPinned:M,needConfirm:I,setNeedConfirm:q,onValueChange:n,orderTypeExtra:r.order_type_ext,showExtra:r.order_type===OrderType.LIMIT&&!e.tpslSwitch,hidden:s,setHidden:V}),jsx(or,{onClick:()=>{M(!1);},className:"oui-absolute oui-top-2 oui-right-2 oui-group"})]})]})})},Qe="M10.007 1.302a.74.74 0 0 0-.486.214c-1.033.989-1.349 1.815-.972 2.948-.88.675-1.437.84-2.536.84-1.503 0-2.484.182-3.152.85v.02a1.583 1.583 0 0 0 0 2.248l1.867 1.882-3.181 3.18c-.26.26-.28.696-.02.956.261.26.699.26.959 0l3.193-3.194 1.87 1.861a1.585 1.585 0 0 0 2.25 0h.02c.668-.667.854-1.523.854-3.144 0-1.03.212-1.758.852-2.523 1.233.361 1.95.015 2.961-.995a.68.68 0 0 0 .188-.48c0-.234-.06-.593-.209-1.04a5.34 5.34 0 0 0-1.312-2.103 5.35 5.35 0 0 0-2.104-1.312c-.448-.15-.808-.208-1.042-.208",or=e=>{let[t,r]=useState(Qe);return jsx("button",{...e,children:jsx("svg",{width:16,height:16,viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",onMouseEnter:()=>{r('M10.008 1.302a.74.74 0 0 0-.486.214c-1.033.989-1.349 1.815-.972 2.948-.88.675-1.437.84-2.536.84-1.503 0-2.484.182-3.152.85v.02a1.583 1.583 0 0 0 0 2.248l1.867 1.882-3.181 3.18c-.26.26-.28.696-.02.956.261.26.699.26.959 0l3.193-3.194 1.87 1.861a1.585 1.585 0 0 0 2.25 0h.02c.668-.667.854-1.523.854-3.144 0-1.03.212-1.758.853-2.523 1.232.361 1.95.015 2.96-.995a.68.68 0 0 0 .188-.48c0-.234-.06-.593-.209-1.04a5.34 5.34 0 0 0-1.312-2.103A5.35 5.35 0 0 0 11.05 1.51c-.448-.15-.808-.208-1.042-.208m.258 1.37c.708.131 1.421.6 1.93 1.107.507.508.94 1.13 1.119 1.945-.636.61-1.026.658-1.662.323a.67.67 0 0 0-.779.117c-1.214 1.213-1.533 2.314-1.533 3.8 0 1.292-.076 1.773-.48 2.206-.113.123-.27.104-.374 0L3.799 7.486a.24.24 0 0 1-.017-.34c.239-.29.769-.515 2.226-.514 1.742.001 2.668-.448 3.812-1.52a.67.67 0 0 0 .125-.77c-.343-.686-.29-1.047.321-1.67"');},onMouseLeave:()=>{r(Qe);},children:jsx("path",{d:t,fill:"#608CFF"})})})},nr=e=>{let{type:t,symbolInfo:r,errors:n,values:o,onFocus:a,onBlur:d}=e,c=l=>n&&n[l]?n[l].message:"";return jsxs("div",{className:"oui-space-y-1",children:[t===OrderType.STOP_LIMIT||t===OrderType.STOP_MARKET?jsx("div",{className:"oui-group",children:jsx(W,{label:"Trigger",suffix:r.quote,error:c("trigger_price"),id:"trigger",ref:e.refs.triggerPriceInputRef,value:o.trigger_price,onChange:l=>{e.onChange("trigger_price",l);},formatters:[inputFormatter.dpFormatter(r.quote_dp)],onFocus:a(1),onBlur:d(1)})}):null,t===OrderType.LIMIT||t===OrderType.STOP_LIMIT?jsx("div",{className:"oui-group",children:jsx(W,{label:"Price",suffix:r.quote,id:"price",value:o.price,error:c("order_price"),ref:e.refs.priceInputRef,onChange:l=>{e.onChange("order_price",l);},formatters:[inputFormatter.dpFormatter(r.quote_dp)],onFocus:a(0),onBlur:d(0)})}):null,jsxs(Grid,{cols:2,className:"oui-space-x-1 oui-group",children:[jsx(W,{label:"Qty",suffix:r.base,id:"order_quantity_input",name:"order_quantity_input",className:"!oui-rounded-br !oui-rounded-tr",value:o.quantity,error:c("order_quantity"),onChange:l=>{e.onChange("order_quantity",l);},formatters:[inputFormatter.dpFormatter(r.base_dp)],onFocus:a(2),onBlur:d(2)}),jsx(W,{label:"Total\u2248",suffix:r.quote,id:"total",className:"!oui-rounded-bl !oui-rounded-tl",value:o.total,error:c("total"),onChange:l=>{e.onChange("total",l);},onFocus:a(3),onBlur:d(3),formatters:[inputFormatter.dpFormatter(r.quote_dp)]})]})]})},W=forwardRef((e,t)=>{let{errorMsgVisible:r}=useContext($),[n,o]=useState("0");return jsx(Input.tooltip,{ref:t,tooltip:r?e.error:void 0,autoComplete:"off",autoFocus:e.autoFocus,size:"lg",placeholder:n,id:e.id,name:e.name,color:e.error?"danger":void 0,prefix:jsx(ir,{id:e.id,children:e.label}),suffix:e.suffix,value:e.value||"",onValueChange:e.onChange,onFocus:a=>{o(""),e.onFocus?.(a);},onBlur:a=>{o("0"),e.onBlur?.(a);},formatters:[...e.formatters??[],inputFormatter.numberFormatter,inputFormatter.currencyFormatter],classNames:{root:cn("orderly-order-entry oui-relative oui-pt-8 oui-h-[54px] oui-px-2 oui-py-1 oui-pr-2 oui-border oui-border-solid oui-border-line oui-rounded group-first:oui-rounded-t-xl group-last:oui-rounded-b-xl",e.className),input:"oui-mt-5 oui-mb-1 oui-h-5",prefix:"oui-absolute oui-left-2 oui-top-[7px] oui-text-base-contrast-36",suffix:"oui-absolute oui-right-0 oui-top-0 oui-text-base-contrast-36 oui-text-2xs oui-justify-start oui-py-2"}})});W.displayName="CustomInput";var ir=e=>jsx("label",{htmlFor:e.id,className:"oui-absolute oui-left-2 oui-top-[7px] oui-text-base-contrast-36 oui-text-2xs",children:e.children}),ar=e=>{let{canTrade:t}=e,r=useMemo(()=>t?e.side===OrderSide.BUY?"buy":"sell":void 0,[e.side,t]),n=useMemo(()=>e.side===OrderSide.BUY?"Max buy":"Max sell",[e.side]);return jsxs("div",{children:[jsx(Slider.single,{disabled:e.maxQty===0||!t,value:e.value,color:r,markCount:4,showTip:!0,max:e.maxQty,step:e.tick,onValueChange:e.onValueChange}),jsxs(Flex,{justify:"between",className:"oui-pt-1 xl:oui-pt-2",children:[jsx(Text.numeral,{rule:"percentages",size:"2xs",color:r,dp:2,padding:!1,children:t?e.currentQtyPercentage:0}),jsxs(Flex,{children:[jsx("button",{className:textVariants({size:"2xs",className:"oui-mr-1"}),onClick:()=>e.setMaxQty(),children:n}),jsx(Text.numeral,{size:"2xs",color:r,dp:e.dp,padding:!1,children:t?e.maxQty:0})]})]})]})},sr=e=>{let t=[{label:"Limit order",value:OrderType.LIMIT},{label:"Market order",value:OrderType.MARKET},{label:"Stop limit",value:OrderType.STOP_LIMIT},{label:"Stop market",value:OrderType.STOP_MARKET}];return jsx(Select.options,{currentValue:e.type,value:e.type,options:t,onValueChange:e.onChange,contentProps:{className:"oui-bg-base-8 oui-w-full"},valueFormatter:(r,n)=>{let o=t.find(a=>a.value===r);return o?jsx(Text,{size:"xs",color:e.canTrade?e.side===OrderSide.BUY?"buy":"sell":void 0,children:o?.label.replace(" order","")}):jsx(Text,{size:"xs",children:n.placeholder})},size:"md"})};function lr(e){let{canTrade:t}=e;return jsxs("div",{className:"oui-space-y-[2px] xl:oui-space-y-1",children:[jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Est. Liq. price"}),jsx(Text.numeral,{unit:e.quote,size:"2xs",className:"oui-text-base-contrast-80",unitClassName:"oui-ml-1 oui-text-base-contrast-36",children:t?e.estLiqPrice??"--":"--"})]}),jsxs(Flex,{justify:"between",children:[jsx(Text,{size:"2xs",children:"Account leverage"}),jsxs(Flex,{gapX:1,className:textVariants({size:"2xs",intensity:80}),children:[jsx(Text.numeral,{unit:t?"x":void 0,children:t?e.currentLeverage??"--":"--"}),e.estLeverage&&jsxs(Fragment,{children:[jsx("svg",{width:"10",height:"10",viewBox:"0 0 10 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:jsx("path",{d:"M2.505 4.997c0-.23.186-.416.416-.416H6.07L4.833 3.332l.586-.585 1.964 1.95a.42.42 0 0 1 .122.3.42.42 0 0 1-.122.3l-1.964 1.95-.586-.585L6.07 5.413H2.921a.416.416 0 0 1-.416-.416",fill:"#fff",fillOpacity:".54"})}),jsx("span",{children:`${e.estLeverage}x`})]})]})]})]})}function ur(e){let[t,r]=useState(!1);return jsxs(PopoverRoot,{open:t,onOpenChange:r,children:[jsx(PopoverTrigger,{asChild:!0,children:jsx("button",{onClick:()=>{r(!0);},children:jsx("svg",{width:"16",height:"16",viewBox:"0 0 16 16",fill:"currentColor",xmlns:"http://www.w3.org/2000/svg",className:"oui-fill-white/[.36] hover:oui-fill-white/80",children:jsx("path",{d:"M3.332 2.665a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V3.332a.667.667 0 0 0-.667-.667zm-8 4a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667V7.332a.667.667 0 0 0-.667-.667zm-8 4a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667zm4 0a.667.667 0 0 0-.667.667v1.333c0 .368.299.667.667.667h1.333a.667.667 0 0 0 .667-.667v-1.333a.667.667 0 0 0-.667-.667z"})})})}),jsx(PopoverContent,{side:"top",align:"end",className:"oui-w-[230px]",children:jsx(ee,{...e})})]})}var He=e=>{let[t,r]=useLocalStorage("orderly-order-entry-order-type",OrderType.LIMIT),[n,o]=useLocalStorage("orderly-order-entry-order-side",OrderSide.BUY),{formattedOrder:a,setValue:d,setValues:c,symbolInfo:l,...x}=useOrderEntry(e.symbol,{initialOrder:{symbol:e.symbol,order_type:t,side:n}}),[F,O]=useLocalStorage("orderly-order-entry-tp_sl-switch",!1),{state:y}=useAccount(),{wrongNetwork:P}=useAppContext(),k=useMemo(()=>y.status===AccountStatusEnum.EnableTrading&&!P,[y.status,P]),{currentLeverage:I}=useMarginRatio(),q=useEventEmitter(),p=useRef(4),M=useRef(null),s=useRef(null),V=useMemo(()=>Number(a.order_quantity)>=Number(x.maxQty)?1:convertValueToPercentage(Number(a.order_quantity??0),0,x.maxQty)/100,[a.order_quantity,x.maxQty]),oe=()=>{if(l.base_tick<1)return;let f=utils.formatNumber(a?.order_quantity,new Decimal(l?.base_tick||"0").toNumber());d("order_quantity",f,{shouldUpdateLastChangedField:!1});},ne=f=>v=>{p.current=f;},m=f=>v=>{setTimeout(()=>{p.current===f&&(p.current=4);},300),(f===2||f===3)&&oe();};useEffect(()=>{let f=v=>{if(p.current===1)(a.order_type===OrderType.STOP_LIMIT||a.order_type===OrderType.STOP_MARKET)&&(d("trigger_price",removeTrailingZeros(v[0])),H(M.current));else if(a.order_type===OrderType.STOP_LIMIT||a.order_type===OrderType.LIMIT)d("order_price",removeTrailingZeros(v[0])),H(s.current);else {let z;a.order_type===OrderType.STOP_MARKET?z=OrderType.STOP_LIMIT:a.order_type===OrderType.MARKET&&(z=OrderType.LIMIT),typeof z<"u"&&d("order_type",z),d("order_price",removeTrailingZeros(v[0])),H(s.current);}function H(z){setTimeout(()=>{z?.focus();},0);}};return q.on("orderbook:item:click",f),()=>{q.off("orderbook:item:click",f);}},[a.order_type,a.order_quantity,l]);let A=()=>{c({tp_trigger_price:"",sl_trigger_price:""});},he=()=>{c({order_type_ext:void 0});},X=()=>{d("order_quantity",x.maxQty);},$e=(f,v,H)=>{d(f,v,H),f==="order_type"&&r(v),f==="side"&&o(v),(f==="reduce_only"&&v||f==="order_type"&&(v===OrderType.STOP_LIMIT||v===OrderType.STOP_MARKET))&&A();},Ye=f=>{O(f),f?he():A();};return {...x,currentQtyPercentage:V,side:a.side,type:a.order_type,setOrderValue:$e,currentLeverage:I,formattedOrder:a,tpslSwitch:F,setTpslSwitch:Ye,setMaxQty:X,symbolInfo:l,onFocus:ne,onBlur:m,refs:{triggerPriceInputRef:M,priceInputRef:s},canTrade:k}};var Pr=e=>{let t=He(e);return jsx(ye,{...t,containerRef:e.containerRef})};
10
11
 
11
- export { $ as AdditionalInfoWidget, Z as OrderConfirmDialog, te as OrderEntry, $t as OrderEntryWidget };
12
+ export { ee as AdditionalInfoWidget, me as OrderConfirmDialog, ye as OrderEntry, Pr as OrderEntryWidget };
12
13
  //# sourceMappingURL=out.js.map
13
14
  //# sourceMappingURL=index.mjs.map