@orderly.network/ui-tpsl 3.0.0-beta.3 → 3.0.0-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -98,9 +98,13 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
98
98
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
99
99
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
100
100
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
101
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
102
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
101
103
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
102
104
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
103
105
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
106
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
107
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
104
108
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
105
109
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
106
110
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
@@ -148,9 +152,13 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
148
152
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
149
153
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
150
154
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
155
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
156
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
151
157
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
152
158
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
153
159
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
160
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
161
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
154
162
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
155
163
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
156
164
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
@@ -238,7 +246,7 @@ declare const useTPSLAdvanced: (props: Props$3) => {
238
246
  slPriceError: OrderValidationResult | null;
239
247
  estLiqPrice: number | null;
240
248
  estLiqPriceDistance: number | null;
241
- setValue: (key: "symbol" | "type" | "order_type" | "margin_mode" | "order_type_ext" | "order_price" | "order_quantity" | "order_amount" | "visible_quantity" | "side" | "reduce_only" | "slippage" | "order_tag" | "level" | "post_only_adjust" | "client_order_id" | "total" | "start_price" | "end_price" | "total_orders" | "distribution_type" | "skew" | "activated_price" | "callback_value" | "callback_rate" | "quantity" | "price" | "algo_type" | "trigger_price_type" | "trigger_price" | "child_orders" | "position_type" | "tp_pnl" | "tp_offset" | "tp_offset_percentage" | "tp_ROI" | "tp_trigger_price" | "tp_order_price" | "tp_order_type" | "sl_pnl" | "sl_offset" | "sl_offset_percentage" | "sl_ROI" | "sl_trigger_price" | "sl_order_price" | "sl_order_type", value: any, options?: {
249
+ setValue: (key: "symbol" | "type" | "order_type" | "margin_mode" | "order_type_ext" | "order_price" | "order_quantity" | "order_amount" | "visible_quantity" | "side" | "reduce_only" | "slippage" | "order_tag" | "level" | "post_only_adjust" | "client_order_id" | "total" | "start_price" | "end_price" | "total_orders" | "distribution_type" | "skew" | "activated_price" | "callback_value" | "callback_rate" | "quantity" | "price" | "algo_type" | "trigger_price_type" | "trigger_price" | "child_orders" | "position_type" | "tp_pnl" | "tp_offset" | "tp_offset_percentage" | "tp_offset_from_mark" | "tp_offset_percentage_from_mark" | "tp_ROI" | "tp_trigger_price" | "tp_order_price" | "tp_order_type" | "sl_pnl" | "sl_offset" | "sl_offset_percentage" | "sl_offset_from_mark" | "sl_offset_percentage_from_mark" | "sl_ROI" | "sl_trigger_price" | "sl_order_price" | "sl_order_type", value: any, options?: {
242
250
  shouldUpdateLastChangedField?: boolean;
243
251
  }) => void;
244
252
  setValues: (values: Partial<OrderlyOrder>) => void;
@@ -342,9 +350,13 @@ declare const useTPSLSimpleDialog: (options: TPSLBuilderOptions) => {
342
350
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
343
351
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
344
352
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
353
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
354
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
345
355
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
346
356
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
347
357
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
358
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
359
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
348
360
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
349
361
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
350
362
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
package/dist/index.d.ts CHANGED
@@ -98,9 +98,13 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
98
98
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
99
99
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
100
100
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
101
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
102
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
101
103
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
102
104
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
103
105
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
106
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
107
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
104
108
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
105
109
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
106
110
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
@@ -148,9 +152,13 @@ declare const useTPSLBuilder: (options: TPSLBuilderOptions$1 & PropsWithTriggerP
148
152
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
149
153
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
150
154
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
155
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
156
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
151
157
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
152
158
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
153
159
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
160
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
161
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
154
162
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
155
163
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
156
164
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
@@ -238,7 +246,7 @@ declare const useTPSLAdvanced: (props: Props$3) => {
238
246
  slPriceError: OrderValidationResult | null;
239
247
  estLiqPrice: number | null;
240
248
  estLiqPriceDistance: number | null;
241
- setValue: (key: "symbol" | "type" | "order_type" | "margin_mode" | "order_type_ext" | "order_price" | "order_quantity" | "order_amount" | "visible_quantity" | "side" | "reduce_only" | "slippage" | "order_tag" | "level" | "post_only_adjust" | "client_order_id" | "total" | "start_price" | "end_price" | "total_orders" | "distribution_type" | "skew" | "activated_price" | "callback_value" | "callback_rate" | "quantity" | "price" | "algo_type" | "trigger_price_type" | "trigger_price" | "child_orders" | "position_type" | "tp_pnl" | "tp_offset" | "tp_offset_percentage" | "tp_ROI" | "tp_trigger_price" | "tp_order_price" | "tp_order_type" | "sl_pnl" | "sl_offset" | "sl_offset_percentage" | "sl_ROI" | "sl_trigger_price" | "sl_order_price" | "sl_order_type", value: any, options?: {
249
+ setValue: (key: "symbol" | "type" | "order_type" | "margin_mode" | "order_type_ext" | "order_price" | "order_quantity" | "order_amount" | "visible_quantity" | "side" | "reduce_only" | "slippage" | "order_tag" | "level" | "post_only_adjust" | "client_order_id" | "total" | "start_price" | "end_price" | "total_orders" | "distribution_type" | "skew" | "activated_price" | "callback_value" | "callback_rate" | "quantity" | "price" | "algo_type" | "trigger_price_type" | "trigger_price" | "child_orders" | "position_type" | "tp_pnl" | "tp_offset" | "tp_offset_percentage" | "tp_offset_from_mark" | "tp_offset_percentage_from_mark" | "tp_ROI" | "tp_trigger_price" | "tp_order_price" | "tp_order_type" | "sl_pnl" | "sl_offset" | "sl_offset_percentage" | "sl_offset_from_mark" | "sl_offset_percentage_from_mark" | "sl_ROI" | "sl_trigger_price" | "sl_order_price" | "sl_order_type", value: any, options?: {
242
250
  shouldUpdateLastChangedField?: boolean;
243
251
  }) => void;
244
252
  setValues: (values: Partial<OrderlyOrder>) => void;
@@ -342,9 +350,13 @@ declare const useTPSLSimpleDialog: (options: TPSLBuilderOptions) => {
342
350
  trigger_price_type?: _orderly_network_hooks.OrderValidationItem | undefined;
343
351
  child_orders?: _orderly_network_hooks.OrderValidationItem | undefined;
344
352
  position_type?: _orderly_network_hooks.OrderValidationItem | undefined;
353
+ tp_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
354
+ tp_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
345
355
  tp_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
346
356
  tp_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
347
357
  tp_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
358
+ sl_offset_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
359
+ sl_offset_percentage_from_mark?: _orderly_network_hooks.OrderValidationItem | undefined;
348
360
  sl_trigger_price?: _orderly_network_hooks.OrderValidationItem | undefined;
349
361
  sl_order_price?: _orderly_network_hooks.OrderValidationItem | undefined;
350
362
  sl_order_type?: _orderly_network_hooks.OrderValidationItem | undefined;
package/dist/index.js CHANGED
@@ -19,6 +19,7 @@ var SymbolBadge = (props) => {
19
19
  const badge = brokerName ?? brokerId ?? void 0;
20
20
  return /* @__PURE__ */ jsxRuntime.jsx(ui.SymbolBadge, { badge, fullName: brokerNameRaw });
21
21
  };
22
+ var LIQ_DISTANCE_THRESHOLD = 10;
22
23
  var OrderInfo = (props) => {
23
24
  const { t } = i18n.useTranslation();
24
25
  const { order: order2, symbolLeverage } = props;
@@ -31,6 +32,8 @@ var OrderInfo = (props) => {
31
32
  props.marginMode
32
33
  );
33
34
  const currentLeverage = symbolLeverage || leverage;
35
+ const markPriceValue = markPrice?.data;
36
+ const estLiqPrice = props.estLiqPrice === 0 || !markPriceValue || markPriceValue === 0 || Math.abs((props.estLiqPrice ?? 0) - markPriceValue) / markPriceValue >= LIQ_DISTANCE_THRESHOLD ? "--" : props.estLiqPrice ?? "--";
34
37
  return /* @__PURE__ */ jsxRuntime.jsxs(
35
38
  ui.Flex,
36
39
  {
@@ -154,7 +157,7 @@ var OrderInfo = (props) => {
154
157
  className: "oui-text-warning",
155
158
  size: "2xs",
156
159
  dp: props.quoteDP ?? 2,
157
- children: props.estLiqPrice ?? "--"
160
+ children: estLiqPrice
158
161
  }
159
162
  )
160
163
  ] })
@@ -287,6 +290,10 @@ var usePNLInputBuilder = (props) => {
287
290
  return `${type.toLowerCase()}_offset`;
288
291
  case "Offset%" /* PERCENTAGE */:
289
292
  return `${type.toLowerCase()}_offset_percentage`;
293
+ case "OffsetFromMark" /* OFFSET_FROM_MARK */:
294
+ return `${type.toLowerCase()}_offset_from_mark`;
295
+ case "PercentageFromMark" /* PERCENTAGE_FROM_MARK */:
296
+ return `${type.toLowerCase()}_offset_percentage_from_mark`;
290
297
  default:
291
298
  return `${type.toLowerCase()}_pnl`;
292
299
  }
@@ -304,15 +311,34 @@ var usePNLInputBuilder = (props) => {
304
311
  {
305
312
  label: t("tpsl.offset"),
306
313
  value: "Offset" /* OFFSET */,
307
- testId: `${"Offset" /* OFFSET */}_mneu_item`
314
+ testId: `${"Offset" /* OFFSET */}_menu_item`
308
315
  },
309
316
  {
310
- label: `${t("tpsl.offset")}%`,
317
+ label: t("tpsl.offsetPercent"),
311
318
  value: "Offset%" /* PERCENTAGE */,
312
319
  testId: `${"Offset%" /* PERCENTAGE */}_menu_item`
320
+ },
321
+ {
322
+ label: t("tpsl.offsetMark"),
323
+ value: "OffsetFromMark" /* OFFSET_FROM_MARK */,
324
+ testId: `${"OffsetFromMark" /* OFFSET_FROM_MARK */}_menu_item`
325
+ },
326
+ {
327
+ label: t("tpsl.offsetPercentMark"),
328
+ value: "PercentageFromMark" /* PERCENTAGE_FROM_MARK */,
329
+ testId: `${"PercentageFromMark" /* PERCENTAGE_FROM_MARK */}_menu_item`
313
330
  }
314
331
  ];
315
332
  }, [t]);
333
+ const modeLabelMap = react.useMemo(() => {
334
+ return {
335
+ ["PnL" /* PnL */]: t("tpsl.pnl"),
336
+ ["Offset" /* OFFSET */]: t("tpsl.offsetHolder"),
337
+ ["Offset%" /* PERCENTAGE */]: t("tpsl.offsetHolder"),
338
+ ["OffsetFromMark" /* OFFSET_FROM_MARK */]: t("tpsl.offsetHolder"),
339
+ ["PercentageFromMark" /* PERCENTAGE_FROM_MARK */]: t("tpsl.offsetHolder")
340
+ };
341
+ }, [t]);
316
342
  const percentageSuffix = react.useRef("");
317
343
  const onValueChange = (value2) => {
318
344
  props.onChange(key, value2);
@@ -323,7 +349,7 @@ var usePNLInputBuilder = (props) => {
323
349
  onRenderBefore: (value2, options2) => {
324
350
  value2 = `${value2}`;
325
351
  if (value2 === "" || value2 === "-") return "";
326
- if (mode === "Offset%" /* PERCENTAGE */) {
352
+ if (mode === "Offset%" /* PERCENTAGE */ || mode === "PercentageFromMark" /* PERCENTAGE_FROM_MARK */) {
327
353
  try {
328
354
  return `${new utils.Decimal(
329
355
  value2.replace(
@@ -334,7 +360,7 @@ var usePNLInputBuilder = (props) => {
334
360
  } catch {
335
361
  return "";
336
362
  }
337
- } else if (mode === "Offset" /* OFFSET */) {
363
+ } else if (mode === "Offset" /* OFFSET */ || mode === "OffsetFromMark" /* OFFSET_FROM_MARK */) {
338
364
  value2 = utils.todpIfNeed(value2, dp);
339
365
  } else ;
340
366
  return `${value2}`;
@@ -343,7 +369,7 @@ var usePNLInputBuilder = (props) => {
343
369
  if (/^\-?0{2,}$/.test(value2)) {
344
370
  return "0";
345
371
  }
346
- if (mode === "Offset%" /* PERCENTAGE */) {
372
+ if (mode === "Offset%" /* PERCENTAGE */ || mode === "PercentageFromMark" /* PERCENTAGE_FROM_MARK */) {
347
373
  if (value2 !== "") {
348
374
  value2 = utils.todpIfNeed(value2, 2);
349
375
  const endStr = value2.match(/\.0{0,2}$/);
@@ -372,6 +398,7 @@ var usePNLInputBuilder = (props) => {
372
398
  return {
373
399
  mode,
374
400
  modes,
401
+ modeLabelMap,
375
402
  type: props.type,
376
403
  formatter,
377
404
  onModeChange: (mode2) => {
@@ -388,6 +415,7 @@ var PNLInput = (props) => {
388
415
  const {
389
416
  mode,
390
417
  modes,
418
+ modeLabelMap,
391
419
  onModeChange,
392
420
  onValueChange,
393
421
  quote,
@@ -395,26 +423,19 @@ var PNLInput = (props) => {
395
423
  value,
396
424
  pnl
397
425
  } = props;
398
- const { t } = i18n.useTranslation();
399
- const [prefix, setPrefix] = react.useState(mode);
400
- const [placeholder, setPlaceholder] = react.useState(
401
- mode === "Offset%" /* PERCENTAGE */ ? "%" : quote
402
- );
426
+ const [isInputFocused, setIsInputFocused] = react.useState(false);
403
427
  const color = react.useMemo(() => {
404
428
  const num = Number(pnl);
405
429
  if (isNaN(num) || num === 0) return "";
406
430
  if (num > 0) return "oui-text-trade-profit";
407
431
  if (num < 0) return "oui-text-trade-loss";
408
432
  }, [pnl]);
409
- react.useEffect(() => {
410
- const label = modes.find((item) => item.value === mode)?.label;
411
- setPrefix(label);
412
- setPlaceholder(mode === "Offset%" /* PERCENTAGE */ ? "%" : quote);
413
- }, [mode, modes]);
433
+ const prefixLabel = String(modeLabelMap[mode] ?? mode ?? "");
434
+ const placeholder = isInputFocused ? "" : mode === "Offset%" /* PERCENTAGE */ || mode === "PercentageFromMark" /* PERCENTAGE_FROM_MARK */ ? "%" : quote;
414
435
  return /* @__PURE__ */ jsxRuntime.jsx(
415
436
  ui.Input,
416
437
  {
417
- prefix,
438
+ prefix: prefixLabel,
418
439
  size: {
419
440
  initial: "lg",
420
441
  lg: "md"
@@ -437,15 +458,15 @@ var PNLInput = (props) => {
437
458
  root: "oui-outline-line-12 focus-within:oui-outline-primary-light"
438
459
  },
439
460
  onFocus: () => {
440
- setPlaceholder("");
461
+ setIsInputFocused(true);
441
462
  props.setFocus(true);
442
463
  },
443
464
  onBlur: () => {
444
- setPlaceholder(mode === "Offset%" /* PERCENTAGE */ ? "%" : quote);
465
+ setIsInputFocused(false);
445
466
  props.setFocus(false);
446
467
  },
447
468
  suffix: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
448
- mode === "Offset%" /* PERCENTAGE */ && !!value && /* @__PURE__ */ jsxRuntime.jsx(
469
+ (mode === "Offset%" /* PERCENTAGE */ || mode === "PercentageFromMark" /* PERCENTAGE_FROM_MARK */) && !!value && /* @__PURE__ */ jsxRuntime.jsx(
449
470
  ui.Text,
450
471
  {
451
472
  size: "2xs",
@@ -474,7 +495,7 @@ var PNLMenus = (props) => {
474
495
  menu: props.modes,
475
496
  align: "end",
476
497
  size: "xs",
477
- className: "oui-min-w-[80px]",
498
+ className: "oui-min-w-[120px]",
478
499
  onSelect: (item) => props.onModeChange(item),
479
500
  children: /* @__PURE__ */ jsxRuntime.jsx("button", { className: "oui-p-2", children: /* @__PURE__ */ jsxRuntime.jsx(ui.CaretDownIcon, { size: 12, color: "white" }) })
480
501
  }
@@ -1027,6 +1048,8 @@ var TPSL = (props) => {
1027
1048
  PnL: TPSL_OrderEntity.tp_pnl?.toString() ?? void 0,
1028
1049
  Offset: TPSL_OrderEntity.tp_offset?.toString() ?? void 0,
1029
1050
  "Offset%": TPSL_OrderEntity.tp_offset_percentage?.toString() ?? void 0,
1051
+ OffsetFromMark: TPSL_OrderEntity.tp_offset_from_mark?.toString() ?? void 0,
1052
+ PercentageFromMark: TPSL_OrderEntity.tp_offset_percentage_from_mark?.toString() ?? void 0,
1030
1053
  order_price: TPSL_OrderEntity.tp_order_price?.toString() ?? void 0,
1031
1054
  order_type: TPSL_OrderEntity.tp_order_type ?? types.OrderType.MARKET
1032
1055
  },
@@ -1064,6 +1087,8 @@ var TPSL = (props) => {
1064
1087
  PnL: TPSL_OrderEntity.sl_pnl?.toString() ?? void 0,
1065
1088
  Offset: TPSL_OrderEntity.sl_offset?.toString() ?? void 0,
1066
1089
  "Offset%": TPSL_OrderEntity.sl_offset_percentage?.toString() ?? void 0,
1090
+ OffsetFromMark: TPSL_OrderEntity.sl_offset_from_mark?.toString() ?? void 0,
1091
+ PercentageFromMark: TPSL_OrderEntity.sl_offset_percentage_from_mark?.toString() ?? void 0,
1067
1092
  order_price: TPSL_OrderEntity.sl_order_price?.toString() ?? void 0,
1068
1093
  order_type: TPSL_OrderEntity.sl_order_type ?? types.OrderType.MARKET
1069
1094
  },
@@ -1688,6 +1713,8 @@ var TPSLAdvancedUI = (props) => {
1688
1713
  PnL: formattedOrder.tp_pnl ?? "",
1689
1714
  Offset: formattedOrder.tp_offset ?? "",
1690
1715
  "Offset%": formattedOrder.tp_offset_percentage ?? "",
1716
+ OffsetFromMark: formattedOrder.tp_offset_from_mark ?? "",
1717
+ PercentageFromMark: formattedOrder.tp_offset_percentage_from_mark ?? "",
1691
1718
  ROI: formattedOrder.tp_ROI ?? ""
1692
1719
  });
1693
1720
  const [slValues, setSlValues] = react.useState({
@@ -1698,6 +1725,8 @@ var TPSLAdvancedUI = (props) => {
1698
1725
  PnL: formattedOrder.sl_pnl ?? "",
1699
1726
  Offset: formattedOrder.sl_offset ?? "",
1700
1727
  "Offset%": formattedOrder.sl_offset_percentage ?? "",
1728
+ OffsetFromMark: formattedOrder.sl_offset_from_mark ?? "",
1729
+ PercentageFromMark: formattedOrder.sl_offset_percentage_from_mark ?? "",
1701
1730
  ROI: formattedOrder.sl_ROI ?? ""
1702
1731
  });
1703
1732
  react.useEffect(() => {
@@ -1710,6 +1739,8 @@ var TPSLAdvancedUI = (props) => {
1710
1739
  PnL: formattedOrder.tp_pnl ?? "",
1711
1740
  Offset: formattedOrder.tp_offset ?? "",
1712
1741
  "Offset%": formattedOrder.tp_offset_percentage ?? "",
1742
+ OffsetFromMark: formattedOrder.tp_offset_from_mark ?? "",
1743
+ PercentageFromMark: formattedOrder.tp_offset_percentage_from_mark ?? "",
1713
1744
  ROI: formattedOrder.tp_ROI ?? ""
1714
1745
  }));
1715
1746
  }, [formattedOrder]);
@@ -1723,6 +1754,8 @@ var TPSLAdvancedUI = (props) => {
1723
1754
  PnL: formattedOrder.sl_pnl ?? "",
1724
1755
  Offset: formattedOrder.sl_offset ?? "",
1725
1756
  "Offset%": formattedOrder.sl_offset_percentage ?? "",
1757
+ OffsetFromMark: formattedOrder.sl_offset_from_mark ?? "",
1758
+ PercentageFromMark: formattedOrder.sl_offset_percentage_from_mark ?? "",
1726
1759
  ROI: formattedOrder.sl_ROI ?? ""
1727
1760
  }));
1728
1761
  }, [formattedOrder]);
@@ -1953,16 +1986,23 @@ var useTPSLAdvanced = (props) => {
1953
1986
  sl_pnl: order2.sl_pnl,
1954
1987
  sl_offset: order2.sl_offset,
1955
1988
  sl_offset_percentage: order2.sl_offset_percentage,
1989
+ sl_offset_from_mark: order2.sl_offset_from_mark,
1990
+ sl_offset_percentage_from_mark: order2.sl_offset_percentage_from_mark,
1956
1991
  tp_pnl: order2.tp_pnl,
1957
1992
  tp_offset: order2.tp_offset,
1958
1993
  tp_offset_percentage: order2.tp_offset_percentage,
1994
+ tp_offset_from_mark: order2.tp_offset_from_mark,
1995
+ tp_offset_percentage_from_mark: order2.tp_offset_percentage_from_mark,
1959
1996
  margin_mode: order2.margin_mode
1960
1997
  }
1961
1998
  });
1962
1999
  const slPriceError = hooks.useTpslPriceChecker({
1963
2000
  slPrice: formattedOrder.sl_trigger_price,
1964
2001
  liqPrice: state.estLiqPrice,
1965
- side: formattedOrder.side
2002
+ side: formattedOrder.side,
2003
+ markPrice: state.markPrice,
2004
+ currentPosition: state.currentPosition,
2005
+ orderQuantity: Number(formattedOrder.order_quantity)
1966
2006
  });
1967
2007
  const onSubmit = () => {
1968
2008
  const isSlPriceError = slPriceError?.sl_trigger_price?.type === hooks.ERROR_MSG_CODES.SL_PRICE_ERROR;
@@ -2636,7 +2676,6 @@ var TPSLDetailUI = (props) => {
2636
2676
  symbolInfo
2637
2677
  } = props;
2638
2678
  const { estLiqPrice } = useTPSLDetailContext();
2639
- console.log("----- position", position);
2640
2679
  return /* @__PURE__ */ jsxRuntime.jsx(ui.Box, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.ScrollArea, { className: ui.cn(isMobile && "oui-h-[calc(100vh-100px)]"), children: [
2641
2680
  /* @__PURE__ */ jsxRuntime.jsx(
2642
2681
  OrderInfo,
@@ -3475,6 +3514,8 @@ var EditBracketOrderUI = (props) => {
3475
3514
  PnL: formattedOrder.tp_pnl ?? "",
3476
3515
  Offset: formattedOrder.tp_offset ?? "",
3477
3516
  "Offset%": formattedOrder.tp_offset_percentage ?? "",
3517
+ OffsetFromMark: formattedOrder.tp_offset_from_mark ?? "",
3518
+ PercentageFromMark: formattedOrder.tp_offset_percentage_from_mark ?? "",
3478
3519
  ROI: formattedOrder.tp_ROI ?? ""
3479
3520
  });
3480
3521
  const [slValues, setSlValues] = react.useState({
@@ -3485,6 +3526,8 @@ var EditBracketOrderUI = (props) => {
3485
3526
  PnL: formattedOrder.sl_pnl ?? "",
3486
3527
  Offset: formattedOrder.sl_offset ?? "",
3487
3528
  "Offset%": formattedOrder.sl_offset_percentage ?? "",
3529
+ OffsetFromMark: formattedOrder.sl_offset_from_mark ?? "",
3530
+ PercentageFromMark: formattedOrder.sl_offset_percentage_from_mark ?? "",
3488
3531
  ROI: formattedOrder.sl_ROI ?? ""
3489
3532
  });
3490
3533
  react.useEffect(() => {
@@ -3497,6 +3540,8 @@ var EditBracketOrderUI = (props) => {
3497
3540
  PnL: formattedOrder.tp_pnl ?? "",
3498
3541
  Offset: formattedOrder.tp_offset ?? "",
3499
3542
  "Offset%": formattedOrder.tp_offset_percentage ?? "",
3543
+ OffsetFromMark: formattedOrder.tp_offset_from_mark ?? "",
3544
+ PercentageFromMark: formattedOrder.tp_offset_percentage_from_mark ?? "",
3500
3545
  ROI: formattedOrder.tp_ROI ?? ""
3501
3546
  }));
3502
3547
  }, [formattedOrder]);
@@ -3510,6 +3555,8 @@ var EditBracketOrderUI = (props) => {
3510
3555
  PnL: formattedOrder.sl_pnl ?? "",
3511
3556
  Offset: formattedOrder.sl_offset ?? "",
3512
3557
  "Offset%": formattedOrder.sl_offset_percentage ?? "",
3558
+ OffsetFromMark: formattedOrder.sl_offset_from_mark ?? "",
3559
+ PercentageFromMark: formattedOrder.sl_offset_percentage_from_mark ?? "",
3513
3560
  ROI: formattedOrder.sl_ROI ?? ""
3514
3561
  }));
3515
3562
  }, [formattedOrder]);