@orderly.network/hooks 3.0.0-beta.0 → 3.0.0-beta.10

package/dist/index.js

@@ -1,10 +1,10 @@
 'use strict';
 
-var net = require('@orderly.network/net');
 var React = require('react');
+var net = require('@orderly.network/net');
 var useSWR5 = require('swr');
-var types = require('@orderly.network/types');
 var pluginCore = require('@orderly.network/plugin-core');
+var types = require('@orderly.network/types');
 var utils = require('@orderly.network/utils');
 var useSWRMutation = require('swr/mutation');
 var useConstant = require('use-constant');
@@ -61,13 +61,24 @@ var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
 };
+var MarketCategoriesConfigContext = React.createContext(void 0);
+var MarketCategoriesConfigProvider = ({ value, children }) => {
+  return React.createElement(
+    MarketCategoriesConfigContext.Provider,
+    { value },
+    children
+  );
+};
+function useMarketCategoriesConfig() {
+  return React.useContext(MarketCategoriesConfigContext);
+}
 
 // src/version.ts
 if (typeof window !== "undefined") {
   window.__ORDERLY_VERSION__ = window.__ORDERLY_VERSION__ || {};
-  window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "3.0.0-beta.0";
+  window.__ORDERLY_VERSION__["@orderly.network/hooks"] = "3.0.0-beta.10";
 }
-var version_default = "3.0.0-beta.0";
+var version_default = "3.0.0-beta.10";
 var fetcher = (url, init2 = {}, queryOptions) => net.get(url, init2, queryOptions?.formatter);
 var noCacheConfig = {
   dedupingInterval: 0,
@@ -98,6 +109,8 @@ function useConfig(key, defaultValue) {
   }
   return configStore;
 }
+
+// src/useQuery.ts
 var PLUGIN_ID_HEADER = "X-Orderly-Plugin-Id";
 var useQuery = (query, options) => {
   const apiBaseUrl = useConfig("apiBaseUrl");
@@ -594,6 +607,20 @@ var useAudioPlayer = (src, options = {}) => {
     const el = getOrderFilledAudio();
     el.volume = Math.max(0, Math.min(1, volume));
   }, [volume]);
+  React.useEffect(() => {
+    const handleVisibilityChange = () => {
+      if (document.visibilityState === "visible") {
+        const el = getOrderFilledAudio();
+        el.pause();
+        el.removeAttribute("src");
+        el.load();
+      }
+    };
+    document.addEventListener("visibilitychange", handleVisibilityChange);
+    return () => {
+      document.removeEventListener("visibilitychange", handleVisibilityChange);
+    };
+  }, []);
   const play = React.useCallback(() => {
     const currentSrc = srcRef.current;
     const currentEnabled = enabledRef.current;
@@ -1303,7 +1330,7 @@ function checkTPSLOrderTypeIsMarket(key, values) {
 }
 function tpslCalculateHelper(key, inputs, options = {}) {
   const { symbol } = options;
-  if (key !== "quantity" && key !== "tp_trigger_price" && key !== "sl_trigger_price" && key !== "tp_pnl" && key !== "sl_pnl" && key !== "tp_offset" && key !== "sl_offset" && key !== "tp_offset_percentage" && key !== "sl_offset_percentage" && key !== "tp_order_price" && key !== "sl_order_price" && key !== "tp_order_type" && key !== "sl_order_type") {
+  if (key !== "quantity" && key !== "tp_trigger_price" && key !== "sl_trigger_price" && key !== "tp_pnl" && key !== "sl_pnl" && key !== "tp_offset" && key !== "sl_offset" && key !== "tp_offset_percentage" && key !== "sl_offset_percentage" && key !== "tp_offset_from_mark" && key !== "sl_offset_from_mark" && key !== "tp_offset_percentage_from_mark" && key !== "sl_offset_percentage_from_mark" && key !== "tp_order_price" && key !== "sl_order_price" && key !== "tp_order_type" && key !== "sl_order_type") {
     return {
       [key]: inputs.value
     };
@@ -1311,6 +1338,7 @@ function tpslCalculateHelper(key, inputs, options = {}) {
   const orderType = key.startsWith("tp_") ? types.AlgoOrderType.TAKE_PROFIT : types.AlgoOrderType.STOP_LOSS;
   const keyPrefix = key.slice(0, 3);
   const qty = Number(key === "quantity" ? inputs.value : inputs.qty);
+  const markPrice = inputs.markPrice ?? inputs.entryPrice;
   if (qty === 0 && (key === "tp_pnl" || key === "sl_pnl" || key === "tp_trigger_price" || key === "sl_trigger_price")) {
     return {
       // [`${keyPrefix}trigger_price`]: "",
@@ -1321,7 +1349,7 @@ function tpslCalculateHelper(key, inputs, options = {}) {
       [key]: inputs.value
     };
   }
-  let trigger_price, offset, offset_percentage, pnl, order_price, tpsl_order_type = inputs.values[`${keyPrefix}order_type`] ?? types.OrderType.MARKET;
+  let trigger_price, offset, offset_percentage, offset_from_mark, offset_percentage_from_mark, pnl, order_price, tpsl_order_type = inputs.values[`${keyPrefix}order_type`] ?? types.OrderType.MARKET;
   const entryPrice = new utils.Decimal(inputs.entryPrice).todp(options.symbol?.quote_dp ?? 2, utils.Decimal.ROUND_UP).toNumber();
   switch (key) {
     case "tp_trigger_price":
@@ -1333,6 +1361,8 @@ function tpslCalculateHelper(key, inputs, options = {}) {
             [`${keyPrefix}trigger_price`]: trigger_price,
             [`${keyPrefix}offset`]: "",
             [`${keyPrefix}offset_percentage`]: "",
+            [`${keyPrefix}offset_from_mark`]: "",
+            [`${keyPrefix}offset_percentage_from_mark`]: "",
             [`${keyPrefix}pnl`]: "",
             [`${keyPrefix}ROI`]: ""
           };
@@ -1342,31 +1372,6 @@ function tpslCalculateHelper(key, inputs, options = {}) {
       }
       break;
     }
-    // case "tp_enable":
-    // case "sl_enable": {
-    //   return {
-    //     [`${keyPrefix}enable`]: inputs.value,
-    //     [`${keyPrefix}order_type`]: OrderType.MARKET,
-    //     [`${keyPrefix}trigger_price`]: "",
-    //     [`${keyPrefix}order_price`]: "",
-    //     [`${keyPrefix}offset`]: "",
-    //     [`${keyPrefix}offset_percentage`]: "",
-    //     [`${keyPrefix}pnl`]: "",
-    //     [`${keyPrefix}ROI`]: "",
-    //   };
-    // }
-    // case 'tp_pnl':{
-    //   if (inputs.values.tp_order_type !== OrderType.MARKET) {
-    //     pnl = inputs.value;
-    //     trigger_price = pnlToPrice({
-    //     qty,
-    //     pnl: Number(inputs.value),
-    //     entryPrice,
-    //     orderSide: inputs.orderSide,
-    //     orderType,
-    //     })
-    //   }
-    // }
     case "tp_pnl":
     case "sl_pnl": {
       pnl = inputs.value;
@@ -1413,6 +1418,30 @@ function tpslCalculateHelper(key, inputs, options = {}) {
       }
       break;
     }
+    case "tp_offset_from_mark":
+    case "sl_offset_from_mark": {
+      offset_from_mark = inputs.value;
+      if (!checkTPSLOrderTypeIsMarket(key, inputs.values)) {
+        order_price = offsetToPrice({
+          qty,
+          offset: Number(inputs.value),
+          entryPrice: markPrice,
+          orderSide: inputs.orderSide,
+          orderType: key === "tp_offset_from_mark" ? types.AlgoOrderType.TAKE_PROFIT : types.AlgoOrderType.STOP_LOSS
+        });
+        trigger_price = inputs.values[`${keyPrefix}trigger_price`] ?? order_price;
+      } else {
+        trigger_price = offsetToPrice({
+          qty,
+          offset: Number(inputs.value),
+          // entryPrice,
+          entryPrice: markPrice,
+          orderSide: inputs.orderSide,
+          orderType: key === "tp_offset_from_mark" ? types.AlgoOrderType.TAKE_PROFIT : types.AlgoOrderType.STOP_LOSS
+        });
+      }
+      break;
+    }
     case "tp_order_price":
     case "sl_order_price": {
       order_price = inputs.value;
@@ -1453,12 +1482,38 @@ function tpslCalculateHelper(key, inputs, options = {}) {
       }
       break;
     }
+    case "tp_offset_percentage_from_mark":
+    case "sl_offset_percentage_from_mark": {
+      offset_percentage_from_mark = inputs.value;
+      const markBase = Number(markPrice);
+      if (!checkTPSLOrderTypeIsMarket(key, inputs.values)) {
+        order_price = offsetPercentageToPrice({
+          qty,
+          percentage: Number(`${inputs.value}`.replace(/\.0{0,2}$/, "")),
+          entryPrice: markBase,
+          orderSide: inputs.orderSide,
+          orderType
+        });
+        trigger_price = inputs.values[`${keyPrefix}trigger_price`] ?? order_price;
+      } else {
+        trigger_price = offsetPercentageToPrice({
+          qty,
+          percentage: Number(`${inputs.value}`.replace(/\.0{0,2}$/, "")),
+          entryPrice: markBase,
+          orderSide: inputs.orderSide,
+          orderType
+        });
+      }
+      break;
+    }
   }
   if (!trigger_price && checkTPSLOrderTypeIsMarket(key, inputs.values)) {
     return {
       [`${keyPrefix}trigger_price`]: "",
       [`${keyPrefix}offset`]: "",
       [`${keyPrefix}offset_percentage`]: "",
+      [`${keyPrefix}offset_from_mark`]: "",
+      [`${keyPrefix}offset_percentage_from_mark`]: "",
       [`${keyPrefix}pnl`]: "",
       [`${keyPrefix}ROI`]: "",
       [key]: inputs.value
@@ -1503,6 +1558,8 @@ function tpslCalculateHelper(key, inputs, options = {}) {
     [`${keyPrefix}order_price`]: order_price ? utils.todpIfNeed(order_price, symbol?.quote_dp ?? 2) : "",
     [`${keyPrefix}offset`]: offset ?? "",
     [`${keyPrefix}offset_percentage`]: offset_percentage ?? "",
+    [`${keyPrefix}offset_from_mark`]: offset_from_mark ?? inputs.values[`${keyPrefix}offset_from_mark`] ?? "",
+    [`${keyPrefix}offset_percentage_from_mark`]: offset_percentage_from_mark ?? inputs.values[`${keyPrefix}offset_percentage_from_mark`] ?? "",
     [`${keyPrefix}pnl`]: pnl ?? ""
     // [`${keyPrefix}ROI`]: calcROI({
     //   pnl: Number(pnl ?? 0),
@@ -1690,6 +1747,7 @@ function tpslInputHandle(inputs) {
       // order price or mark price
       qty: values.side === types.OrderSide.BUY ? Number(values.order_quantity) : Number(values.order_quantity) * -1,
       orderSide: values.side,
+      markPrice,
       // values: newValues,
       values
     },
@@ -1725,6 +1783,10 @@ var getCalculateHandler = (fieldName) => {
     case "sl_offset":
     case "tp_offset_percentage":
     case "sl_offset_percentage":
+    case "tp_offset_from_mark":
+    case "sl_offset_from_mark":
+    case "tp_offset_percentage_from_mark":
+    case "sl_offset_percentage_from_mark":
     case "tp_order_price":
     case "tp_order_type":
     case "sl_order_type":
@@ -2608,16 +2670,12 @@ var createDataStore = (config) => {
               const brokerIdQuery = typeof options?.brokerId === "string" && options?.brokerId !== "orderly" ? `?broker_id=${options?.brokerId}` : "";
               const url = `${dynamicBaseUrl || baseUrl || ""}${endpoint}${brokerIdQuery}`;
               const data = await fetcher(url, {}, { formatter });
-              const dataWithBrokerId = data.map((item) => ({
-                ...item,
-                broker_id: options?.brokerId
-              }));
               set({
-                data: dataWithBrokerId,
+                data,
                 loading: false,
                 error: null
               });
-              return dataWithBrokerId;
+              return data;
             } catch (error) {
               set({ error, loading: false });
               return null;
@@ -3153,7 +3211,9 @@ var DEFAULT_SYMBOL_DEPTHS = {
 };
 var DEFAULT_SYMBOL_DISPLAY_NAMES = {
   PERP_XAU_USDC: "XAU (Gold) ",
-  PERP_XAG_USDC: "XAG (Silver)"
+  PERP_XAG_USDC: "XAG (Silver)",
+  PERP_CL_USDC: "CL (WTI Crude Oil)",
+  PERP_BZ_USDC: "BZ (Brent Crude Oil)"
 };
 var ProxyConfigStore = class {
   constructor(_originConfigStore) {
@@ -3436,7 +3496,10 @@ var useGetRwaSymbolOpenTimeInterval = (symbol, thresholdMinutes = 30) => {
 };
 var useSymbolsInfo = () => {
   const symbolsInfo = useAppStore((state) => state.symbolsInfo);
-  return React.useMemo(() => createGetter({ ...symbolsInfo }), [symbolsInfo]);
+  return React.useMemo(
+    () => createGetter(symbolsInfo ? { ...symbolsInfo } : symbolsInfo),
+    [symbolsInfo]
+  );
 };
 var useSymbolsInfoStore = () => {
   return useAppStore((state) => state.symbolsInfo);
@@ -3449,6 +3512,7 @@ var MarketsType = /* @__PURE__ */ ((MarketsType2) => {
   MarketsType2[MarketsType2["ALL"] = 2] = "ALL";
   MarketsType2[MarketsType2["RWA"] = 3] = "RWA";
   MarketsType2[MarketsType2["NEW_LISTING"] = 4] = "NEW_LISTING";
+  MarketsType2[MarketsType2["COMMUNITY"] = 5] = "COMMUNITY";
   return MarketsType2;
 })(MarketsType || {});
 var MarketsStorageKey = "orderly_markets";
@@ -3618,6 +3682,8 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
     const rwaInfo = !rwaSymbolsInfo.isNil ? rwaSymbolsInfo[item.symbol]() : null;
     return {
       ...item,
+      broker_id: item.broker_id,
+      display_symbol_name: item.display_symbol_name,
       quote_dp: info("quote_dp"),
       created_time: info("created_time"),
       displayName: info("displayName"),
@@ -3639,7 +3705,7 @@ var addFieldToMarkets = (futures, symbolsInfo, rwaSymbolsInfo) => {
 var filterMarkets = (params) => {
   const { markets, favorites, recent, newListing, type } = params;
   let curData = [];
-  if (type === 2 /* ALL */) {
+  if (type === 2 /* ALL */ || type === 5 /* COMMUNITY */) {
     curData = markets;
   } else if (type === 3 /* RWA */) {
     curData = markets.filter((item) => item.isRwa);
@@ -4561,7 +4627,7 @@ var useMarket = (type) => {
   const getData = (type2) => {
     const localData = type2 === 0 /* FAVORITES */ ? [...favorites] : [...recent];
     const keys = localData.map((item) => item.name);
-    const filter = type2 == 2 /* ALL */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
+    const filter = type2 == 2 /* ALL */ || type2 == 4 /* COMMUNITY */ ? marketsList : marketsList?.filter((item) => keys.includes(item.symbol));
     const favoritesData = [...favorites];
     const favoriteKeys = favoritesData.map((item) => item.name);
     if (filter) {
@@ -4760,6 +4826,80 @@ var useSymbolLeverageMap = () => {
     refresh: mutate6
   };
 };
+
+// src/trading-rewards/useAllBrokers.ts
+var useAllBrokers = () => {
+  const { data } = useQuery("/v1/public/broker/name", {
+    formatter: (res) => {
+      const { rows } = res;
+      return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
+    },
+    revalidateOnFocus: false
+  });
+  return [data];
+};
+
+// src/useBadgeBySymbol.ts
+function brokerNameBaseFromRaw(rawBrokerName) {
+  if (!rawBrokerName) return void 0;
+  const first = rawBrokerName.trim().split(/[ _-]/, 1)[0]?.trim() ?? "";
+  return first.length > 0 ? first : void 0;
+}
+var useBadgeBySymbol = (symbol) => {
+  const symbolsInfo = useSymbolsInfo();
+  const [brokers] = useAllBrokers();
+  return React.useMemo(() => {
+    if (!symbol || symbolsInfo.isNil) {
+      return {
+        displayName: symbol ?? "",
+        brokerId: void 0,
+        brokerName: void 0,
+        brokerNameRaw: void 0
+      };
+    }
+    const getter = symbolsInfo[symbol];
+    const info = typeof getter === "function" ? getter() : void 0;
+    const displayName = info?.displayName ?? info?.display_symbol_name ?? symbol;
+    const brokerId = info?.broker_id ?? void 0;
+    const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
+    const base = brokerNameBaseFromRaw(rawBrokerName);
+    const brokerName = base ? base.length > 7 ? `${base.slice(0, 7)}...` : base : void 0;
+    return {
+      displayName,
+      brokerId,
+      brokerName,
+      brokerNameRaw: rawBrokerName
+    };
+  }, [brokers, symbolsInfo, symbol]);
+};
+function formatSymbolWithBroker(symbol, symbolsInfo, brokers) {
+  if (!symbol) return "";
+  let brokerNameBase;
+  if (!symbolsInfo.isNil) {
+    const getter = symbolsInfo[symbol];
+    const info = typeof getter === "function" ? getter() : void 0;
+    const brokerId = info?.broker_id ?? void 0;
+    const rawBrokerName = brokerId ? brokers?.[brokerId] : void 0;
+    brokerNameBase = brokerNameBaseFromRaw(rawBrokerName);
+  }
+  const parts = symbol.split("_");
+  const base = parts.length >= 3 ? parts[1] ?? "" : symbol.match(/^([A-Za-z]+)/)?.[1] ?? symbol;
+  const hasBrokerSuffix = symbol.includes("-") || symbol.split("_").length > 3;
+  if (brokerNameBase && hasBrokerSuffix) {
+    return `${base}-${brokerNameBase}`;
+  }
+  return base;
+}
+var useSymbolWithBroker = (symbol) => {
+  const symbolsInfo = useSymbolsInfo();
+  const [brokers] = useAllBrokers();
+  return React.useMemo(
+    () => formatSymbolWithBroker(symbol, symbolsInfo, brokers),
+    [brokers, symbolsInfo, symbol]
+  );
+};
+
+// src/orderly/useMarginModes.ts
 var useMarginModes = () => {
   const { data, error, isLoading, mutate: mutate6 } = usePrivateQuery("/v1/client/margin_modes", {
     revalidateOnFocus: false,
@@ -4801,22 +4941,28 @@ var useMarginModes = () => {
 };
 var useMarginModeBySymbol = (symbol, fallback = types.MarginMode.CROSS) => {
   const { marginModes, isLoading, error, refresh, updateMarginMode } = useMarginModes();
-  const marginMode = fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
+  const { brokerId } = useBadgeBySymbol(symbol);
+  const marginMode = React.useMemo(() => {
+    if (brokerId) return types.MarginMode.ISOLATED;
+    return fallback === null ? marginModes[symbol] : marginModes[symbol] ?? fallback;
+  }, [brokerId, fallback, marginModes, symbol]);
   const update = React.useCallback(
     async (mode) => {
+      if (brokerId) mode = types.MarginMode.ISOLATED;
       return updateMarginMode({
         symbol_list: [symbol],
         default_margin_mode: mode
       });
     },
-    [symbol, updateMarginMode]
+    [brokerId, symbol, updateMarginMode]
   );
   return {
     marginMode,
     isLoading,
     error,
     refresh,
-    update
+    update,
+    isPermissionlessListing: !!brokerId
   };
 };
 
@@ -5055,6 +5201,11 @@ var MarkPriceCalculator = class extends BaseCalculator {
 
 // src/orderly/calculator/calculatorContext.ts
 var CalculatorContext = class _CalculatorContext {
+  // holding: API.Holding[];
+  // portfolio — dynamic getter to always read the latest output from PortfolioCalculator
+  get portfolio() {
+    return this.output["portfolio"] || useAppStore.getState().portfolio;
+  }
   static get instance() {
     return this._instance;
   }
@@ -5073,7 +5224,6 @@ var CalculatorContext = class _CalculatorContext {
   update(scope, data) {
     this.setCtxData();
     this.markPrices = scope === "markPrice" /* MARK_PRICE */ ? data : this.output[MarketCalculatorName];
-    this.portfolio = this.output["portfolio"] || useAppStore.getState().portfolio;
     return this;
   }
   setCtxData() {
@@ -5091,7 +5241,6 @@ var CalculatorContext = class _CalculatorContext {
   clearCache() {
     this.output = {};
     this.accountInfo = void 0;
-    this.portfolio = void 0;
   }
   deleteByName(name) {
     delete this.output[name];
@@ -5459,7 +5608,7 @@ var PositionCalculator = class extends BaseCalculator {
     if (!accountInfo || !fundingRates || !symbolsInfo) {
       return data;
     }
-    let unrealPnL_total = utils.zero, unrealPnL_total_index = utils.zero, notional_total = utils.zero, unsettlementPnL_total = utils.zero;
+    let unrealPnL_total = utils.zero, unrealPnL_total_index = utils.zero, notional_total = utils.zero, unsettlementPnL_total = utils.zero, totalUnsettledIsolatedPnl = utils.zero, totalUnsettledCrossPnl = utils.zero;
     let rows = data.rows.map((item) => {
       const info = symbolsInfo[item.symbol];
       const sum_unitary_funding = fundingRates?.[item.symbol]?.["sum_unitary_funding"] ?? 0;
@@ -5522,6 +5671,12 @@ var PositionCalculator = class extends BaseCalculator {
       unrealPnL_total_index = unrealPnL_total_index.add(unrealPnl_index);
       notional_total = notional_total.add(notional);
       unsettlementPnL_total = unsettlementPnL_total.add(unsettlementPnL2);
+      if (item.margin_mode === types.MarginMode.CROSS) {
+        totalUnsettledCrossPnl = totalUnsettledCrossPnl.add(unsettlementPnL2);
+      }
+      if (item.margin_mode === types.MarginMode.ISOLATED) {
+        totalUnsettledIsolatedPnl = totalUnsettledIsolatedPnl.add(unsettlementPnL2);
+      }
       const fundingFee = new utils.Decimal(sum_unitary_funding).sub(item.last_sum_unitary_funding).mul(item.position_qty).negated().toNumber();
       return {
         ...item,
@@ -5537,7 +5692,8 @@ var PositionCalculator = class extends BaseCalculator {
         unrealized_pnl: unrealPnl,
         unrealized_pnl_index: unrealPnl_index,
         unrealized_pnl_ROI: unrealPnlROI,
-        unrealized_pnl_ROI_index: unrealPnlROI_index
+        unrealized_pnl_ROI_index: unrealPnlROI_index,
+        unsettled_pnl: unsettlementPnL2
       };
     });
     const totalUnrealPnl = unrealPnL_total.toNumber();
@@ -5549,18 +5705,34 @@ var PositionCalculator = class extends BaseCalculator {
       rows = rows.map((item) => {
         const info = symbolsInfo[item.symbol];
         const totalCollateral = item.margin_mode === types.MarginMode.ISOLATED ? new utils.Decimal(item.margin ?? 0).add(item.unsettlement_pnl ?? 0).toNumber() : crossMarginCollateral.toNumber();
-        const est_liq_price = perp.positions.liqPrice({
-          symbol: item.symbol,
-          markPrice: item.mark_price,
-          totalCollateral,
-          positionQty: item.position_qty,
-          positions: rows,
-          MMR: item.mmr,
-          baseMMR: info?.["base_mmr"],
-          baseIMR: info?.["base_imr"],
-          IMRFactor: accountInfo.imr_factor[item.symbol],
-          costPosition: item.cost_position
-        });
+        let est_liq_price;
+        if (item.margin_mode === types.MarginMode.ISOLATED) {
+          est_liq_price = perp.positions.liquidationPriceIsolated({
+            isolatedPositionMargin: item.margin ?? 0,
+            costPosition: item.cost_position ?? 0,
+            positionQty: item.position_qty ?? 0,
+            sumUnitaryFunding: fundingRates?.[item.symbol]?.["sum_unitary_funding"] ?? 0,
+            lastSumUnitaryFunding: item.last_sum_unitary_funding ?? 0,
+            baseMMR: info?.["base_mmr"] ?? 0,
+            baseIMR: info?.["base_imr"] ?? 0,
+            IMRFactor: accountInfo.imr_factor[item.symbol],
+            referencePrice: item.mark_price,
+            leverage: item.leverage ?? 0
+          });
+        } else {
+          est_liq_price = perp.positions.liqPrice({
+            symbol: item.symbol,
+            markPrice: item.mark_price,
+            totalCollateral,
+            positionQty: item.position_qty,
+            positions: rows,
+            MMR: item.mmr,
+            baseMMR: info?.["base_mmr"],
+            baseIMR: info?.["base_imr"],
+            IMRFactor: accountInfo.imr_factor[item.symbol],
+            costPosition: item.cost_position
+          });
+        }
         return {
           ...item,
           est_liq_price
@@ -5587,6 +5759,8 @@ var PositionCalculator = class extends BaseCalculator {
       total_unsettled_pnl: unsettlementPnL,
       unrealPnlROI: totalUnrealizedROI,
       unrealPnlROI_index: totalUnrealizedROI_index,
+      total_unsettled_cross_pnl: totalUnsettledCrossPnl.toNumber(),
+      total_unsettled_isolated_pnl: totalUnsettledIsolatedPnl.toNumber(),
       rows
     };
   }
@@ -5749,13 +5923,9 @@ var PortfolioCalculator = class extends BaseCalculator {
     if (!holding || !positions3 || !Array.isArray(positions3.rows) || !markPrices || !indexPrices || !accountInfo) {
       return null;
     }
-    const totallCrossUnsettledPnL = positions3.rows.reduce(
-      (sum, pos) => pos.margin_mode === types.MarginMode.ISOLATED ? sum : sum + (pos.unsettled_pnl ?? 0),
-      0
-    );
-    const totalUnsettlementPnL = positions3.rows.reduce(
-      (sum, pos) => sum + (pos.unsettled_pnl ?? 0),
-      0
+    const unsettledPnL = ramda.pathOr(0, ["total_unsettled_pnl"])(positions3);
+    const unsettledCrossPnL = ramda.pathOr(0, ["total_unsettled_cross_pnl"])(
+      positions3
     );
     const unrealizedPnL = ramda.pathOr(0, ["total_unreal_pnl"])(positions3);
     const [USDC_holding, nonUSDC] = parseHolding(
@@ -5767,7 +5937,7 @@ var PortfolioCalculator = class extends BaseCalculator {
     const totalCollateral = perp.account.totalCollateral({
       USDCHolding: USDC_holding,
       nonUSDCHolding: nonUSDC,
-      unsettlementPnL: totallCrossUnsettledPnL,
+      unsettlementPnL: unsettledCrossPnL,
       usdcBalancePendingShortQty: usdc?.pending_short ?? 0,
       usdcBalanceIsolatedOrderFrozen: usdc?.isolated_order_frozen ?? 0
     });
@@ -5778,7 +5948,7 @@ var PortfolioCalculator = class extends BaseCalculator {
       return acc.add(curr.margin ?? 0);
     }, utils.zero);
     const totalValue = perp.account.totalValue({
-      totalUnsettlementPnL,
+      totalUnsettlementPnL: unsettledPnL,
       USDCHolding: USDC_holding,
       nonUSDCHolding: nonUSDC,
       totalIsolatedPositionMargin: sumIsolatedMargin.toNumber()
@@ -5822,7 +5992,7 @@ var PortfolioCalculator = class extends BaseCalculator {
       totalUnrealizedROI,
       freeCollateral,
       availableBalance,
-      unsettledPnL: totalUnsettlementPnL,
+      unsettledPnL,
       holding,
       usdcHolding: USDC_holding,
       freeCollateralUSDCOnly
@@ -5941,7 +6111,7 @@ var usePositionStream = (symbol = "all", options) => {
       total_unreal_pnl: total_unreal_pnl_index,
       unrealPnlROI: unrealPnlROI_index
     };
-  }, [calcMode]);
+  }, [calcMode, formattedPositions]);
   let rows = formattedPositions[0];
   {
     if (!rows) {
@@ -6431,14 +6601,8 @@ function formatPortfolio(inputs) {
   if (!holding || !positions3 || !Array.isArray(positions3.rows) || !markPrices || !indexPrices || !accountInfo || symbolsInfo?.isNil) {
     return null;
   }
-  const totallCrossUnsettledPnL = positions3.rows.reduce(
-    (sum, pos) => pos.margin_mode === types.MarginMode.ISOLATED ? sum : sum + (pos.unsettled_pnl ?? 0),
-    0
-  );
-  const totalUnsettlementPnL = positions3.rows.reduce(
-    (sum, pos) => sum + (pos.unsettled_pnl ?? 0),
-    0
-  );
+  const unsettledPnL = ramda.pathOr(0, ["total_unsettled_pnl"])(positions3);
+  const unsettledCrossPnL = ramda.pathOr(0, ["total_unsettled_cross_pnl"])(positions3);
   const unrealizedPnL = ramda.pathOr(0, ["total_unreal_pnl"])(positions3);
   const [USDC_holding, nonUSDC] = parseHolding(
     holding,
@@ -6449,7 +6613,7 @@ function formatPortfolio(inputs) {
   const totalCollateral = perp.account.totalCollateral({
     USDCHolding: USDC_holding,
     nonUSDCHolding: nonUSDC,
-    unsettlementPnL: totallCrossUnsettledPnL,
+    unsettlementPnL: unsettledCrossPnL,
     usdcBalancePendingShortQty: usdc?.pending_short ?? 0,
     usdcBalanceIsolatedOrderFrozen: usdc?.isolated_order_frozen ?? 0
   });
@@ -6460,7 +6624,7 @@ function formatPortfolio(inputs) {
     return acc.add(curr.margin ?? 0);
   }, utils.zero);
   const totalValue = perp.account.totalValue({
-    totalUnsettlementPnL,
+    totalUnsettlementPnL: unsettledPnL,
     USDCHolding: USDC_holding,
     nonUSDCHolding: nonUSDC,
     totalIsolatedPositionMargin: sumIsolatedMargin.toNumber()
@@ -6504,7 +6668,7 @@ function formatPortfolio(inputs) {
     totalUnrealizedROI,
     freeCollateral,
     availableBalance,
-    unsettledPnL: totalUnsettlementPnL,
+    unsettledPnL,
     holding,
     freeCollateralUSDCOnly
   };
@@ -6513,7 +6677,7 @@ function formatPositions(data, accountInfo, symbolsInfo, fundingRates) {
   if (!accountInfo || !fundingRates || !symbolsInfo) {
     return data;
   }
-  let unrealPnL_total = utils.zero, unrealPnL_total_index = utils.zero, notional_total = utils.zero, unsettlementPnL_total = utils.zero;
+  let unrealPnL_total = utils.zero, unrealPnL_total_index = utils.zero, notional_total = utils.zero, unsettlementPnL_total = utils.zero, totalUnsettledIsolatedPnl = utils.zero, totalUnsettledCrossPnl = utils.zero;
   const rows = data.rows.map((item) => {
     const info = symbolsInfo[item.symbol];
     const notional = perp.positions.notional(item.position_qty, item.mark_price);
@@ -6575,6 +6739,12 @@ function formatPositions(data, accountInfo, symbolsInfo, fundingRates) {
     unrealPnL_total_index = unrealPnL_total_index.add(unrealPnl_index);
     notional_total = notional_total.add(notional);
     unsettlementPnL_total = unsettlementPnL_total.add(unsettlementPnL2);
+    if (item.margin_mode === types.MarginMode.CROSS) {
+      totalUnsettledCrossPnl = totalUnsettledCrossPnl.add(unsettlementPnL2);
+    }
+    if (item.margin_mode === types.MarginMode.ISOLATED) {
+      totalUnsettledIsolatedPnl = totalUnsettledIsolatedPnl.add(unsettlementPnL2);
+    }
     return {
       ...item,
       mm: perp.positions.maintenanceMargin({
@@ -6588,7 +6758,8 @@ function formatPositions(data, accountInfo, symbolsInfo, fundingRates) {
       unrealized_pnl: unrealPnl,
       unrealized_pnl_index: unrealPnl_index,
       unrealized_pnl_ROI: unrealPnlROI,
-      unrealized_pnl_ROI_index: unrealPnlROI_index
+      unrealized_pnl_ROI_index: unrealPnlROI_index,
+      unsettled_pnl: unsettlementPnL2
     };
   });
   const totalUnrealPnl = unrealPnL_total.toNumber();
@@ -6602,6 +6773,8 @@ function formatPositions(data, accountInfo, symbolsInfo, fundingRates) {
     notional: notional_total.toNumber(),
     unsettledPnL: unsettlementPnL,
     total_unsettled_pnl: unsettlementPnL,
+    total_unsettled_cross_pnl: totalUnsettledCrossPnl.toNumber(),
+    total_unsettled_isolated_pnl: totalUnsettledIsolatedPnl.toNumber(),
     rows
   };
 }
@@ -7984,7 +8157,9 @@ var useDeposit = (options) => {
     const depositPromise = isNativeToken ? account9.assetsManager.depositNativeToken(inputs) : account9.assetsManager.deposit(inputs);
     return depositPromise.then((result) => {
       updateAllowanceWhenTxSuccess(result.hash);
-      setBalance((value) => new utils.Decimal(value).sub(quantity).toString());
+      setBalance(
+        (value) => value ? new utils.Decimal(value).sub(quantity).toString() : "0"
+      );
       track2(types.TrackerEventName.depositSuccess, {
         wallet: state?.connectWallet?.name,
         network: targetChain?.network_infos.name,
@@ -8036,16 +8211,16 @@ var useDeposit = (options) => {
 };
 function useBalance(options) {
   const { srcToken, address, decimals, account: account9, status } = options;
-  const [balance, setBalance] = React.useState("0");
+  const [balance, setBalance] = React.useState(null);
   const fetchBalance = React.useCallback(
     async (address2, decimals2) => {
       try {
         if (types.isNativeTokenChecker(address2)) {
-          return account9.assetsManager.getNativeBalance({
+          return await account9.assetsManager.getNativeBalance({
             decimals: decimals2
           });
         }
-        return account9.assetsManager.getBalance(address2, {
+        return await account9.assetsManager.getBalance(address2, {
           decimals: decimals2
         });
       } catch (err) {
@@ -8094,11 +8269,13 @@ function useBalance(options) {
   React.useEffect(() => {
     if (swrBalance !== void 0) {
       setBalance(swrBalance || "0");
+    } else {
+      setBalance(null);
     }
-  }, [swrBalance]);
+  }, [swrBalance, address]);
   return {
     balance,
-    balanceRevalidating,
+    balanceRevalidating: balanceRevalidating || balance === null,
     setBalance,
     fetchBalance,
     fetchBalances
@@ -9628,6 +9805,9 @@ var PriceValidationStrategy = class {
     }
     const price = new utils.Decimal(order_price);
     const { symbol } = config;
+    if (!symbol) {
+      return;
+    }
     const { quote_max, quote_min, quote_dp, price_range, price_scope } = symbol;
     const maxPriceNumber = perp.order.maxPrice(config.markPrice, price_range);
     const minPriceNumber = perp.order.minPrice(config.markPrice, price_range);
@@ -9674,6 +9854,9 @@ var TriggerPriceValidationStrategy = class {
   validate(values, config) {
     const { trigger_price } = values;
     const { symbol } = config;
+    if (!symbol) {
+      return;
+    }
     const { quote_max, quote_min } = symbol;
     if (!trigger_price) {
       return OrderValidation.required("trigger_price");
@@ -9720,6 +9903,9 @@ var QuantityValidationStrategy = class {
   validate(values, config) {
     let { order_quantity, total, order_price } = values;
     const { maxQty, symbol } = config;
+    if (!symbol) {
+      return;
+    }
     const { base_min, base_dp, quote_dp } = symbol;
     if (!order_quantity && total && order_price) {
       const totalNumber = new utils.Decimal(total);
@@ -10920,7 +11106,11 @@ var tpslFields = [
   "tp_offset",
   "sl_offset",
   "tp_offset_percentage",
-  "sl_offset_percentage"
+  "sl_offset_percentage",
+  "tp_offset_from_mark",
+  "sl_offset_from_mark",
+  "tp_offset_percentage_from_mark",
+  "sl_offset_percentage_from_mark"
 ];
 var isBracketOrder = (order) => {
   return !!order.tp_trigger_price || !!order.sl_trigger_price;
@@ -10975,7 +11165,7 @@ var calcEstLiqPrice = (order, askAndBid, inputs) => {
     totalCollateral,
     futures_taker_fee_rate,
     positions: positions3,
-    // leverage,
+    symbolLeverage,
     sumUnitaryFunding
   } = inputs;
   const orderFee = perp.order.orderFee({
@@ -11000,7 +11190,7 @@ var calcEstLiqPrice = (order, askAndBid, inputs) => {
       }
     });
   } else {
-    let isolatedPositionMargin = 0, costPosition = 0, positionQty = 0, lastSumUnitaryFunding = 0, leverage = 1;
+    let isolatedPositionMargin = 0, costPosition = 0, positionQty = 0, lastSumUnitaryFunding = 0, leverage = symbolLeverage ?? 1;
     if (positions3) {
       const position = positions3.find(
         (p) => p.symbol === symbol && p.margin_mode === types.MarginMode.ISOLATED
@@ -11136,6 +11326,8 @@ var useTaskProfitAndStopLossInternal = (position, options) => {
           entryPrice: position.average_open_price,
           qty: side === types.OrderSide.BUY ? Number(prev.quantity) : -Number(prev.quantity),
           orderSide: side,
+          markPrice: markPrice ?? position.average_open_price,
+          // use mark price as the default value
           values: prev
         },
         {
@@ -12690,6 +12882,12 @@ var DataPaint = class extends BasePaint {
     this.DEFAULT_LOSS_COLOR = "rgb(255,103,194)";
     this.transformTop = 0;
     this.QRCODE_SIZE = 56;
+    this.BROKER_BADGE_HEIGHT = 18;
+    this.BROKER_BADGE_PADDING_X = 8;
+    this.BROKER_BADGE_RADIUS = 4;
+  }
+  formatMarginMode(marginMode) {
+    return marginMode === types.MarginMode.ISOLATED ? "Isolated" : "Cross";
   }
   async draw(options) {
     const needDrawDetails = Array.isArray(options.data?.position?.informations) && (options.data?.position?.informations?.length ?? 0) > 0;
@@ -12776,6 +12974,49 @@ var DataPaint = class extends BasePaint {
         fontSize: this._ratio(fontSize),
         fontFamily: options.fontFamily
       });
+      const brokerName = options.data?.position.brokerName?.trim();
+      if (brokerName) {
+        left += (prevElementBoundingBox.width ?? 0) + this._ratio(10);
+        const badgeHeight = this._ratio(this.BROKER_BADGE_HEIGHT);
+        const badgePaddingX = this._ratio(this.BROKER_BADGE_PADDING_X);
+        const badgeRadius = this._ratio(this.BROKER_BADGE_RADIUS);
+        const badgeFontSize = this._ratio(12);
+        const badgeFontWeight = 600;
+        const textMetrics = this._drawText(
+          brokerName,
+          {
+            left: 0,
+            top: 0,
+            fontSize: badgeFontSize,
+            fontWeight: badgeFontWeight,
+            fontFamily: options.fontFamily
+          },
+          true
+        );
+        const badgeWidth = (textMetrics.width ?? 0) + badgePaddingX * 2;
+        const badgeTop = this._ratio(top) - badgeHeight / 2;
+        this._fillRoundedRect(
+          left,
+          badgeTop,
+          badgeWidth,
+          badgeHeight,
+          badgeRadius,
+          "rgba(255,255,255,0.06)"
+        );
+        this._drawText(brokerName, {
+          color: "rgba(255,255,255,0.36)",
+          left: left + badgePaddingX,
+          top: badgeTop + badgeHeight / 2,
+          fontSize: badgeFontSize,
+          fontWeight: badgeFontWeight,
+          fontFamily: options.fontFamily,
+          textBaseline: "middle"
+        });
+        prevElementBoundingBox = {
+          ...prevElementBoundingBox,
+          width: badgeWidth
+        };
+      }
     }
     const marginMode = options.data?.position.marginMode;
     if (marginMode) {
@@ -12790,7 +13031,7 @@ var DataPaint = class extends BasePaint {
         });
       }
       left += (prevElementBoundingBox.width ?? 0) + this._ratio(7);
-      const marginModeText = marginMode.charAt(0).toUpperCase() + marginMode.slice(1);
+      const marginModeText = this.formatMarginMode(marginMode);
       prevElementBoundingBox = this._drawText(marginModeText, {
         color: layout.color,
         left,
@@ -12823,6 +13064,20 @@ var DataPaint = class extends BasePaint {
       );
     }
   }
+  _fillRoundedRect(x, y, width, height, radius, color) {
+    const r = Math.min(radius, width / 2, height / 2);
+    this.ctx.save();
+    this.ctx.fillStyle = color;
+    this.ctx.beginPath();
+    this.ctx.moveTo(x + r, y);
+    this.ctx.arcTo(x + width, y, x + width, y + height, r);
+    this.ctx.arcTo(x + width, y + height, x, y + height, r);
+    this.ctx.arcTo(x, y + height, x, y, r);
+    this.ctx.arcTo(x, y, x + width, y, r);
+    this.ctx.closePath();
+    this.ctx.fill();
+    this.ctx.restore();
+  }
   drawUnrealizedPnL(options, offsetTop = 0) {
     const layout = ramda.path(
       ["layout", "unrealizedPnl"],
@@ -13276,18 +13531,6 @@ var useEpochInfo = (type) => {
   }, [epochInfo]);
   return [epochInfo, { isLoading, curEpochInfo, isNotStared, refresh }];
 };
-
-// src/trading-rewards/useAllBrokers.ts
-var useAllBrokers = () => {
-  const { data } = useQuery("/v1/public/broker/name", {
-    formatter: (res) => {
-      const { rows } = res;
-      return rows?.map((item) => ({ [item.broker_id]: item.broker_name })).reduce((acc, curr) => ({ ...acc, ...curr }), {});
-    },
-    revalidateOnFocus: false
-  });
-  return [data];
-};
 var useCurEpochEstimate = (type) => {
   const [data, setData] = React.useState(void 0);
   const { account: account9 } = useAccount();
@@ -18423,108 +18666,69 @@ var initialOrderState = {
   tp_trigger_price: "",
   sl_trigger_price: "",
   total: "",
-  symbol: ""
+  symbol: "",
+  side: types.OrderSide.BUY,
+  order_type: types.OrderType.LIMIT,
+  margin_mode: types.MarginMode.CROSS
 };
-var useOrderStore = zustand.create()(
-  immer.immer((set, get3) => ({
-    entry: {
-      side: types.OrderSide.BUY,
-      order_type: types.OrderType.LIMIT,
-      ...initialOrderState
-    },
-    estLeverage: null,
-    estLiquidationPrice: null,
-    errors: {},
-    actions: {
-      initOrder: (symbol, options) => {
-        set((state) => {
-          state.entry = {
-            ...initialOrderState,
-            symbol,
-            side: options?.side ?? types.OrderSide.BUY,
-            order_type: options?.order_type ?? types.OrderType.LIMIT,
-            margin_mode: options?.margin_mode ?? types.MarginMode.CROSS
-          };
-          state.estLeverage = null;
-          state.estLiquidationPrice = null;
-          state.errors = {};
+var useOrderEntryNextInternal = (symbol, options = {}) => {
+  const { symbolInfo, symbolLeverage } = options;
+  const [orderEntity, setOrderEntity] = React.useState(
+    () => ({
+      ...initialOrderState,
+      ...options.initialOrder,
+      symbol
+    })
+  );
+  const actions = React.useMemo(
+    () => ({
+      initOrder: (sym, opts) => {
+        setOrderEntity({
+          ...initialOrderState,
+          symbol: sym,
+          side: opts?.side ?? types.OrderSide.BUY,
+          order_type: opts?.order_type ?? types.OrderType.LIMIT,
+          margin_mode: opts?.margin_mode ?? types.MarginMode.CROSS
         });
       },
-      hasTP_SL: () => {
-        const order = get3().entry;
-        return typeof order.tp_trigger_price !== "undefined" || typeof order.sl_trigger_price !== "undefined";
-      },
-      updateOrderComputed: (data) => {
-        set(
-          (state) => {
-            state.estLeverage = data.estLeverage;
-            state.estLiquidationPrice = data.estLiquidationPrice;
-          },
-          false
-          // "updateOrderComputed"
-        );
-      },
       updateOrder: (order) => {
-        set(
-          (state) => {
-            state.entry = {
-              ...state.entry,
-              ...order
-            };
-          },
-          false
-          // "updateOrder"
-        );
+        setOrderEntity((prev) => ({ ...prev, ...order }));
       },
       updateOrderByKey: (key, value) => {
-        set(
-          (state) => {
-            state.entry[key] = value;
-          },
-          false
-          // "updateOrderByKey"
-        );
-      },
-      restoreOrder: (order) => {
-        set(
-          (state) => {
-            state.entry = order;
-          },
-          false
-          // "restoreOrder"
-        );
+        setOrderEntity((prev) => ({ ...prev, [key]: value }));
       },
       resetOrder: (_order) => {
-        set(
-          (state) => {
-            state.entry.order_price = "";
-            state.entry.order_quantity = "";
-            state.entry.trigger_price = "";
-            state.entry.total = "";
-            state.entry.tp_trigger_price = "";
-            state.entry.tp_pnl = "";
-            state.entry.tp_offset = "";
-            state.entry.tp_offset_percentage = "";
-            state.entry.sl_trigger_price = "";
-            state.entry.sl_pnl = "";
-            state.entry.sl_offset = "";
-            state.entry.sl_offset_percentage = "";
-          },
-          true
-          // "resetOrder"
-        );
+        setOrderEntity((prev) => ({
+          ...prev,
+          order_price: "",
+          order_quantity: "",
+          trigger_price: "",
+          total: "",
+          tp_trigger_price: "",
+          tp_pnl: "",
+          tp_offset: "",
+          tp_offset_percentage: "",
+          tp_offset_from_mark: "",
+          tp_offset_percentage_from_mark: "",
+          sl_trigger_price: "",
+          sl_pnl: "",
+          sl_offset: "",
+          sl_offset_percentage: "",
+          sl_offset_from_mark: "",
+          sl_offset_percentage_from_mark: ""
+        }));
+      },
+      hasTP_SL: () => {
+        const order = orderEntity;
+        return typeof order.tp_trigger_price !== "undefined" || typeof order.sl_trigger_price !== "undefined";
       }
-    }
-  }))
-);
-var useOrderEntryNextInternal = (symbol, options = {}) => {
-  const { symbolInfo, symbolLeverage } = options;
-  const orderEntity = useOrderStore((state) => state.entry);
-  const orderEntryActions = useOrderStore((state) => state.actions);
+    }),
+    [orderEntity]
+  );
   React.useEffect(() => {
-    orderEntryActions.initOrder(symbol, options.initialOrder);
+    actions.initOrder(symbol, options.initialOrder);
     if (options.initialOrder) {
-      orderEntryActions.updateOrder(options.initialOrder);
+      actions.updateOrder(options.initialOrder);
     }
   }, [symbol]);
   const calculate2 = React.useCallback(
@@ -18542,10 +18746,10 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
   );
   const setValue = (key, value, additional) => {
     if (!symbolInfo) {
-      orderEntryActions.updateOrderByKey(key, value);
+      actions.updateOrderByKey(key, value);
       return;
     }
-    const currentEntry = useOrderStore.getState().entry;
+    const currentEntry = orderEntity;
     const { markPrice } = additional ?? { markPrice: 0 };
     let newValues = calculate2(
       { ...currentEntry },
@@ -18579,7 +18783,7 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
     if (sl_ROI) {
       newValues.sl_ROI = sl_ROI;
     }
-    orderEntryActions.updateOrder(newValues);
+    actions.updateOrder(newValues);
     return newValues;
   };
   const calculateTPSL = (key, newValues, markPrice, symbolInfo2) => {
@@ -18602,6 +18806,42 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
           symbolInfo2
         );
       }
+      if (newValues.tp_offset_from_mark !== void 0 && newValues.tp_offset_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "tp_offset_from_mark",
+          newValues.tp_offset_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.tp_offset_percentage_from_mark !== void 0 && newValues.tp_offset_percentage_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "tp_offset_percentage_from_mark",
+          newValues.tp_offset_percentage_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.sl_offset_from_mark !== void 0 && newValues.sl_offset_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "sl_offset_from_mark",
+          newValues.sl_offset_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.sl_offset_percentage_from_mark !== void 0 && newValues.sl_offset_percentage_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "sl_offset_percentage_from_mark",
+          newValues.sl_offset_percentage_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
     } else {
       if (typeof newValues.tp_trigger_price !== "undefined") {
         newValues = calculate2(
@@ -18621,16 +18861,51 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
           symbolInfo2
         );
       }
+      if (newValues.tp_offset_from_mark !== void 0 && newValues.tp_offset_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "tp_offset_from_mark",
+          newValues.tp_offset_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.tp_offset_percentage_from_mark !== void 0 && newValues.tp_offset_percentage_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "tp_offset_percentage_from_mark",
+          newValues.tp_offset_percentage_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.sl_offset_from_mark !== void 0 && newValues.sl_offset_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "sl_offset_from_mark",
+          newValues.sl_offset_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
+      if (newValues.sl_offset_percentage_from_mark !== void 0 && newValues.sl_offset_percentage_from_mark !== "") {
+        newValues = calculate2(
+          newValues,
+          "sl_offset_percentage_from_mark",
+          newValues.sl_offset_percentage_from_mark,
+          markPrice,
+          symbolInfo2
+        );
+      }
     }
     return newValues;
   };
   const setValues = (values, additional) => {
     if (!symbolInfo) {
-      orderEntryActions.updateOrder(values);
+      actions.updateOrder(values);
       return;
     }
-    const currentEntry = useOrderStore.getState().entry;
-    let newValues = { ...currentEntry };
+    let newValues = { ...orderEntity };
     Object.keys(values).forEach((key) => {
       newValues = calculate2(
         newValues,
@@ -18640,17 +18915,28 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
         symbolInfo
       );
     });
-    orderEntryActions.updateOrder(newValues);
+    actions.updateOrder(newValues);
+    return newValues;
+  };
+  const setValuesRaw = (values) => {
+    if (!symbolInfo) {
+      actions.updateOrder(values);
+      return;
+    }
+    const newValues = {
+      ...orderEntity,
+      ...values
+    };
+    actions.updateOrder(newValues);
     return newValues;
   };
   const onMarkPriceUpdated = React.useCallback(
     (markPrice, baseOn = []) => {
       if (!options.symbolInfo) return;
-      const currentEntry = useOrderStore.getState().entry;
-      let newValues = { ...currentEntry };
+      let newValues = { ...orderEntity };
       if (baseOn.length === 0) {
         newValues = calculate2(
-          { ...currentEntry },
+          { ...orderEntity },
           "order_price",
           markPrice,
           markPrice,
@@ -18661,7 +18947,7 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
           newValues = calculate2(
             { ...newValues },
             key,
-            currentEntry[key],
+            orderEntity[key],
             markPrice,
             options.symbolInfo
           );
@@ -18680,9 +18966,9 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
           newValues.sl_ROI = sl_ROI;
         }
       }
-      orderEntryActions.updateOrder(newValues);
+      actions.updateOrder(newValues);
     },
-    [calculate2, options.symbolInfo, orderEntryActions]
+    [calculate2, options.symbolInfo, symbolLeverage, orderEntity]
   );
   const validate = (order, creator, options2) => {
     return creator?.validate(order, {
@@ -18700,12 +18986,13 @@ var useOrderEntryNextInternal = (symbol, options = {}) => {
   const submitOrder = React.useCallback(() => {
   }, [orderEntity]);
   const resetOrder = (order) => {
-    orderEntryActions.resetOrder(order);
+    actions.resetOrder(order);
   };
   return {
     formattedOrder: orderEntity,
     setValue,
     setValues,
+    setValuesRaw,
     submit: submitOrder,
     reset: resetOrder,
     generateOrder,
@@ -18721,6 +19008,8 @@ var useOrderEntry2 = (symbol, options = {}) => {
   }
   const ee = useEventEmitter();
   const { track: track2 } = useTrack();
+  const apiBaseUrl = useConfig("apiBaseUrl");
+  const fetchSymbols = useSymbolStore((state) => state.fetchData);
   const [meta, setMeta] = React.useState({
     dirty: {},
     submitted: false,
@@ -18740,8 +19029,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
   const symbolConfig = useSymbolsInfo();
   const accountInfo = useAccountInfo();
   const positions3 = usePositions();
-  const entry = useOrderStore((s) => s.entry);
-  const effectiveMarginMode = options?.initialOrder?.margin_mode ?? entry?.margin_mode ?? types.MarginMode.CROSS;
+  const effectiveMarginMode = options?.initialOrder?.margin_mode ?? types.MarginMode.CROSS;
   const symbolLeverage = useLeverageBySymbol(symbol, effectiveMarginMode);
   const symbolInfo = symbolConfig[symbol]();
   const markPrice = actions.getMarkPriceBySymbol(symbol);
@@ -18750,6 +19038,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
     formattedOrder,
     setValue: setValueInternal,
     setValues: setValuesInternal,
+    setValuesRaw: setValuesRawInternal,
     validate,
     generateOrder,
     reset,
@@ -18974,6 +19263,21 @@ var useOrderEntry2 = (symbol, options = {}) => {
       interactiveValidate(newValues);
     }
   };
+  const setValuesRaw = (values) => {
+    if (!Object.keys(values).every(
+      (key) => canSetTPSLPrice(
+        key,
+        values[key],
+        formattedOrder.order_type
+      )
+    )) {
+      return;
+    }
+    const newValues = setValuesRawInternal(values);
+    if (newValues) {
+      interactiveValidate(newValues);
+    }
+  };
   async function validateFunc(order) {
     const creator = getOrderCreator(order);
     return validate(order, creator, prepareData());
@@ -19028,11 +19332,12 @@ var useOrderEntry2 = (symbol, options = {}) => {
       markPrice: markPrice2,
       totalCollateral,
       futures_taker_fee_rate: accountInfo.futures_taker_fee_rate,
-      imr_factor: accountInfo.imr_factor[symbol],
+      imr_factor: accountInfo.imr_factor?.[symbol] ?? 0,
       symbol,
       positions: positions3,
       symbolInfo,
-      sumUnitaryFunding
+      sumUnitaryFunding,
+      symbolLeverage
     });
     return estLiqPrice2;
   }, [
@@ -19043,7 +19348,8 @@ var useOrderEntry2 = (symbol, options = {}) => {
     symbol,
     maxQty,
     symbolInfo,
-    fundingRates
+    fundingRates,
+    symbolLeverage
   ]);
   const estLiqPriceDistance = React.useMemo(() => {
     if (!estLiqPrice) {
@@ -19115,6 +19421,9 @@ var useOrderEntry2 = (symbol, options = {}) => {
       orders: appendOrderMetadata(order.orders, orderMetadata)
     } : appendOrderMetadata(order, orderMetadata);
     const result = await doCreateOrder(params);
+    if (!result.success && (order.order_type === types.OrderType.MARKET || order.order_type === types.OrderType.STOP_MARKET)) {
+      void fetchSymbols(apiBaseUrl);
+    }
     if (result.success) {
       let trackParams = {
         side: order.side,
@@ -19182,6 +19491,7 @@ var useOrderEntry2 = (symbol, options = {}) => {
     freeCollateral: effectiveMarginMode === types.MarginMode.ISOLATED ? freeCollateralUSDCOnly : freeCollateral,
     setValue: useMemoizedFn(setValue),
     setValues: useMemoizedFn(setValues),
+    setValuesRaw: useMemoizedFn(setValuesRaw),
     symbolInfo: symbolInfo || types.EMPTY_OBJECT,
     metaState: meta,
     isMutating,
@@ -19189,6 +19499,107 @@ var useOrderEntry2 = (symbol, options = {}) => {
     symbolLeverage
   };
 };
+var initialOrderState2 = {
+  order_price: "",
+  order_quantity: "",
+  trigger_price: "",
+  tp_trigger_price: "",
+  sl_trigger_price: "",
+  total: "",
+  symbol: ""
+};
+var useOrderStore = zustand.create()(
+  immer.immer((set, get3) => ({
+    entry: {
+      side: types.OrderSide.BUY,
+      order_type: types.OrderType.LIMIT,
+      ...initialOrderState2
+    },
+    estLeverage: null,
+    estLiquidationPrice: null,
+    errors: {},
+    actions: {
+      initOrder: (symbol, options) => {
+        set((state) => {
+          state.entry = {
+            ...initialOrderState2,
+            symbol,
+            side: options?.side ?? types.OrderSide.BUY,
+            order_type: options?.order_type ?? types.OrderType.LIMIT,
+            margin_mode: options?.margin_mode ?? types.MarginMode.CROSS
+          };
+          state.estLeverage = null;
+          state.estLiquidationPrice = null;
+          state.errors = {};
+        });
+      },
+      hasTP_SL: () => {
+        const order = get3().entry;
+        return typeof order.tp_trigger_price !== "undefined" || typeof order.sl_trigger_price !== "undefined";
+      },
+      updateOrderComputed: (data) => {
+        set(
+          (state) => {
+            state.estLeverage = data.estLeverage;
+            state.estLiquidationPrice = data.estLiquidationPrice;
+          },
+          false
+          // "updateOrderComputed"
+        );
+      },
+      updateOrder: (order) => {
+        set(
+          (state) => {
+            state.entry = {
+              ...state.entry,
+              ...order
+            };
+          },
+          false
+          // "updateOrder"
+        );
+      },
+      updateOrderByKey: (key, value) => {
+        set(
+          (state) => {
+            state.entry[key] = value;
+          },
+          false
+          // "updateOrderByKey"
+        );
+      },
+      restoreOrder: (order) => {
+        set(
+          (state) => {
+            state.entry = order;
+          },
+          false
+          // "restoreOrder"
+        );
+      },
+      resetOrder: (_order) => {
+        set(
+          (state) => {
+            state.entry.order_price = "";
+            state.entry.order_quantity = "";
+            state.entry.trigger_price = "";
+            state.entry.total = "";
+            state.entry.tp_trigger_price = "";
+            state.entry.tp_pnl = "";
+            state.entry.tp_offset = "";
+            state.entry.tp_offset_percentage = "";
+            state.entry.sl_trigger_price = "";
+            state.entry.sl_pnl = "";
+            state.entry.sl_offset = "";
+            state.entry.sl_offset_percentage = "";
+          },
+          true
+          // "resetOrder"
+        );
+      }
+    }
+  }))
+);
 var useOrderEntity = (order, options) => {
   const { symbol } = order;
   const { maxQty } = options || {};
@@ -19465,6 +19876,7 @@ var useTpslPriceChecker = (params) => {
     slPrice,
     liqPrice,
     side,
+    markPrice,
     currentPosition,
     orderQuantity
   } = params;
@@ -19520,6 +19932,17 @@ var useTpslPriceChecker = (params) => {
     if (slPrice === void 0 || liqPrice === void 0 || side === void 0 || liqPrice === null) {
       return null;
     }
+    if (markPrice != null && Number.isFinite(markPrice) && markPrice > 0) {
+      if (side === types.OrderSide.BUY && liqPrice > markPrice) {
+        return null;
+      }
+      if (side === types.OrderSide.SELL && liqPrice < markPrice) {
+        return null;
+      }
+    }
+    if (typeof liqPrice === "number" && (!Number.isFinite(liqPrice) || liqPrice <= 0)) {
+      return null;
+    }
     let slPriceDecimal;
     let liqPriceDecimal;
     try {
@@ -19546,6 +19969,7 @@ var useTpslPriceChecker = (params) => {
     slPrice,
     liqPrice,
     side,
+    markPrice,
     warning_threshold,
     currentPosition,
     orderQuantity
@@ -19663,6 +20087,7 @@ exports.EpochStatus = EpochStatus;
 exports.ExtendedConfigStore = ExtendedConfigStore;
 exports.FlagKeys = FlagKeys;
 exports.MaintenanceStatus = MaintenanceStatus;
+exports.MarketCategoriesConfigProvider = MarketCategoriesConfigProvider;
 exports.MarketsStorageKey = MarketsStorageKey;
 exports.MarketsType = MarketsType;
 exports.ORDERLY_ORDERBOOK_DEPTH_KEY = ORDERLY_ORDERBOOK_DEPTH_KEY;
@@ -19679,6 +20104,7 @@ exports.fetcher = fetcher;
 exports.findPositionTPSLFromOrders = findPositionTPSLFromOrders;
 exports.findTPSLFromOrder = findTPSLFromOrder;
 exports.findTPSLOrderPriceFromOrder = findTPSLOrderPriceFromOrder;
+exports.formatSymbolWithBroker = formatSymbolWithBroker;
 exports.getMinNotional = getMinNotional;
 exports.getPriceKey = getPriceKey;
 exports.indexedDBManager = indexedDBManager;
@@ -19699,6 +20125,7 @@ exports.useApiKeyManager = useApiKeyManager;
 exports.useAppStore = useAppStore;
 exports.useAssetsHistory = useAssetsHistory;
 exports.useAudioPlayer = useAudioPlayer;
+exports.useBadgeBySymbol = useBadgeBySymbol;
 exports.useBalanceSubscription = useBalanceSubscription;
 exports.useBalanceTopic = useBalanceTopic;
 exports.useBoolean = useBoolean;
@@ -19757,6 +20184,7 @@ exports.useMarkPrice = useMarkPrice;
 exports.useMarkPriceBySymbol = useMarkPriceBySymbol;
 exports.useMarkPricesStream = useMarkPricesStream;
 exports.useMarket = useMarket;
+exports.useMarketCategoriesConfig = useMarketCategoriesConfig;
 exports.useMarketList = useMarketList;
 exports.useMarketMap = useMarketMap;
 exports.useMarketTradeStream = useMarketTradeStream;
@@ -19814,6 +20242,7 @@ exports.useSymbolInfo = useSymbolInfo;
 exports.useSymbolLeverage = useSymbolLeverage;
 exports.useSymbolLeverageMap = useSymbolLeverageMap;
 exports.useSymbolPriceRange = useSymbolPriceRange;
+exports.useSymbolWithBroker = useSymbolWithBroker;
 exports.useSymbolsInfo = useSymbolsInfo;
 exports.useSymbolsInfoStore = useSymbolsInfoStore;
 exports.useTPSLOrder = useTPSLOrder;