@orderly.network/ui-order-entry 2.10.0 → 2.10.1-alpha.0

package/dist/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var React3 = require('react');
+var React2 = require('react');
 var hooks = require('@orderly.network/hooks');
 var i18n = require('@orderly.network/i18n');
 var reactApp = require('@orderly.network/react-app');
@@ -10,13 +10,12 @@ var uiTpsl = require('@orderly.network/ui-tpsl');
 var utils = require('@orderly.network/utils');
 var jsxRuntime = require('react/jsx-runtime');
 var uiConnector = require('@orderly.network/ui-connector');
-var uiScaffold = require('@orderly.network/ui-scaffold');
 var perp = require('@orderly.network/perp');
 var uiLeverage = require('@orderly.network/ui-leverage');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
-var React3__default = /*#__PURE__*/_interopDefault(React3);
+var React2__default = /*#__PURE__*/_interopDefault(React2);
 
 // src/orderEntry.ui.tsx
 var AdditionalInfo = (props) => {
@@ -31,7 +30,7 @@ var AdditionalInfo = (props) => {
       );
     }
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     props.onValueChange?.("visible_quantity", props.hidden ? 0 : 1);
   }, [props.hidden]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-text-base-contrast-54", children: [
@@ -226,7 +225,7 @@ var AdditionalInfo = (props) => {
   ] });
 };
 function AdditionalConfigButton(props) {
-  const [open2, setOpen] = React3.useState(false);
+  const [open2, setOpen] = React2.useState(false);
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.PopoverRoot, { open: open2, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsxRuntime.jsx(ui.PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
       "button",
@@ -259,7 +258,7 @@ function AdditionalConfigButton(props) {
 }
 var defaultPath = "M10.007 1.302a.74.74 0 0 0-.486.214c-1.033.989-1.349 1.815-.972 2.948-.88.675-1.437.84-2.536.84-1.503 0-2.484.182-3.152.85v.02a1.583 1.583 0 0 0 0 2.248l1.867 1.882-3.181 3.18c-.26.26-.28.696-.02.956.261.26.699.26.959 0l3.193-3.194 1.87 1.861a1.585 1.585 0 0 0 2.25 0h.02c.668-.667.854-1.523.854-3.144 0-1.03.212-1.758.852-2.523 1.233.361 1.95.015 2.961-.995a.68.68 0 0 0 .188-.48c0-.234-.06-.593-.209-1.04a5.34 5.34 0 0 0-1.312-2.103 5.35 5.35 0 0 0-2.104-1.312c-.448-.15-.808-.208-1.042-.208";
 var PinButton = (props) => {
-  const [path, setPath] = React3.useState(defaultPath);
+  const [path, setPath] = React2.useState(defaultPath);
   return /* @__PURE__ */ jsxRuntime.jsx("button", { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
     "svg",
     {
@@ -509,142 +508,6 @@ var EditIcon = (props) => {
     }
   );
 };
-var EffectiveFee = React3__default.default.forwardRef((props, ref) => {
-  const linearId = React3.useId();
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      width: 14,
-      height: 14,
-      viewBox: "0 0 14 14",
-      fill: "currentColor",
-      ref,
-      focusable: false,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "path",
-          {
-            d: "M6.16411 1.53106C6.61974 1.07566 7.35888 1.07551 7.81442 1.53106L8.48833 2.20496C8.6797 2.39624 8.93064 2.51452 9.19755 2.54106L9.3132 2.54676H10.2662C10.9104 2.54691 11.4328 3.06926 11.4329 3.71343V4.66647C11.4329 4.97589 11.5559 5.27312 11.7747 5.49191L12.4492 6.16582C12.9047 6.62142 12.9047 7.36054 12.4492 7.81613L11.7753 8.49004L11.6972 8.57549C11.5272 8.78302 11.433 9.04426 11.4329 9.31491V10.2685L11.4272 10.3876C11.3715 10.9366 10.9348 11.373 10.3859 11.4289L10.2662 11.4352H9.3132L9.19755 11.4409C8.93066 11.4674 8.67969 11.5857 8.48833 11.777L7.81442 12.4509L7.72555 12.5306C7.29789 12.8795 6.68066 12.8794 6.25297 12.5306L6.16411 12.4509L5.4902 11.777C5.29887 11.5857 5.04786 11.4675 4.78097 11.4409L4.66533 11.4352H3.71171L3.59265 11.4289C3.04358 11.3731 2.60705 10.9367 2.55131 10.3876L2.54505 10.2685V9.31491C2.54499 9.04416 2.45089 8.78306 2.28072 8.57549L2.20325 8.49004L1.52934 7.81613C1.10213 7.38905 1.07534 6.71297 1.44902 6.25469L1.52934 6.16582L2.20382 5.49191C2.42248 5.27314 2.54505 4.97579 2.54505 4.66647V3.71343C2.54513 3.10945 3.00442 2.61221 3.59265 2.55246L3.71171 2.54676H4.66533L4.78097 2.54106C5.00968 2.51826 5.22694 2.4281 5.40475 2.28244L5.4902 2.20496L6.16411 1.53106ZM6.31507 3.02983C5.87756 3.46727 5.28401 3.71336 4.66533 3.71343H3.71171V4.66647C3.71171 5.28521 3.46614 5.87922 3.02869 6.31678L2.35421 6.99069L3.02812 7.6646C3.46577 8.10214 3.71164 8.69607 3.71171 9.31491V10.2685H4.66533C5.28396 10.2686 5.87757 10.5142 6.31507 10.9515L6.98898 11.6255L7.66289 10.9515C8.10045 10.5141 8.69446 10.2685 9.3132 10.2685H10.2662V9.31491C10.2663 8.69604 10.5127 8.10214 10.9504 7.6646L11.6243 6.99069L10.9498 6.31678C10.5122 5.8792 10.2662 5.28531 10.2662 4.66647V3.71343H9.3132C8.69438 3.71343 8.10047 3.46739 7.66289 3.02983L6.98898 2.35592L6.31507 3.02983ZM8.52934 4.64255C8.7571 4.41479 9.12639 4.41489 9.35421 4.64255C9.58202 4.87035 9.58202 5.23961 9.35421 5.46742L5.4657 9.35593C5.2379 9.58372 4.86863 9.58373 4.64083 9.35593C4.41318 9.12811 4.41308 8.75881 4.64083 8.53106L8.52934 4.64255ZM8.66435 7.83265C9.1245 7.83272 9.49777 8.2059 9.49777 8.66607C9.49769 9.12616 9.12445 9.49941 8.66435 9.49948C8.20419 9.49948 7.83101 9.12621 7.83094 8.66607C7.83094 8.20586 8.20415 7.83265 8.66435 7.83265ZM5.33126 4.49956C5.79141 4.49963 6.16468 4.87282 6.16468 5.33298C6.1646 5.79307 5.79136 6.16575 5.33126 6.16582C4.87111 6.16582 4.49793 5.79311 4.49785 5.33298C4.49785 4.87277 4.87106 4.49956 5.33126 4.49956Z",
-            fill: `url(#${linearId})`
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx("defs", { children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "linearGradient",
-          {
-            id: linearId,
-            x1: "12.7908",
-            y1: "6.99084",
-            x2: "1.1875",
-            y2: "6.99084",
-            gradientUnits: "userSpaceOnUse",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "rgb(var(--oui-gradient-brand-end))" }),
-              /* @__PURE__ */ jsxRuntime.jsx("stop", { stopColor: "rgb(var(--oui-gradient-brand-start))", offset: 1 })
-            ]
-          }
-        ) })
-      ]
-    }
-  );
-});
-if (process.env.NODE_ENV !== "production") {
-  EffectiveFee.displayName = "EffectiveFee";
-}
-var EffectiveFeeBody = ({ routerAdapter, onClose }) => {
-  const { t } = i18n.useTranslation();
-  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { size: "2xs", className: "oui-whitespace-normal oui-break-words", children: [
-    t("portfolio.feeTier.effectiveFee.tooltip"),
-    " ",
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "a",
-      {
-        href: "/rewards/affiliate",
-        onClick: (e) => {
-          e.preventDefault();
-          routerAdapter?.onRouteChange({
-            href: "/rewards/affiliate",
-            name: t("portfolio.feeTier.effectiveFee.tooltipLink")
-          });
-          onClose?.();
-        },
-        className: "oui-cursor-pointer oui-border-none oui-bg-transparent oui-p-0 oui-text-2xs oui-underline hover:oui-text-base-contrast-80",
-        children: t("portfolio.feeTier.effectiveFee.tooltipLink")
-      }
-    )
-  ] });
-};
-var EffectiveFeeMobileContent = ({ routerAdapter }) => {
-  const { hide } = ui.useModal();
-  return /* @__PURE__ */ jsxRuntime.jsx(EffectiveFeeBody, { routerAdapter, onClose: hide });
-};
-var EffectiveFeeSection = (props) => {
-  const { routerAdapter } = props;
-  const { isMobile } = ui.useScreen();
-  const { t } = i18n.useTranslation();
-  if (isMobile) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      EffectiveFee,
-      {
-        onClick: () => {
-          ui.modal.dialog({
-            size: "sm",
-            title: t("common.tips"),
-            content: /* @__PURE__ */ jsxRuntime.jsx(EffectiveFeeMobileContent, { routerAdapter })
-          });
-        }
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    ui.Tooltip,
-    {
-      content: /* @__PURE__ */ jsxRuntime.jsx(EffectiveFeeBody, { routerAdapter }),
-      className: "oui-p-1.5 oui-text-base-contrast-54",
-      children: /* @__PURE__ */ jsxRuntime.jsx(EffectiveFee, { className: "oui-cursor-pointer" })
-    }
-  );
-};
-var EffectiveFeeUI = (props) => {
-  const { t } = i18n.useTranslation();
-  const { routerAdapter } = uiScaffold.useScaffoldContext();
-  const { taker, maker } = props;
-  const originalTrailingFees = /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { itemAlign: "center", justify: "between", width: "100%", gap: 1, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { width: "100%", itemAlign: "center", justify: "between", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { className: "oui-truncate", size: "2xs", children: t("common.fees") }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        uiConnector.AuthGuard,
-        {
-          fallback: () => /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "oui-truncate", size: "2xs", children: [
-            t("dmm.taker"),
-            ": --% / ",
-            t("dmm.maker"),
-            ": --%"
-          ] }),
-          children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { gap: 1, children: [
-            /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "oui-truncate", size: "2xs", children: [
-              t("dmm.taker"),
-              ":"
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "2xs", className: "oui-text-base-contrast-80", children: taker }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "2xs", children: "/" }),
-            /* @__PURE__ */ jsxRuntime.jsxs(ui.Text, { className: "oui-truncate", size: "2xs", children: [
-              t("dmm.maker"),
-              ":"
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.Text, { size: "2xs", className: "oui-text-base-contrast-80", children: maker })
-          ] })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(EffectiveFeeSection, { routerAdapter })
-  ] });
-  return originalTrailingFees;
-};
-var EffectiveFeesWidget = (props) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(EffectiveFeeUI, { ...props });
-};
 var RegularFeesUI = (props) => {
   const { t } = i18n.useTranslation();
   const { taker, maker } = props;
@@ -680,36 +543,28 @@ var RegularFeesUI = (props) => {
 var RegularFeesWidget = (props) => {
   return /* @__PURE__ */ jsxRuntime.jsx(RegularFeesUI, { ...props });
 };
-var isEffective = (val) => typeof val !== "undefined" && val !== null;
 var FeesWidget = ({ symbol }) => {
-  const { refereeRebate, ...others } = hooks.useFeeState();
+  const { takerFee, makerFee, rwaTakerFee, rwaMakerFee } = hooks.useFeeState();
   const info = hooks.useRwaSymbolsInfoStore();
   const isRwa = info?.[symbol] !== void 0;
-  const isEffectiveFee = isEffective(refereeRebate);
-  return isEffectiveFee ? /* @__PURE__ */ jsxRuntime.jsx(
-    EffectiveFeesWidget,
-    {
-      taker: isRwa ? others.rwaEffectiveTakerFee : others.effectiveTakerFee,
-      maker: isRwa ? others.rwaEffectiveMakerFee : others.effectiveMakerFee
-    }
-  ) : /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsx(
     RegularFeesWidget,
     {
-      taker: isRwa ? others.rwaTakerFee : others.takerFee,
-      maker: isRwa ? others.rwaMakerFee : others.makerFee
+      taker: isRwa ? rwaTakerFee : takerFee,
+      maker: isRwa ? rwaMakerFee : makerFee
     }
   );
 };
 var options = [0.01, 0.05, 0.1];
-var SlippageEditor = React3.forwardRef((props, ref) => {
+var SlippageEditor = React2.forwardRef((props, ref) => {
   const { t } = i18n.useTranslation();
-  const [value, setValue] = React3.useState();
-  const [customValue, setCustomValue] = React3.useState("");
-  const [error, setError] = React3.useState(void 0);
-  React3.useImperativeHandle(ref, () => ({
+  const [value, setValue] = React2.useState();
+  const [customValue, setCustomValue] = React2.useState("");
+  const [error, setError] = React2.useState(void 0);
+  React2.useImperativeHandle(ref, () => ({
     getValue: () => customValue ? new utils.Decimal(customValue)?.toNumber() : value
   }));
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (props.initialValue && !options.includes(props.initialValue)) {
       setCustomValue(props.initialValue.toString());
     } else {
@@ -826,7 +681,7 @@ var SlippageCell = (props) => {
   const { t } = i18n.useTranslation();
   const [open2, { setTrue: setOpen, setFalse: setClose, toggle }] = hooks.useBoolean(false);
   const { isMobile } = ui.useScreen();
-  const slippageRef = React3.useRef(null);
+  const slippageRef = React2.useRef(null);
   const onConfirm = () => {
     const val = slippageRef.current?.getValue();
     props.setSlippage(!val ? "1" : val.toString());
@@ -1091,7 +946,7 @@ var useLTVTooltipScript = () => {
     };
   });
   const currentLtv = hooks.useComputedLTV();
-  const onConvert = React3.useCallback(async () => {
+  const onConvert = React2.useCallback(async () => {
     return ui.modal.show("ConvertDialogId");
   }, []);
   return {
@@ -1112,7 +967,7 @@ var Available = (props) => {
   const { canTrade, currentLtv, quote, freeCollateral } = props;
   const { t } = i18n.useTranslation();
   const { isMobile } = ui.useScreen();
-  const showLTV = React3.useMemo(() => {
+  const showLTV = React2.useMemo(() => {
     return typeof currentLtv === "number" && !Number.isNaN(currentLtv) && currentLtv > 0;
   }, [currentLtv]);
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, { itemAlign: "center", justify: "between", children: [
@@ -1530,7 +1385,7 @@ var OrderItem = (props) => {
 OrderConfirmDialog.displayName = "OrderConfirmDialog";
 var OrderTypeTag = (props) => {
   const { t } = i18n.useTranslation();
-  const typeStr = React3.useMemo(() => {
+  const typeStr = React2.useMemo(() => {
     switch (props.type) {
       case types.OrderType.LIMIT:
         return t("orderEntry.orderType.limit");
@@ -1570,7 +1425,7 @@ ui.registerSimpleDialog(orderConfirmDialogId, Dialog, {
   size: "sm",
   title: () => i18n.i18n.t("orderEntry.orderConfirm")
 });
-var MaxQtyConfirm = React3.memo((props) => {
+var MaxQtyConfirm = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   return /* @__PURE__ */ jsxRuntime.jsx(
     ui.SimpleDialog,
@@ -1616,7 +1471,7 @@ var ScaledOrderConfirm = (props) => {
     props.resolve();
     props.close?.();
   };
-  const columns = React3.useMemo(() => {
+  const columns = React2.useMemo(() => {
     return [
       {
         title: t("common.symbol"),
@@ -1760,7 +1615,7 @@ var ScaledOrderConfirm = (props) => {
     ] })
   ] });
 };
-var TooltipIcon = React3.forwardRef(
+var TooltipIcon = React2.forwardRef(
   (props, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "svg",
@@ -1779,13 +1634,13 @@ var TooltipIcon = React3.forwardRef(
 );
 function useAskAndBid() {
   const ee = hooks.useEventEmitter();
-  const [askAndBid, setAskAndBid] = React3.useState([0, 0]);
+  const [askAndBid, setAskAndBid] = React2.useState([0, 0]);
   const onOrderBookUpdate = hooks.useDebouncedCallback((data) => {
     const ask0 = data.asks?.[data.asks.length - 1]?.[0];
     const bid0 = data.bids?.[0]?.[0];
     setAskAndBid([ask0, bid0]);
   }, 200);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     ee.on("orderbook:update", onOrderBookUpdate);
     return () => {
       ee.off("orderbook:update", onOrderBookUpdate);
@@ -1800,13 +1655,13 @@ function useScaledOrderConfirmScript(options2) {
   const { order, symbolInfo } = options2;
   const orders = order.orders;
   const askAndBid = useAskAndBid();
-  const national = React3.useMemo(() => {
+  const national = React2.useMemo(() => {
     const national2 = orders.reduce((acc, order2) => {
       return acc.add(new utils.Decimal(order2.order_price).mul(order2.order_quantity));
     }, utils.zero);
     return national2.toNumber();
   }, [orders]);
-  const totalQuantity = React3.useMemo(() => {
+  const totalQuantity = React2.useMemo(() => {
     const totalQuantity2 = orders.reduce((acc, order2) => {
       return acc.add(new utils.Decimal(order2.order_quantity));
     }, utils.zero);
@@ -1828,7 +1683,7 @@ ui.registerSimpleDialog(scaledOrderConfirmDialogId, ScaledOrderConfirmWidget, {
 });
 var OrderTypeSelect = (props) => {
   const { t } = i18n.useTranslation();
-  const options2 = React3.useMemo(() => {
+  const options2 = React2.useMemo(() => {
     return [
       { label: t("orderEntry.orderType.limitOrder"), value: types.OrderType.LIMIT },
       { label: t("orderEntry.orderType.marketOrder"), value: types.OrderType.MARKET },
@@ -1850,7 +1705,7 @@ var OrderTypeSelect = (props) => {
       }
     ];
   }, [t]);
-  const displayLabelMap = React3.useMemo(() => {
+  const displayLabelMap = React2.useMemo(() => {
     return {
       [types.OrderType.LIMIT]: t("orderEntry.orderType.limit"),
       [types.OrderType.MARKET]: t("common.marketPrice"),
@@ -2004,11 +1859,11 @@ function OrderEntryHeader(props) {
     )
   ] });
 }
-var OrderEntryContext = React3.createContext(
+var OrderEntryContext = React2.createContext(
   {}
 );
 var useOrderEntryContext = () => {
-  return React3.useContext(OrderEntryContext);
+  return React2.useContext(OrderEntryContext);
 };
 var OrderEntryProvider = (props) => {
   const {
@@ -2028,7 +1883,7 @@ var OrderEntryProvider = (props) => {
     lastQuantityInputType,
     leverage
   } = props;
-  const memoizedValue = React3.useMemo(() => {
+  const memoizedValue = React2.useMemo(() => {
     return {
       errorMsgVisible,
       symbolInfo,
@@ -2066,7 +1921,7 @@ var OrderEntryProvider = (props) => {
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(OrderEntryContext.Provider, { value: memoizedValue, children: props.children });
 };
-var CustomInput = React3.forwardRef(
+var CustomInput = React2.forwardRef(
   (props, ref) => {
     const { placeholder = "0" } = props;
     const { errorMsgVisible } = useOrderEntryContext();
@@ -2132,7 +1987,7 @@ var InputLabel = (props) => {
 };
 var BBOOrderTypeSelect = (props) => {
   const { t } = i18n.useTranslation();
-  const options2 = React3.useMemo(
+  const options2 = React2.useMemo(
     () => [
       {
         label: t("orderEntry.bbo.counterparty1"),
@@ -2306,7 +2161,7 @@ var PriceInput = (props) => {
     }
   );
 };
-var QuantityInput = React3.memo((props) => {
+var QuantityInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { symbolInfo, onFocus, onBlur, getErrorMsg, setOrderValue } = useOrderEntryContext();
   const { base, base_dp } = symbolInfo;
@@ -2333,9 +2188,9 @@ var QuantityInput = React3.memo((props) => {
   );
 });
 QuantityInput.displayName = "QuantityInput";
-var TotalTypeSelect = React3.memo((props) => {
+var TotalTypeSelect = React2.memo((props) => {
   const { t } = i18n.useTranslation();
-  const options2 = React3.useMemo(() => {
+  const options2 = React2.useMemo(() => {
     return [
       {
         label: t("orderEntry.orderSize"),
@@ -2368,10 +2223,10 @@ var TotalTypeSelect = React3.memo((props) => {
   );
 });
 TotalTypeSelect.displayName = "TotalTypeSelect";
-var TotalInput = React3.memo((props) => {
+var TotalInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { total } = props;
-  const [margin, setMargin] = React3.useState("");
+  const [margin, setMargin] = React2.useState("");
   const {
     symbolInfo,
     onFocus,
@@ -2386,7 +2241,7 @@ var TotalInput = React3.memo((props) => {
     "orderly_order_total_type",
     "orderSize" /* OrderSize */
   );
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (total) {
       if (currentFocusInput !== 6 /* MARGIN */) {
         const margin2 = new utils.Decimal(total).div(leverage).todp(2).toString();
@@ -2448,14 +2303,14 @@ var TotalInput = React3.memo((props) => {
   );
 });
 TotalInput.displayName = "TotalInput";
-var QtyAndTotalInput = React3.memo((props) => {
+var QtyAndTotalInput = React2.memo((props) => {
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Grid, { cols: 2, className: "oui-group oui-space-x-1", children: [
     /* @__PURE__ */ jsxRuntime.jsx(QuantityInput, { order_quantity: props.order_quantity }),
     /* @__PURE__ */ jsxRuntime.jsx(TotalInput, { total: props.total })
   ] });
 });
 QtyAndTotalInput.displayName = "QtyAndTotalInput";
-var QuantityDistributionInput = React3.memo((props) => {
+var QuantityDistributionInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { setOrderValue } = useOrderEntryContext();
   const showHint = () => {
@@ -2508,8 +2363,8 @@ var QuantityDistributionInput = React3.memo((props) => {
 });
 var QuantityDistributionHint = (props) => {
   const { t } = i18n.useTranslation();
-  const [type, setType] = React3.useState(types.DistributionType.FLAT);
-  React3.useEffect(() => {
+  const [type, setType] = React2.useState(types.DistributionType.FLAT);
+  React2.useEffect(() => {
     setType(
       [
         types.DistributionType.FLAT,
@@ -2518,7 +2373,7 @@ var QuantityDistributionHint = (props) => {
       ].includes(props.value) ? props.value : types.DistributionType.FLAT
     );
   }, [props.value]);
-  const content = React3.useMemo(() => {
+  const content = React2.useMemo(() => {
     return [
       {
         type: types.DistributionType.FLAT,
@@ -2543,7 +2398,7 @@ var QuantityDistributionHint = (props) => {
       }
     ];
   }, []);
-  const currentContent = React3.useMemo(() => {
+  const currentContent = React2.useMemo(() => {
     return content.find((item) => item.type === type);
   }, [content, type]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-text-2xs oui-font-semibold oui-text-base-contrast-54", children: [
@@ -2601,7 +2456,7 @@ var QuantityDistribution = (props) => {
   const onChange = (value2) => (checked) => {
     onValueChange(value2);
   };
-  const distributionTypeMap = React3.useMemo(() => {
+  const distributionTypeMap = React2.useMemo(() => {
     return {
       [types.DistributionType.FLAT]: t("orderEntry.distributionType.flat"),
       [types.DistributionType.ASCENDING]: t(
@@ -2900,7 +2755,7 @@ var PriceChart = () => {
     }
   );
 };
-var ScaledPriceInput = React3.memo((props) => {
+var ScaledPriceInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { symbolInfo, onFocus, onBlur, getErrorMsg, setOrderValue } = useOrderEntryContext();
   const { quote, quote_dp } = symbolInfo;
@@ -2948,7 +2803,7 @@ var valueRenderer = (value) => {
 };
 var ScaledQuantityUnit = (props) => {
   const { base, quote } = props;
-  const options2 = React3.useMemo(() => {
+  const options2 = React2.useMemo(() => {
     return [{ name: quote }, { name: base }];
   }, [base, quote]);
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -2976,7 +2831,7 @@ var ScaledQuantityUnit = (props) => {
     }
   );
 };
-var ScaledQuantityInput = React3.memo((props) => {
+var ScaledQuantityInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { errors, symbolInfo, onFocus, onBlur, getErrorMsg, setOrderValue } = useOrderEntryContext();
   const [quantityUnit, setQuantityUnit] = hooks.useLocalStorage(
@@ -3039,7 +2894,7 @@ var ScaledQuantityInput = React3.memo((props) => {
     }
   );
 });
-var SkewInput = React3.memo((props) => {
+var SkewInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { onFocus, onBlur, getErrorMsg, setOrderValue } = useOrderEntryContext();
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3064,7 +2919,7 @@ var SkewInput = React3.memo((props) => {
     }
   );
 });
-var TotalOrdersInput = React3.memo((props) => {
+var TotalOrdersInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const { onFocus, onBlur, getErrorMsg, setOrderValue } = useOrderEntryContext();
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -3120,7 +2975,7 @@ var ScaledOrderInput = (props) => {
     showSkewInput && /* @__PURE__ */ jsxRuntime.jsx(SkewInput, { skew: values.skew })
   ] });
 };
-var TriggerPriceInput = React3.memo((props) => {
+var TriggerPriceInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const {
     symbolInfo,
@@ -3150,7 +3005,7 @@ var TriggerPriceInput = React3.memo((props) => {
   ) });
 });
 TriggerPriceInput.displayName = "TriggerPriceInput";
-var ActivePriceInput = React3.memo((props) => {
+var ActivePriceInput = React2.memo((props) => {
   const { t } = i18n.useTranslation();
   const {
     symbolInfo,
@@ -3182,7 +3037,7 @@ var ActivePriceInput = React3.memo((props) => {
 });
 ActivePriceInput.displayName = "ActivePriceInput";
 var percentages = [1, 2, 3, 5];
-var CallbackRatePercentages = React3.memo(
+var CallbackRatePercentages = React2.memo(
   (props) => {
     const { setOrderValue } = useOrderEntryContext();
     return /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, { gapX: 2, className: props.className, children: percentages.map((item) => {
@@ -3215,10 +3070,10 @@ var CallbackRatePercentages = React3.memo(
   }
 );
 CallbackRatePercentages.displayName = "CallbackRatePercentages";
-var TrailingCallbackSelect = React3.memo(
+var TrailingCallbackSelect = React2.memo(
   (props) => {
     const { quote } = props;
-    const options2 = React3.useMemo(() => {
+    const options2 = React2.useMemo(() => {
       return [
         { label: quote, value: types.TrailingCallbackType.VALUE },
         { label: "%", value: types.TrailingCallbackType.RATE }
@@ -3250,7 +3105,7 @@ var TrailingCallbackSelect = React3.memo(
   }
 );
 TrailingCallbackSelect.displayName = "trailingCallbackSelect";
-var TrailingCallbackInput = React3.memo(
+var TrailingCallbackInput = React2.memo(
   (props) => {
     const { callback_value, callback_rate } = props;
     const { t } = i18n.useTranslation();
@@ -3263,13 +3118,13 @@ var TrailingCallbackInput = React3.memo(
       setOrderValues
     } = useOrderEntryContext();
     const { quote, quote_dp } = symbolInfo;
-    const lastCallbackValueRef = React3.useRef();
-    const lastCallbackRateRef = React3.useRef();
+    const lastCallbackValueRef = React2.useRef();
+    const lastCallbackRateRef = React2.useRef();
     const [callbackType, setCallbackType] = hooks.useLocalStorage(
       "orderly_order_trailing_callback_type",
       types.TrailingCallbackType.VALUE
     );
-    const onCallbackTypeChange = React3.useCallback(
+    const onCallbackTypeChange = React2.useCallback(
       (type) => {
         setCallbackType(type);
         if (type === types.TrailingCallbackType.RATE) {
@@ -3421,17 +3276,17 @@ function OrderInput(props) {
 }
 var SLIDER_MIN = 0;
 var SLIDER_MAX = 100;
-var QuantitySlider = React3.memo((props) => {
+var QuantitySlider = React2.memo((props) => {
   const { canTrade, side, order_quantity, maxQty } = props;
-  const [sliderValue, setSliderValue] = React3.useState(0);
+  const [sliderValue, setSliderValue] = React2.useState(0);
   const { setOrderValue, symbolInfo, lastQuantityInputType } = useOrderEntryContext();
   const { base_dp, base_tick } = symbolInfo;
   const { t } = i18n.useTranslation();
-  const color = React3.useMemo(
+  const color = React2.useMemo(
     () => canTrade ? side === types.OrderSide.BUY ? "buy" : "sell" : void 0,
     [side, canTrade]
   );
-  const maxLabel = React3.useMemo(() => {
+  const maxLabel = React2.useMemo(() => {
     return side === types.OrderSide.BUY ? t("orderEntry.maxBuy") : t("orderEntry.maxSell");
   }, [side, t]);
   const onSliderValueChange = (value) => {
@@ -3448,12 +3303,12 @@ var QuantitySlider = React3.memo((props) => {
       sliderToQuantity(SLIDER_MAX);
     }
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (lastQuantityInputType.current === 4 /* QUANTITY_SLIDER */) {
       sliderToQuantity(sliderValue);
     }
   }, [sliderValue, maxQty]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     const quantityToSlider = () => {
       if (order_quantity && Number(order_quantity) !== 0 && maxQty !== 0) {
         return new utils.Decimal(Math.min(Number(order_quantity), maxQty)).div(maxQty).mul(SLIDER_MAX).todp(2, utils.Decimal.ROUND_DOWN).toNumber();
@@ -3542,22 +3397,22 @@ var ReduceOnlySwitch = ({
     /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: "reduceOnly", className: "oui-text-xs", children: t("orderEntry.reduceOnly") })
   ] });
 };
-var PnlInputContext = React3.createContext(
+var PnlInputContext = React2.createContext(
   {}
 );
 var usePnlInputContext = () => {
-  return React3.useContext(PnlInputContext);
+  return React2.useContext(PnlInputContext);
 };
 
 // src/components/pnlInput/useBuilder.script.ts
 var usePNLInputBuilder = (props) => {
   const { type, values, quote_dp } = props;
   const { t } = i18n.useTranslation();
-  const [focus, setFocus] = React3.useState(true);
+  const [focus, setFocus] = React2.useState(true);
   const { mode, setMode, tipsEle } = usePnlInputContext();
-  const [tipVisible, setTipVisible] = React3.useState(false);
-  const [isFocused, setIsFocused] = React3.useState(false);
-  const key = React3.useMemo(() => {
+  const [tipVisible, setTipVisible] = React2.useState(false);
+  const [isFocused, setIsFocused] = React2.useState(false);
+  const key = React2.useMemo(() => {
     switch (mode) {
       case "Offset" /* OFFSET */:
         return `${type.toLowerCase()}_offset`;
@@ -3567,16 +3422,16 @@ var usePNLInputBuilder = (props) => {
         return `${type.toLowerCase()}_pnl`;
     }
   }, [mode]);
-  const [innerValue, setInnerValue] = React3.useState(
+  const [innerValue, setInnerValue] = React2.useState(
     values[mode]
   );
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (isFocused) {
       return;
     }
     setInnerValue(values[mode]);
   }, [values, mode, isFocused]);
-  const modes = React3.useMemo(() => {
+  const modes = React2.useMemo(() => {
     return [
       {
         label: t("tpsl.pnl"),
@@ -3595,14 +3450,14 @@ var usePNLInputBuilder = (props) => {
       }
     ];
   }, [t]);
-  const modeLabelMap = React3.useMemo(() => {
+  const modeLabelMap = React2.useMemo(() => {
     return {
       ["PnL" /* PnL */]: t("tpsl.pnl"),
       ["Offset" /* OFFSET */]: t("tpsl.offset"),
       ["Offset%" /* PERCENTAGE */]: `${t("tpsl.offset")}%`
     };
   }, [t]);
-  const percentageSuffix = React3.useRef("");
+  const percentageSuffix = React2.useRef("");
   const onValueChange = (value) => {
     setInnerValue(value);
     props.onChange(key, value);
@@ -3698,18 +3553,18 @@ var PNLInput = (props) => {
     onBlur,
     setFocus
   } = props;
-  const [prefix, setPrefix] = React3.useState(mode);
-  const [placeholder, setPlaceholder] = React3.useState(
+  const [prefix, setPrefix] = React2.useState(mode);
+  const [placeholder, setPlaceholder] = React2.useState(
     mode === "Offset%" /* PERCENTAGE */ ? "%" : quote
   );
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     setPrefix(mode);
     setPlaceholder(mode === "Offset%" /* PERCENTAGE */ ? "%" : quote);
   }, [mode]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     setPrefix(!!value ? "" : mode);
   }, [value]);
-  const id = React3.useMemo(() => `${type.toLowerCase()}_${mode.toLowerCase()}`, []);
+  const id = React2.useMemo(() => `${type.toLowerCase()}_${mode.toLowerCase()}`, []);
   return /* @__PURE__ */ jsxRuntime.jsx(
     ui.Input.tooltip,
     {
@@ -3791,7 +3646,7 @@ var PnlInputProvider = (props) => {
     "Offset%" /* PERCENTAGE */
   );
   const { t } = i18n.useTranslation();
-  const tipsEle = React3.useMemo(() => {
+  const tipsEle = React2.useMemo(() => {
     if (!values.PnL || !values.trigger_price) {
       return null;
     }
@@ -3820,16 +3675,16 @@ var PnlInputProvider = (props) => {
       )
     ] });
   }, [mode, values.ROI, values.PnL, values.trigger_price]);
-  const memoizedValue = React3.useMemo(() => {
+  const memoizedValue = React2.useMemo(() => {
     return { mode, setMode, tipsEle };
   }, [mode, setMode, tipsEle]);
   return /* @__PURE__ */ jsxRuntime.jsx(PnlInputContext.Provider, { value: memoizedValue, children });
 };
 var OrderTPSL = (props) => {
-  const tpslFormRef = React3__default.default.useRef(null);
+  const tpslFormRef = React2__default.default.useRef(null);
   const { t } = i18n.useTranslation();
   const { isMobile } = ui.useScreen();
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (props.orderType !== types.OrderType.LIMIT && props.orderType !== types.OrderType.MARKET) {
       props.onSwitchChanged(false);
     }
@@ -3918,7 +3773,7 @@ var TPSLPriceWarning = (props) => {
     }
   );
 };
-var TPSLInputForm = React3__default.default.forwardRef((props, ref) => {
+var TPSLInputForm = React2__default.default.forwardRef((props, ref) => {
   const { getErrorMsg } = reactApp.useOrderEntryFormErrorMsg(props.errors);
   const { t } = i18n.useTranslation();
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4019,20 +3874,20 @@ var TPSLTriggerPriceInput = (props) => {
   const { t } = i18n.useTranslation();
   const { errorMsgVisible } = useOrderEntryContext();
   const { tipsEle } = usePnlInputContext();
-  const [prefix, setPrefix] = React3.useState(`${props.type} Price`);
-  const [placeholder, setPlaceholder] = React3.useState("USDC");
-  const [tipVisible, setTipVisible] = React3.useState(false);
-  const [isFocused, setIsFocused] = React3.useState(false);
-  const [innerValue, setInnerValue] = React3.useState(
+  const [prefix, setPrefix] = React2.useState(`${props.type} Price`);
+  const [placeholder, setPlaceholder] = React2.useState("USDC");
+  const [tipVisible, setTipVisible] = React2.useState(false);
+  const [isFocused, setIsFocused] = React2.useState(false);
+  const [innerValue, setInnerValue] = React2.useState(
     props.values.trigger_price ?? ""
   );
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (isFocused) {
       return;
     }
     setInnerValue(props.values.trigger_price ?? "");
   }, [props.values.trigger_price, isFocused]);
-  const triggerPriceToolTipEle = React3.useMemo(() => {
+  const triggerPriceToolTipEle = React2.useMemo(() => {
     if (props.error && (errorMsgVisible || props.displayErrorMessage))
       return props.error;
     if (tipVisible) return tipsEle;
@@ -4055,7 +3910,7 @@ var TPSLTriggerPriceInput = (props) => {
     setInnerValue(value);
     props.onChange(value);
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     setPrefix(getPrefixLabel(props.values.trigger_price));
     if (!isFocused) {
       setInnerValue(props.values.trigger_price ?? "");
@@ -4175,12 +4030,12 @@ var OrderEntry = (props) => {
     setSoundAlert,
     currentFocusInput
   } = props;
-  const [maxQtyConfirmOpen, setMaxQtyConfirmOpen] = React3.useState(false);
+  const [maxQtyConfirmOpen, setMaxQtyConfirmOpen] = React2.useState(false);
   const { t } = i18n.useTranslation();
   const { isMobile } = ui.useScreen();
-  const [hasAdvancedTPSLResult, setHasAdvancedTPSLResult] = React3.useState(false);
+  const [hasAdvancedTPSLResult, setHasAdvancedTPSLResult] = React2.useState(false);
   const { errors, validated } = metaState;
-  const [errorMsgVisible, setErrorMsgVisible] = React3.useState(false);
+  const [errorMsgVisible, setErrorMsgVisible] = React2.useState(false);
   const [needConfirm, setNeedConfirm] = hooks.useLocalStorage(
     "orderly_order_confirm",
     true
@@ -4189,7 +4044,7 @@ var OrderEntry = (props) => {
     "orderly-order-additional-pinned",
     true
   );
-  const [showTPSLAdvanced, setShowTPSLAdvanced] = React3.useState(false);
+  const [showTPSLAdvanced, setShowTPSLAdvanced] = React2.useState(false);
   const [hidden, setHidden] = hooks.useLocalStorage("orderly-order-hidden", false);
   const [slippage, setSlippage] = hooks.useLocalStorage("orderly-slippage", "1", {
     parseJSON: ((value) => {
@@ -4197,17 +4052,17 @@ var OrderEntry = (props) => {
     })
   });
   const { notification } = hooks.useOrderlyContext();
-  const soundAlertId = React3.useId();
+  const soundAlertId = React2.useId();
   const { getErrorMsg } = reactApp.useOrderEntryFormErrorMsg(validated ? errors : null);
-  const buttonLabel = React3.useMemo(() => {
+  const buttonLabel = React2.useMemo(() => {
     return side === types.OrderSide.BUY ? t("orderEntry.buyLong") : t("orderEntry.sellShort");
   }, [side, t, isMobile]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (validated) {
       setErrorMsgVisible(true);
     }
   }, [validated]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (disableFeatures?.includes("slippageSetting")) {
       return;
     }
@@ -4217,7 +4072,7 @@ var OrderEntry = (props) => {
       setOrderValue("slippage", void 0);
     }
   }, [slippage, disableFeatures]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     const clickHandler = (event) => {
       const target = event.target;
       if (target.closest("#order-entry-submit-button")) {
@@ -4286,10 +4141,10 @@ var OrderEntry = (props) => {
       }
     });
   });
-  const formattedMaxQty = React3.useMemo(() => {
+  const formattedMaxQty = React2.useMemo(() => {
     return new utils.Decimal(maxQty).todp(symbolInfo.base_dp, utils.Decimal.ROUND_DOWN).toString();
   }, [maxQty, symbolInfo.base_dp]);
-  const onMaxQtyConfirm = React3.useCallback(() => {
+  const onMaxQtyConfirm = React2.useCallback(() => {
     setOrderValue("order_quantity", formattedMaxQty);
     requestAnimationFrame(() => {
       onSubmit();
@@ -4371,7 +4226,7 @@ var OrderEntry = (props) => {
       position_type: types.PositionType.FULL
     });
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     setHasAdvancedTPSLResult(false);
   }, [props.symbol]);
   const showReduceOnlySection = isMobile && formattedOrder.order_type !== types.OrderType.LIMIT && formattedOrder.order_type !== types.OrderType.MARKET || !isMobile;
@@ -4634,9 +4489,9 @@ function useBBOState({
   setOrderValues
 }) {
   const [localBBOType, setLocalBBOType] = hooks.useLocalStorage("orderly_order_bbo_type", void 0);
-  const lastBBOType = React3.useRef(localBBOType);
+  const lastBBOType = React2.useRef(localBBOType);
   const { track } = hooks.useTrack();
-  const bboStatus = React3.useMemo(() => {
+  const bboStatus = React2.useMemo(() => {
     if (tpslSwitch || [types.OrderType.POST_ONLY, types.OrderType.IOC, types.OrderType.FOK].includes(
       order_type_ext
     )) {
@@ -4660,7 +4515,7 @@ function useBBOState({
     setLocalBBOType(value);
     lastBBOType.current = value;
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (bboStatus === "disabled" /* DISABLED */) {
       setOrderValues({
         // if order_type_ext is not bbo(ask, bid), keep previous value
@@ -4669,7 +4524,7 @@ function useBBOState({
       });
     }
   }, [bboStatus, order_type_ext]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (bboStatus === "on" /* ON */) {
       const orderType = getOrderTypeByBBO(localBBOType, side);
       const orderLevel = getOrderLevelByBBO(localBBOType);
@@ -4689,9 +4544,9 @@ function useBBOState({
 }
 function useFocusAndBlur(props) {
   const { base_tick, order_type, order_quantity, setValue } = props;
-  const currentFocusInput = React3.useRef(0 /* NONE */);
-  const lastScaledOrderPriceInput = React3.useRef(8 /* END_PRICE */);
-  const lastQuantityInputType = React3.useRef(0 /* NONE */);
+  const currentFocusInput = React2.useRef(0 /* NONE */);
+  const lastScaledOrderPriceInput = React2.useRef(8 /* END_PRICE */);
+  const lastQuantityInputType = React2.useRef(0 /* NONE */);
   const formatQty = () => {
     if (base_tick < 1 || // scaled order should not format quantity, because it is total quantity
     order_type === types.OrderType.SCALED || !order_quantity) {
@@ -4738,9 +4593,9 @@ function useFocusAndBlur(props) {
 function usePriceInputContainer({
   order_type_ext
 }) {
-  const [priceInputContainerWidth, setPriceInputContainerWidth] = React3.useState(0);
-  const priceInputContainerRef = React3.useRef(null);
-  React3.useEffect(() => {
+  const [priceInputContainerWidth, setPriceInputContainerWidth] = React2.useState(0);
+  const priceInputContainerRef = React2.useRef(null);
+  React2.useEffect(() => {
     const element = priceInputContainerRef.current;
     if (!element) {
       return;
@@ -4799,9 +4654,9 @@ var useOrderEntryScript = (inputs) => {
   );
   const { currentLeverage } = hooks.useMarginRatio();
   const ee = hooks.useEventEmitter();
-  const triggerPriceInputRef = React3.useRef(null);
-  const priceInputRef = React3.useRef(null);
-  const activatedPriceInputRef = React3.useRef(null);
+  const triggerPriceInputRef = React2.useRef(null);
+  const priceInputRef = React2.useRef(null);
+  const activatedPriceInputRef = React2.useRef(null);
   const { bboStatus, bboType, setBBOType, onBBOChange, toggleBBO } = useBBOState({
     tpslSwitch,
     order_type: formattedOrder.order_type,
@@ -4881,7 +4736,7 @@ var useOrderEntryScript = (inputs) => {
       cancelTP_SL();
     }
   };
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     const updateOrderPrice = (price) => {
       setValue("order_price", price);
     };
@@ -4890,7 +4745,7 @@ var useOrderEntryScript = (inputs) => {
       ee.off("update:orderPrice", updateOrderPrice);
     };
   }, []);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     const focusInputElement = (target) => {
       requestAnimationFrame(() => {
         target?.focus();
@@ -4954,12 +4809,12 @@ var useOrderEntryScript = (inputs) => {
       ee.off("orderbook:item:click", orderBookItemClickHandler);
     };
   }, [formattedOrder, symbolInfo]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     state.reset();
     state.resetMetaState();
     lastQuantityInputType.current = 0 /* NONE */;
   }, [symbol]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (formattedOrder.order_type === types.OrderType.SCALED && !formattedOrder.distribution_type) {
       setValue("distribution_type", types.DistributionType.FLAT);
     }
@@ -4988,12 +4843,12 @@ var useOrderEntryScript = (inputs) => {
     currentPosition: state.currentPosition,
     orderQuantity: Number(formattedOrder.order_quantity)
   });
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (formattedOrder.reduce_only) {
       setTpslSwitch(false);
     }
   }, [formattedOrder.reduce_only]);
-  React3.useEffect(() => {
+  React2.useEffect(() => {
     if (tpslSwitch) {
       setOrderValue("reduce_only", false);
     }