@kodiak-finance/orderly-ui-orders 2.9.2 → 2.9.4

package/dist/index.js

@@ -592,7 +592,7 @@ var init_confirmContent = __esm({
         /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
-            className: "oui-absolute oui-right-0 oui-top-0 oui-text-base-contrast-54",
+            className: "oui-absolute oui-end-0 oui-top-0 oui-text-base-contrast-54",
             onClick: cancelPopover,
             children: /* @__PURE__ */ jsxRuntime.jsx(orderlyUi.CloseIcon, { size: 16, color: "white", opacity: 1 })
           }
@@ -740,7 +740,7 @@ var init_editableCellInput = __esm({
           ],
           classNames: {
             root: "oui-bg-base-700 oui-px-2 oui-py-1 oui-rounded",
-            input: "oui-pr-2"
+            input: "oui-pe-2"
           },
           readOnly: props.readonly,
           suffix: /* @__PURE__ */ jsxRuntime.jsxs(orderlyUi.Flex, { gapX: 1, children: [
@@ -1284,7 +1284,7 @@ var init_innerInput = __esm({
           color: open ? "danger" : void 0,
           classNames: {
             root: "oui-bg-base-700 oui-px-2 oui-py-1 oui-rounded",
-            input: "oui-pr-2"
+            input: "oui-pe-2"
           },
           suffix: /* @__PURE__ */ jsxRuntime.jsx("button", { onClick, children: /* @__PURE__ */ jsxRuntime.jsx(
             orderlyUi.CheckIcon,
@@ -2014,6 +2014,29 @@ var init_triggerPriceCell = __esm({
     };
   }
 });
+var OrderSymbolCell;
+var init_orderSymbolCell = __esm({
+  "src/components/orderList/desktop/orderSymbolCell.tsx"() {
+    OrderSymbolCell = (props) => {
+      const { symbol, onSymbolChange } = props;
+      const { brokerId, brokerName, brokerNameRaw } = orderlyHooks.useBadgeBySymbol(symbol);
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        orderlyUi.Text.symbolBadge,
+        {
+          className: "oui-cursor-pointer",
+          badge: brokerName ?? brokerId ?? void 0,
+          fullName: brokerNameRaw,
+          onClick: (e) => {
+            onSymbolChange?.({ symbol });
+            e.stopPropagation();
+            e.preventDefault();
+          },
+          children: symbol
+        }
+      );
+    };
+  }
+});
 var Renew;
 var init_renew = __esm({
   "src/components/orderList/desktop/renew.tsx"() {
@@ -2286,7 +2309,7 @@ var init_tpslTriggerPrice = __esm({
                   orderlyUiTpsl.CloseToLiqPriceIcon,
                   {
                     slPriceError: props.slPriceError,
-                    className: "oui-ml-1"
+                    className: "oui-ms-1"
                   }
                 )
               },
@@ -2348,7 +2371,7 @@ var init_tpslTriggerPrice = __esm({
       const type = orderType === orderlyTypes.AlgoOrderType.TAKE_PROFIT ? "TP" : "SL";
       const label = type === "TP" ? `${t("tpsl.tpPnl")}:` : `${t("tpsl.slPnl")}:`;
       return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center", children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oui-text-base-contrast-54 oui-mr-1", children: label }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oui-text-base-contrast-54 oui-me-1", children: label }),
         /* @__PURE__ */ jsxRuntime.jsx(
           orderlyUi.Text.numeral,
           {
@@ -2360,7 +2383,7 @@ var init_tpslTriggerPrice = __esm({
               // @ts-ignore
               /* @__PURE__ */ jsxRuntime.jsx("span", { children: pnl === 0 ? "" : pnl > 0 ? "+" : "-" })
             ),
-            suffix: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oui-text-base-contrast-36 oui-ml-1", children: "USDC" }),
+            suffix: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "oui-text-base-contrast-36 oui-ms-1", children: "USDC" }),
             children: `${Math.abs(pnl)}`
           }
         )
@@ -2372,7 +2395,7 @@ function instrument(option) {
   return {
     title: orderlyI18n.i18n.t("common.symbol"),
     dataIndex: "symbol",
-    fixed: "left",
+    fixed: "start",
     // className: "oui-h-[48px]",
     width: option?.width,
     onSort: option?.enableSort ? (r1, r2) => {
@@ -2390,23 +2413,17 @@ function instrument(option) {
           "div",
           {
             className: orderlyUi.cn(
-              "oui-h-7 oui-w-1 oui-shrink-0 oui-rounded-[1px]",
+              "oui-h-[34px] oui-w-1 oui-shrink-0 oui-rounded-[1px]",
               record.side === orderlyTypes.OrderSide.BUY ? "oui-bg-trade-profit" : "oui-bg-trade-loss"
             )
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsxs(orderlyUi.Flex, { direction: "column", itemAlign: "start", gap: 1, children: [
           /* @__PURE__ */ jsxRuntime.jsx(
-            orderlyUi.Text.formatted,
+            OrderSymbolCell,
             {
-              size: "xs",
-              className: "oui-cursor-pointer oui-text-xs",
-              onClick: (e) => {
-                option?.onSymbolChange?.({ symbol: value });
-                e.stopPropagation();
-                e.preventDefault();
-              },
-              children: `${value.split("_")[1]}-PERP`
+              symbol: value,
+              onSymbolChange: option?.onSymbolChange
             }
           ),
           option?.showType && /* @__PURE__ */ jsxRuntime.jsx(orderlyUi.Flex, { direction: "row", gap: 1, wrap: "wrap", children: parseBadgesFor(record)?.map((e, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -2684,10 +2701,9 @@ function realizedPnL(option) {
       const value = new orderlyUtils.Decimal(_value ?? 0).toNumber();
       return /* @__PURE__ */ jsxRuntime.jsxs(orderlyUi.Flex, { gap: 1, children: [
         /* @__PURE__ */ jsxRuntime.jsx(
-          orderlyUi.Text.numeral,
+          orderlyUi.Text.pnl,
           {
             dp,
-            rm: orderlyUtils.Decimal.ROUND_DOWN,
             padding: false,
             intensity: (value ?? 0) == 0 ? 80 : void 0,
             showIdentifier: (value ?? 0) > 0,
@@ -2847,7 +2863,7 @@ function cancelBtn(option) {
     width: option?.width,
     className: option?.className,
     align: "right",
-    fixed: "right",
+    fixed: "end",
     render: (_, record) => {
       if (record.status === orderlyTypes.OrderStatus.CANCELLED) {
         return /* @__PURE__ */ jsxRuntime.jsx(Renew, { record });
@@ -2867,7 +2883,7 @@ function pendingTabCancelBtn(option) {
     width: option?.width,
     className: option?.className,
     align: "right",
-    fixed: "right",
+    fixed: "end",
     render: (_, record) => {
       return /* @__PURE__ */ jsxRuntime.jsx(CancelButton, { order: record });
     }
@@ -2881,7 +2897,7 @@ function tpslAction(option) {
     width: option?.width,
     className: option?.className,
     align: "right",
-    fixed: "right",
+    fixed: "end",
     render: (_, record) => {
       return /* @__PURE__ */ jsxRuntime.jsxs(orderlyUi.Flex, { gap: 3, children: [
         /* @__PURE__ */ jsxRuntime.jsx(TP_SLEditButton, { order: record }),
@@ -2938,6 +2954,7 @@ var init_useColumn = __esm({
     init_quantityCell();
     init_trailingCallbackCell();
     init_triggerPriceCell();
+    init_orderSymbolCell();
     init_renew();
     init_tpslEdit();
     init_tpslPrice();
@@ -2965,7 +2982,7 @@ var init_useColumn = __esm({
               fillAndQuantity({
                 width: 130,
                 disableEdit: true,
-                className: "oui-pl-0 oui-pr-0",
+                className: "oui-ps-0 oui-pe-0",
                 enableSort: false
               }),
               price({
@@ -3002,12 +3019,12 @@ var init_useColumn = __esm({
               // side({ width: 162 }),
               fillAndQuantity({
                 width: 162,
-                className: "oui-pr-0",
+                className: "oui-pe-0",
                 enableSort: false
               }),
-              price({ width: 162, className: "oui-pr-0", enableSort: false }),
+              price({ width: 162, className: "oui-pe-0", enableSort: false }),
               trailingCallback({ width: 162 }),
-              triggerPrice({ width: 162, className: "oui-pr-0", isPending: true }),
+              triggerPrice({ width: 162, className: "oui-pe-0", isPending: true }),
               bracketOrderPrice({ width: 130 }),
               estTotal({ width: 162, isPending: true }),
               reduceOnly({ width: 162 }),
@@ -3044,7 +3061,7 @@ var init_useColumn = __esm({
               fillAndQuantity({
                 width: 124,
                 disableEdit: true,
-                className: "oui-pl-0 oui-pr-0"
+                className: "oui-ps-0 oui-pe-0"
               }),
               price({
                 width: 124,
@@ -3079,7 +3096,7 @@ var init_useColumn = __esm({
               fillAndQuantity({
                 width: 124,
                 disableEdit: true,
-                className: "oui-pl-0 oui-pr-0",
+                className: "oui-ps-0 oui-pe-0",
                 enableSort: false
               }),
               price({ width: 124, disableEdit: true, enableSort: false }),
@@ -3102,7 +3119,7 @@ var init_useColumn = __esm({
               fillAndQuantity({
                 width: 124,
                 disableEdit: true,
-                className: "oui-pl-0 oui-pr-0"
+                className: "oui-ps-0 oui-pe-0"
               }),
               price({ width: 124, disableEdit: true }),
               avgOpen({ width: 124 }),
@@ -3125,7 +3142,7 @@ var init_useColumn = __esm({
               fillAndQuantity({
                 width: 150,
                 disableEdit: true,
-                className: "oui-pl-6 oui-pr-0"
+                className: "oui-ps-6 oui-pe-0"
               }),
               price({
                 width: 124,
@@ -3465,7 +3482,7 @@ var init_items = __esm({
                 }
               ),
               classNames: {
-                content: "oui-bg-base-6 oui-ml-2",
+                content: "oui-bg-base-6 oui-ms-2",
                 arrow: "oui-fill-base-6"
               },
               children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3518,7 +3535,7 @@ var init_items = __esm({
                 }
               ),
               classNames: {
-                content: "oui-bg-base-6 oui-ml-2",
+                content: "oui-bg-base-6 oui-ms-2",
                 arrow: "oui-fill-base-6"
               },
               children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3562,7 +3579,7 @@ var init_items = __esm({
             children: tp_order_price
           }
         );
-      }, [tp_order_price]);
+      }, [props.quote_dp, t, tp_order_price]);
       return /* @__PURE__ */ jsxRuntime.jsx(
         orderlyUi.Statistic,
         {
@@ -3595,7 +3612,7 @@ var init_items = __esm({
             children: sl_order_price
           }
         );
-      }, [sl_order_price]);
+      }, [props.quote_dp, sl_order_price, t]);
       return /* @__PURE__ */ jsxRuntime.jsx(
         orderlyUi.Statistic,
         {
@@ -3820,7 +3837,7 @@ var init_bracketOrderPrice_ui = __esm({
           MobileTooltip,
           {
             classNames: {
-              content: "oui-bg-base-6 oui-ml-2",
+              content: "oui-bg-base-6 oui-ms-2",
               arrow: "oui-fill-base-6"
             },
             content: /* @__PURE__ */ jsxRuntime.jsxs(orderlyUi.Flex, { direction: "column", itemAlign: "start", gap: 1, children: [
@@ -5060,7 +5077,7 @@ var init_editBtn_script = __esm({
           }).catch((error) => {
           });
         }
-      }, [state]);
+      }, [editAlgoOrder, editOrder, position, state, symbolInfo, t]);
       return {
         ...state,
         onShowEditSheet