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

package/dist/index.mjs

@@ -1,14 +1,13 @@
-import React3, { useId, forwardRef, useState, useImperativeHandle, useEffect, memo, createContext, useMemo, useRef, useCallback, useContext } from 'react';
+import React2, { forwardRef, useState, useImperativeHandle, useEffect, memo, createContext, useMemo, useRef, useCallback, useContext, useId } from 'react';
 import { useLocalStorage, utils, usePositionStream, useEventEmitter, useDebouncedCallback, useFeeState, useRwaSymbolsInfoStore, useOrderlyContext, useMemoizedFn, ERROR_MSG_CODES, useOrderEntry, useMarginRatio, useComputedLTV, useTpslPriceChecker, useHoldingStream, useAppStore, useIndexPricesStream, useGetEstLiqPrice, useTrack, useQuery, useSymbolLeverage, useBoolean } from '@orderly.network/hooks';
 import { useTranslation, i18n } from '@orderly.network/i18n';
 import { useOrderEntryFormErrorMsg, useCanTrade } from '@orderly.network/react-app';
 import { EMPTY_LIST, DistributionType, TrailingCallbackType, OrderSide, OrderType, PositionType, BBOOrderType, OrderLevel, TrackerEventName } from '@orderly.network/types';
-import { ExclamationFillIcon, modal, Text, Tooltip, TooltipTrigger, Flex, Input, cn, inputFormatter, Box, registerSimpleDialog, SimpleDialog, Select, Grid, Checkbox, Slider, textVariants, SettingFillIcon, Badge, Divider, Button, TokenIcon, DataTable, SimpleDropdownMenu, CaretDownIcon, Switch, useScreen, toast, ThrottledButton, SimpleSheet, InfoCircleIcon, AddCircleIcon, PopoverRoot, PopoverTrigger, PopoverContent, DotStatus, EditIcon as EditIcon$1, useModal } from '@orderly.network/ui';
+import { ExclamationFillIcon, modal, Text, Tooltip, TooltipTrigger, Flex, Input, cn, inputFormatter, Box, registerSimpleDialog, SimpleDialog, Select, Grid, Checkbox, Slider, textVariants, SettingFillIcon, Badge, Divider, Button, TokenIcon, DataTable, SimpleDropdownMenu, CaretDownIcon, Switch, useScreen, toast, ThrottledButton, SimpleSheet, InfoCircleIcon, AddCircleIcon, PopoverRoot, PopoverTrigger, PopoverContent, DotStatus, EditIcon as EditIcon$1 } from '@orderly.network/ui';
 import { TPSLPositionTypeWidget, TPSLAdvancedWidget } from '@orderly.network/ui-tpsl';
 import { Decimal, zero, todpIfNeed, getBBOType, removeTrailingZeros } from '@orderly.network/utils';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { AuthGuard } from '@orderly.network/ui-connector';
-import { useScaffoldContext } from '@orderly.network/ui-scaffold';
 import { account } from '@orderly.network/perp';
 import { SymbolLeverageSheetId, SymbolLeverageDialogId } from '@orderly.network/ui-leverage';
 
@@ -503,142 +502,6 @@ var EditIcon = (props) => {
     }
   );
 };
-var EffectiveFee = React3.forwardRef((props, ref) => {
-  const linearId = useId();
-  return /* @__PURE__ */ 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__ */ 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__ */ jsx("defs", { children: /* @__PURE__ */ jsxs(
-          "linearGradient",
-          {
-            id: linearId,
-            x1: "12.7908",
-            y1: "6.99084",
-            x2: "1.1875",
-            y2: "6.99084",
-            gradientUnits: "userSpaceOnUse",
-            children: [
-              /* @__PURE__ */ jsx("stop", { stopColor: "rgb(var(--oui-gradient-brand-end))" }),
-              /* @__PURE__ */ 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 } = useTranslation();
-  return /* @__PURE__ */ jsxs(Text, { size: "2xs", className: "oui-whitespace-normal oui-break-words", children: [
-    t("portfolio.feeTier.effectiveFee.tooltip"),
-    " ",
-    /* @__PURE__ */ 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 } = useModal();
-  return /* @__PURE__ */ jsx(EffectiveFeeBody, { routerAdapter, onClose: hide });
-};
-var EffectiveFeeSection = (props) => {
-  const { routerAdapter } = props;
-  const { isMobile } = useScreen();
-  const { t } = useTranslation();
-  if (isMobile) {
-    return /* @__PURE__ */ jsx(
-      EffectiveFee,
-      {
-        onClick: () => {
-          modal.dialog({
-            size: "sm",
-            title: t("common.tips"),
-            content: /* @__PURE__ */ jsx(EffectiveFeeMobileContent, { routerAdapter })
-          });
-        }
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx(
-    Tooltip,
-    {
-      content: /* @__PURE__ */ jsx(EffectiveFeeBody, { routerAdapter }),
-      className: "oui-p-1.5 oui-text-base-contrast-54",
-      children: /* @__PURE__ */ jsx(EffectiveFee, { className: "oui-cursor-pointer" })
-    }
-  );
-};
-var EffectiveFeeUI = (props) => {
-  const { t } = useTranslation();
-  const { routerAdapter } = useScaffoldContext();
-  const { taker, maker } = props;
-  const originalTrailingFees = /* @__PURE__ */ jsxs(Flex, { itemAlign: "center", justify: "between", width: "100%", gap: 1, children: [
-    /* @__PURE__ */ jsxs(Flex, { width: "100%", itemAlign: "center", justify: "between", children: [
-      /* @__PURE__ */ jsx(Text, { className: "oui-truncate", size: "2xs", children: t("common.fees") }),
-      /* @__PURE__ */ jsx(
-        AuthGuard,
-        {
-          fallback: () => /* @__PURE__ */ jsxs(Text, { className: "oui-truncate", size: "2xs", children: [
-            t("dmm.taker"),
-            ": --% / ",
-            t("dmm.maker"),
-            ": --%"
-          ] }),
-          children: /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
-            /* @__PURE__ */ jsxs(Text, { className: "oui-truncate", size: "2xs", children: [
-              t("dmm.taker"),
-              ":"
-            ] }),
-            /* @__PURE__ */ jsx(Text, { size: "2xs", className: "oui-text-base-contrast-80", children: taker }),
-            /* @__PURE__ */ jsx(Text, { size: "2xs", children: "/" }),
-            /* @__PURE__ */ jsxs(Text, { className: "oui-truncate", size: "2xs", children: [
-              t("dmm.maker"),
-              ":"
-            ] }),
-            /* @__PURE__ */ jsx(Text, { size: "2xs", className: "oui-text-base-contrast-80", children: maker })
-          ] })
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsx(EffectiveFeeSection, { routerAdapter })
-  ] });
-  return originalTrailingFees;
-};
-var EffectiveFeesWidget = (props) => {
-  return /* @__PURE__ */ jsx(EffectiveFeeUI, { ...props });
-};
 var RegularFeesUI = (props) => {
   const { t } = useTranslation();
   const { taker, maker } = props;
@@ -674,23 +537,15 @@ var RegularFeesUI = (props) => {
 var RegularFeesWidget = (props) => {
   return /* @__PURE__ */ jsx(RegularFeesUI, { ...props });
 };
-var isEffective = (val) => typeof val !== "undefined" && val !== null;
 var FeesWidget = ({ symbol }) => {
-  const { refereeRebate, ...others } = useFeeState();
+  const { takerFee, makerFee, rwaTakerFee, rwaMakerFee } = useFeeState();
   const info = useRwaSymbolsInfoStore();
   const isRwa = info?.[symbol] !== void 0;
-  const isEffectiveFee = isEffective(refereeRebate);
-  return isEffectiveFee ? /* @__PURE__ */ jsx(
-    EffectiveFeesWidget,
-    {
-      taker: isRwa ? others.rwaEffectiveTakerFee : others.effectiveTakerFee,
-      maker: isRwa ? others.rwaEffectiveMakerFee : others.effectiveMakerFee
-    }
-  ) : /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(
     RegularFeesWidget,
     {
-      taker: isRwa ? others.rwaTakerFee : others.takerFee,
-      maker: isRwa ? others.rwaMakerFee : others.makerFee
+      taker: isRwa ? rwaTakerFee : takerFee,
+      maker: isRwa ? rwaMakerFee : makerFee
     }
   );
 };
@@ -3820,7 +3675,7 @@ var PnlInputProvider = (props) => {
   return /* @__PURE__ */ jsx(PnlInputContext.Provider, { value: memoizedValue, children });
 };
 var OrderTPSL = (props) => {
-  const tpslFormRef = React3.useRef(null);
+  const tpslFormRef = React2.useRef(null);
   const { t } = useTranslation();
   const { isMobile } = useScreen();
   useEffect(() => {
@@ -3912,7 +3767,7 @@ var TPSLPriceWarning = (props) => {
     }
   );
 };
-var TPSLInputForm = React3.forwardRef((props, ref) => {
+var TPSLInputForm = React2.forwardRef((props, ref) => {
   const { getErrorMsg } = useOrderEntryFormErrorMsg(props.errors);
   const { t } = useTranslation();
   return /* @__PURE__ */ jsxs(