@orderly.network/ui-order-entry 2.11.3-rc.0 → 2.12.0

package/dist/index.mjs

@@ -1,9 +1,9 @@
 import React3, { forwardRef, useState, useImperativeHandle, useEffect, memo, createContext, useMemo, useRef, useCallback, useContext, useId } from 'react';
-import { useLocalStorage, utils, usePositionStream, useMarkets, MarketsType, useMarginModes, useMarginModeBySymbol, useEventEmitter, useDebouncedCallback, useFeeState, useRwaSymbolsInfoStore, useOrderlyContext, useMemoizedFn, ERROR_MSG_CODES, useOrderEntry, useMarginRatio, useComputedLTV, useTpslPriceChecker, useHoldingStream, useAppStore, useIndexPricesStream, useGetEstLiqPrice, useTrack, useQuery, useFeatureFlag, FlagKeys, useBoolean } from '@orderly.network/hooks';
+import { useLocalStorage, utils, usePositionStream, useMarkets, MarketsType, useMarginModes, useMarginModeBySymbol, useBadgeBySymbol, useEventEmitter, useDebouncedCallback, useFeeState, useRwaSymbolsInfoStore, useOrderlyContext, useMemoizedFn, ERROR_MSG_CODES, useAccount, useOrderEntry, useMarginRatio, useComputedLTV, useTpslPriceChecker, useHoldingStream, useAppStore, useIndexPricesStream, useGetEstLiqPrice, useTrack, useQuery, useFeatureFlag, FlagKeys, 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, MarginMode, PositionType, BBOOrderType, ORDER_ENTRY_EST_LIQ_PRICE_CHANGE, OrderLevel, TrackerEventName } from '@orderly.network/types';
-import { ExclamationFillIcon, modal, Text, Tooltip, TooltipTrigger, Flex, Input, cn, inputFormatter, Box, registerSimpleDialog, SimpleDialog, registerSimpleSheet, Select, Grid, Checkbox, Slider, textVariants, SettingFillIcon, useModal, Badge, Divider, Button, TokenIcon, DataTable, useScreen, toast, IconButton, CloseIcon, CloseCircleFillIcon, ChevronRightIcon, SimpleDropdownMenu, CaretDownIcon, Switch, ThrottledButton, SimpleSheet, InfoCircleIcon, AddCircleIcon, PopoverRoot, PopoverTrigger, PopoverContent, DotStatus, EditIcon as EditIcon$1 } from '@orderly.network/ui';
+import { ExclamationFillIcon, modal, Text, Tooltip, TooltipTrigger, Flex, Input, cn, inputFormatter, Box, registerSimpleDialog, SimpleDialog, registerSimpleSheet, Select, Grid, Checkbox, Slider, textVariants, SettingFillIcon, useModal, Badge, Divider, Button, TokenIcon, DataTable, useScreen, toast, IconButton, CloseIcon, CloseCircleFillIcon, ChevronRightIcon, SymbolBadge as SymbolBadge$1, SimpleDropdownMenu, CaretDownIcon, Switch, 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, formatSymbol, todpIfNeed, getBBOType, removeTrailingZeros } from '@orderly.network/utils';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -1149,6 +1149,13 @@ function getScaledPlaceOrderMessage(result) {
 var safeNumber = (val) => {
   return Number.isNaN(Number(val)) ? 0 : Number(val);
 };
+var SymbolBadge = (props) => {
+  const { brokerId, brokerName, brokerNameRaw } = useBadgeBySymbol(
+    props.symbol
+  );
+  const badge = brokerName ?? brokerId ?? void 0;
+  return /* @__PURE__ */ jsx(SymbolBadge$1, { badge, fullName: brokerNameRaw });
+};
 var OrderConfirmDialog = (props) => {
   const { symbolInfo, order, onConfirm, onCancel } = props;
   const { quote, quote_dp, base_dp } = symbolInfo;
@@ -1306,15 +1313,19 @@ var OrderConfirmDialog = (props) => {
       justify: "between",
       className: "oui-orderEntry-orderConfirmDialog-header",
       children: [
-        /* @__PURE__ */ jsx(
-          Text.formatted,
-          {
-            rule: "symbol",
-            showIcon: true,
-            className: "oui-orderConfirmDialog-symbol",
-            children: order.symbol
-          }
-        ),
+        /* @__PURE__ */ jsxs(Flex, { gap: 2, direction: "column", itemAlign: "start", children: [
+          /* @__PURE__ */ jsx(
+            Text.formatted,
+            {
+              rule: "symbol",
+              formatString: "base",
+              showIcon: true,
+              className: "oui-orderConfirmDialog-symbol",
+              children: order.symbol
+            }
+          ),
+          /* @__PURE__ */ jsx(SymbolBadge, { symbol: order.symbol })
+        ] }),
         /* @__PURE__ */ jsxs(
           Flex,
           {
@@ -1613,6 +1624,136 @@ var MaxQtyConfirm = memo((props) => {
     }
   );
 });
+var PermissionlessMarketNoticeDialog = (props) => {
+  const { onConfirm, onCancel } = props;
+  const { t } = useTranslation();
+  const [checked, setChecked] = useState(false);
+  const content = /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      direction: "column",
+      gap: 3,
+      itemAlign: "start",
+      className: "oui-permissionlessNotice-content",
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: textVariants({
+              size: "sm",
+              intensity: 54
+            }),
+            children: t("orderEntry.permissionlessNotice.content1")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: textVariants({
+              size: "sm",
+              intensity: 54
+            }),
+            children: t("orderEntry.permissionlessNotice.content2")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            className: textVariants({
+              size: "sm",
+              intensity: 54
+            }),
+            children: t("orderEntry.permissionlessNotice.content3")
+          }
+        )
+      ]
+    }
+  );
+  const checkboxSection = /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      gapX: 1,
+      pt: 4,
+      pb: 5,
+      itemAlign: "start",
+      className: "oui-permissionlessNotice-checkbox oui-orderEntry-orderConfirmDialog-disableConfirm oui-cursor-pointer",
+      children: [
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            id: "permissionlessNotice",
+            color: "white",
+            className: "oui-permissionlessNotice-checkbox-input oui-mt-1",
+            checked,
+            onCheckedChange: (value) => setChecked(!!value)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "label",
+          {
+            htmlFor: "permissionlessNotice",
+            className: textVariants({
+              size: "xs",
+              intensity: 54,
+              className: "oui-cursor-pointer"
+            }),
+            children: t("orderEntry.permissionlessNotice.checkbox")
+          }
+        )
+      ]
+    }
+  );
+  const confirmButton = /* @__PURE__ */ jsx(
+    Flex,
+    {
+      className: "oui-permissionlessNotice-confirm-button oui-w-full",
+      justify: "center",
+      children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          fullWidth: true,
+          size: "md",
+          className: "oui-permissionlessNotice-confirm oui-confirm-btn oui-max-w-[244px]",
+          disabled: !checked,
+          onClick: () => onConfirm(),
+          children: t("common.confirm")
+        }
+      )
+    }
+  );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    content,
+    checkboxSection,
+    confirmButton
+  ] });
+};
+PermissionlessMarketNoticeDialog.displayName = "PermissionlessMarketNoticeDialog";
+var Dialog2 = (props) => {
+  const { close, resolve, reject } = props;
+  return /* @__PURE__ */ jsx(
+    PermissionlessMarketNoticeDialog,
+    {
+      onCancel: () => {
+        reject();
+        close();
+      },
+      onConfirm: () => {
+        resolve();
+        close();
+      }
+    }
+  );
+};
+var permissionlessMarketNoticeDialogId = "permissionlessMarketNotice";
+var permissionlessMarketNoticeDesktopDialogId = "permissionlessMarketNoticeDesktop";
+registerSimpleDialog(permissionlessMarketNoticeDialogId, Dialog2, {
+  size: "sm",
+  title: () => i18n.t("orderEntry.permissionlessNotice.title")
+});
+registerSimpleDialog(permissionlessMarketNoticeDesktopDialogId, Dialog2, {
+  size: "xl",
+  title: () => i18n.t("orderEntry.permissionlessNotice.title")
+});
 var ScaledOrderConfirm = (props) => {
   const { order, symbolInfo, dataSource, national, askAndBid, totalQuantity } = props;
   const { base, quote, base_dp, quote_dp } = symbolInfo;
@@ -1637,7 +1778,7 @@ var ScaledOrderConfirm = (props) => {
               "div",
               {
                 className: cn(
-                  "oui-h-[38px] oui-w-1 oui-shrink-0 oui-rounded-[1px]",
+                  "oui-h-[42px] oui-w-1 oui-shrink-0 oui-rounded-[1px]",
                   record.side === OrderSide.BUY ? "oui-bg-trade-profit" : "oui-bg-trade-loss"
                 )
               }
@@ -1645,17 +1786,12 @@ var ScaledOrderConfirm = (props) => {
             /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "start", children: [
               /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
                 /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-3" }),
-                /* @__PURE__ */ jsx(
-                  Text.formatted,
-                  {
-                    rule: "symbol",
-                    size: "xs",
-                    formatString: "base-type",
-                    children: value
-                  }
-                )
+                /* @__PURE__ */ jsx(Text.formatted, { rule: "symbol", size: "xs", formatString: "base", children: value })
               ] }),
-              /* @__PURE__ */ jsx(Badge, { color: "neutral", size: "xs", children: t("orderEntry.orderType.limit") })
+              /* @__PURE__ */ jsxs(Flex, { gap: 1, children: [
+                /* @__PURE__ */ jsx(SymbolBadge, { symbol: value }),
+                /* @__PURE__ */ jsx(Badge, { color: "neutral", size: "xs", children: t("orderEntry.orderType.limit") })
+              ] })
             ] })
           ] });
         }
@@ -1856,6 +1992,7 @@ registerSimpleDialog(scaledOrderConfirmDialogId, ScaledOrderConfirmWidget, {
 var OrderTypeSelect = (props) => {
   const { t } = useTranslation();
   const { isMobile } = useScreen();
+  const { marketOrderDisabled = false, marketOrderDisabledTooltip } = props;
   const allOptions = useMemo(() => {
     return [
       { label: t("orderEntry.orderType.limitOrder"), value: OrderType.LIMIT },
@@ -1936,7 +2073,24 @@ var OrderTypeSelect = (props) => {
               children: /* @__PURE__ */ jsx(Text, { size: "xs", children: t("orderEntry.orderType.limit") })
             }
           ),
-          /* @__PURE__ */ jsx(
+          marketOrderDisabled && marketOrderDisabledTooltip ? /* @__PURE__ */ jsx(
+            Tooltip,
+            {
+              content: marketOrderDisabledTooltip,
+              className: "oui-max-w-[275px]",
+              children: /* @__PURE__ */ jsx("span", { className: "oui-inline-flex oui-flex-1", children: /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  className: unselectedButtonClassName,
+                  "aria-pressed": false,
+                  disabled: true,
+                  "data-testid": "oui-testid-orderEntry-orderType-market",
+                  children: /* @__PURE__ */ jsx(Text, { size: "xs", children: t("orderEntry.orderType.market") })
+                }
+              ) })
+            }
+          ) : /* @__PURE__ */ jsx(
             "button",
             {
               type: "button",
@@ -1986,14 +2140,25 @@ var OrderTypeSelect = (props) => {
       }
     );
   }
+  const mobileOptions = useMemo(() => allOptions, [allOptions]);
+  const handleMobileValueChange = (value) => {
+    if (marketOrderDisabled && value === OrderType.MARKET && marketOrderDisabledTooltip) {
+      modal.alert({
+        title: t("common.tips"),
+        message: marketOrderDisabledTooltip
+      });
+      return;
+    }
+    props.onChange(value);
+  };
   return /* @__PURE__ */ jsx(
     Select.options,
     {
       testid: "oui-testid-orderEntry-orderType-button",
       currentValue: props.type,
       value: props.type,
-      options: allOptions,
-      onValueChange: props.onChange,
+      options: mobileOptions,
+      onValueChange: handleMobileValueChange,
       contentProps: {
         className: cn(
           "oui-orderEntry-orderTypeSelect-content",
@@ -2096,10 +2261,11 @@ var MarginModeSwitch = (props) => {
                   {
                     className: "oui-tracking-[0.03em]",
                     rule: "symbol",
-                    formatString: "base-type",
+                    formatString: "base",
                     size: "base",
                     weight: "semibold",
                     intensity: 98,
+                    suffix: /* @__PURE__ */ jsx(SymbolBadge, { symbol: props.symbol }),
                     children: props.symbol
                   }
                 )
@@ -2111,7 +2277,8 @@ var MarginModeSwitch = (props) => {
                     mode: MarginMode.CROSS,
                     selected: props.selectedMarginMode === MarginMode.CROSS,
                     isCurrent: props.currentMarginMode === MarginMode.CROSS,
-                    onClick: () => handleSelect(MarginMode.CROSS)
+                    onClick: () => handleSelect(MarginMode.CROSS),
+                    disabled: props.isPermissionlessListing
                   }
                 ),
                 /* @__PURE__ */ jsx(
@@ -2174,9 +2341,11 @@ var OptionCard = (props) => {
         "oui-relative oui-w-full oui-rounded-md oui-p-2",
         "oui-bg-base-6",
         "oui-text-left",
-        props.selected ? "oui-border oui-border-[#38e2fe]" : "oui-border oui-border-transparent hover:oui-border-line-12"
+        props.disabled ? "oui-cursor-not-allowed oui-opacity-50 oui-border oui-border-transparent" : props.selected ? "oui-border oui-border-[#38e2fe]" : "oui-border oui-border-transparent hover:oui-border-line-12"
       ),
-      onClick: props.onClick,
+      onClick: props.disabled ? void 0 : props.onClick,
+      disabled: props.disabled,
+      "aria-disabled": props.disabled,
       "data-testid": `oui-testid-marginModeSwitch-option-${props.mode}`,
       children: [
         /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 2, itemAlign: "start", className: "oui-w-full", children: [
@@ -2209,7 +2378,11 @@ var useMarginModeSwitchScript = (options2) => {
   const { symbol, close } = options2;
   const { isMobile } = useScreen();
   const { t } = useTranslation();
-  const { marginMode: currentMarginMode, update } = useMarginModeBySymbol(symbol);
+  const {
+    marginMode: currentMarginMode,
+    update,
+    isPermissionlessListing
+  } = useMarginModeBySymbol(symbol);
   const [selectedMarginMode, setSelectedMarginMode] = useState(currentMarginMode);
   useEffect(() => {
     setSelectedMarginMode(currentMarginMode);
@@ -2247,11 +2420,13 @@ var useMarginModeSwitchScript = (options2) => {
     setSelectedMarginMode,
     applyMarginMode,
     close,
-    onSelect
+    onSelect,
+    isPermissionlessListing
   };
 };
 var useMarginModeSettingsScript = (options2) => {
   const { isMobile } = useScreen();
+  const { t } = useTranslation();
   const [markets] = useMarkets(MarketsType.ALL);
   const items = useMemo(() => {
     if (!markets || markets.length === 0) {
@@ -2260,10 +2435,20 @@ var useMarginModeSettingsScript = (options2) => {
     return markets.map((market) => ({
       key: market.symbol,
       // Original symbol: "PERP_BTC_USDC"
-      symbol: formatSymbol(market.symbol, "base-type")
+      symbol: formatSymbol(market.symbol, "base"),
       // Formatted: "BTC-PERP"
+      brokerId: market.broker_id
     }));
   }, [markets]);
+  const brokerLockedKeys = useMemo(() => {
+    const locked = /* @__PURE__ */ new Set();
+    for (const item of items) {
+      if (item.brokerId) {
+        locked.add(item.key);
+      }
+    }
+    return locked;
+  }, [items]);
   const [searchKeyword, setSearchKeyword] = useState("");
   const [selectedKeys, setSelectedKeys] = useState(
     () => /* @__PURE__ */ new Set()
@@ -2284,11 +2469,15 @@ var useMarginModeSettingsScript = (options2) => {
   const itemMarginModes = useMemo(() => {
     const result = {};
     for (const item of items) {
+      if (brokerLockedKeys.has(item.key)) {
+        result[item.key] = MarginMode.ISOLATED;
+        continue;
+      }
       const marginMode = marginModes[item.key];
       result[item.key] = marginMode ?? MarginMode.CROSS;
     }
     return result;
-  }, [items, marginModes]);
+  }, [brokerLockedKeys, items, marginModes]);
   const filteredItems = useMemo(() => {
     const keyword = searchKeyword.trim().toLowerCase();
     if (!keyword) return items;
@@ -2324,17 +2513,21 @@ var useMarginModeSettingsScript = (options2) => {
   const onSearchChange = useCallback((keyword) => {
     setSearchKeyword(keyword);
   }, []);
-  const onToggleItem = useCallback((key) => {
-    setSelectedKeys((prev) => {
-      const next = new Set(prev);
-      if (next.has(key)) {
-        next.delete(key);
-      } else {
-        next.add(key);
-      }
-      return next;
-    });
-  }, []);
+  const onToggleItem = useCallback(
+    (key) => {
+      if (brokerLockedKeys.has(key)) return;
+      setSelectedKeys((prev) => {
+        const next = new Set(prev);
+        if (next.has(key)) {
+          next.delete(key);
+        } else {
+          next.add(key);
+        }
+        return next;
+      });
+    },
+    [brokerLockedKeys]
+  );
   const onToggleSelectAll = useCallback(() => {
     setSelectedKeys((prev) => {
       const next = new Set(prev);
@@ -2345,31 +2538,39 @@ var useMarginModeSettingsScript = (options2) => {
         return next;
       }
       for (const item of filteredItems) {
+        if (brokerLockedKeys.has(item.key)) continue;
         next.add(item.key);
       }
       return next;
     });
-  }, [filteredItems, isSelectAll]);
+  }, [brokerLockedKeys, filteredItems, isSelectAll]);
   const onSetMarginMode = useCallback(
     async (mode) => {
       if (selectedKeys.size === 0) return;
+      const editableSymbolList = Array.from(selectedKeys).filter(
+        (key) => !brokerLockedKeys.has(key)
+      );
+      if (editableSymbolList.length === 0) {
+        toast.error(t("marginMode.noEditableSymbolsSelected"));
+        return;
+      }
       setIsOperationLoading(true);
       try {
         const payload = {
-          symbol_list: Array.from(selectedKeys),
+          symbol_list: editableSymbolList,
           default_margin_mode: mode
         };
         await updateMarginMode(payload);
-        toast.success("Updated successfully");
+        toast.success(t("marginMode.updatedSuccessfully"));
       } catch (error) {
         toast.error(
-          error instanceof Error ? error.message : "Failed to update margin mode"
+          error instanceof Error ? error.message : t("marginMode.failedToUpdateMarginMode")
         );
       } finally {
         setIsOperationLoading(false);
       }
     },
-    [selectedKeys, updateMarginMode]
+    [brokerLockedKeys, selectedKeys, updateMarginMode]
   );
   const isLoading = isDataLoading || isMarginModesLoading || isOperationLoading || isSettingMarginMode;
   return {
@@ -2517,7 +2718,8 @@ var MarginModeSettings = (props) => {
                       item,
                       checked: props.selectedKeys.has(item.key),
                       marginMode: props.itemMarginModes[item.key] ?? MarginMode.CROSS,
-                      onToggle: props.onToggleItem
+                      onToggle: props.onToggleItem,
+                      disabled: !!item.brokerId
                     },
                     item.key
                   ))
@@ -2620,13 +2822,15 @@ var MarginModeSettings = (props) => {
 var SymbolRow = (props) => {
   const { t } = useTranslation();
   const handleCheckedChange = useCallback(() => {
+    if (props.disabled) return;
     props.onToggle(props.item.key);
   }, [props]);
-  return /* @__PURE__ */ jsx(Flex, { itemAlign: "center", className: "oui-w-full", children: /* @__PURE__ */ jsxs(
+  const row = /* @__PURE__ */ jsx(Flex, { itemAlign: "center", className: "oui-w-full", children: /* @__PURE__ */ jsxs(
     "label",
     {
       className: cn(
-        "oui-flex oui-items-center oui-gap-2 oui-flex-1 oui-cursor-pointer oui-select-none oui-w-full"
+        "oui-flex oui-items-center oui-gap-2 oui-flex-1 oui-cursor-pointer oui-select-none oui-w-full",
+        props.disabled ? "oui-cursor-not-allowed oui-opacity-50" : ""
       ),
       "data-testid": `oui-testid-marginModeSettings-item-${props.item.key}`,
       children: [
@@ -2636,10 +2840,12 @@ var SymbolRow = (props) => {
             color: "white",
             checked: props.checked,
             onCheckedChange: handleCheckedChange,
-            "aria-label": props.item.symbol
+            "aria-label": props.item.symbol,
+            disabled: props.disabled
           }
         ),
         /* @__PURE__ */ jsx(Text, { className: "oui-text-sm oui-font-semibold oui-text-base-contrast-80", children: props.item.symbol }),
+        /* @__PURE__ */ jsx(SymbolBadge, { symbol: props.item.key }),
         /* @__PURE__ */ jsx(
           "span",
           {
@@ -2655,6 +2861,17 @@ var SymbolRow = (props) => {
       ]
     }
   ) });
+  if (props.disabled) {
+    return /* @__PURE__ */ jsx(
+      Tooltip,
+      {
+        content: t("marginMode.disabledSymbolTooltip"),
+        className: "oui-max-w-[280px] oui-text-2xs oui-text-base-contrast-80",
+        children: row
+      }
+    );
+  }
+  return row;
 };
 var SearchGlyph = (props) => {
   return /* @__PURE__ */ jsx(
@@ -2846,7 +3063,9 @@ function OrderEntryHeader(props) {
         canTrade,
         onChange: (type) => {
           setOrderValue("order_type", type);
-        }
+        },
+        marketOrderDisabled: props.marketOrderDisabled,
+        marketOrderDisabledTooltip: props.marketOrderDisabledTooltip
       }
     ) }),
     /* @__PURE__ */ jsxs(
@@ -4617,12 +4836,15 @@ var usePNLInputBuilder = (props) => {
         }
         if (value === "" || value === "-") return "";
         if (mode === "Offset%" /* PERCENTAGE */) {
-          return `${new Decimal(
-            value.replace(
-              new RegExp(percentageSuffix.current.replace(".", "\\.") + "$"),
-              ""
-            )
-          ).mul(100).todp(2, 4).toString()}${percentageSuffix.current}`;
+          let normalized = value.replace(
+            new RegExp(percentageSuffix.current.replace(".", "\\.") + "$"),
+            ""
+          ).replace(/,/g, "");
+          normalized = normalized.replace(/\.$/, "");
+          if (isNaN(Number(normalized)) || normalized === "" || normalized === "-") {
+            return value;
+          }
+          return `${new Decimal(normalized).mul(100).todp(2, 4).toString()}${percentageSuffix.current}`;
         } else if (mode === "Offset" /* OFFSET */) {
           value = todpIfNeed(value, dp);
         } else ;
@@ -4641,6 +4863,9 @@ var usePNLInputBuilder = (props) => {
             } else {
               percentageSuffix.current = "";
             }
+            if (isNaN(Number(value))) {
+              return value;
+            }
             value = new Decimal(value).div(100).toString();
             value = `${value}${percentageSuffix.current}`;
           }
@@ -5176,6 +5401,7 @@ var OrderEntry = (props) => {
     setOrderValue,
     manualSetOrderValue,
     setOrderValues,
+    setOrderValuesRaw,
     symbolInfo,
     maxQty,
     freeCollateral,
@@ -5191,9 +5417,13 @@ var OrderEntry = (props) => {
     fillMiddleValue,
     soundAlert,
     setSoundAlert,
-    currentFocusInput
+    currentFocusInput,
+    walletAddress,
+    isPermissionlessListing,
+    symbol
   } = props;
   const [maxQtyConfirmOpen, setMaxQtyConfirmOpen] = useState(false);
+  const [permissionlessAcknowledgedKeys, setPermissionlessAcknowledgedKeys] = useLocalStorage("orderly-permissionless-market-notice", []);
   const { t } = useTranslation();
   const { isMobile } = useScreen();
   const [hasAdvancedTPSLResult, setHasAdvancedTPSLResult] = useState(false);
@@ -5263,22 +5493,7 @@ var OrderEntry = (props) => {
     helper.validate(isSlPriceError ? props.slPriceError : void 0).then(
       // validate success, it return the order
       // TODO: get order from other function
-      (order) => {
-        if (isScaledOrder) {
-          return modal.show(scaledOrderConfirmDialogId, {
-            order,
-            symbolInfo,
-            size: isMobile ? "sm" : "md"
-          });
-        }
-        if (needConfirm) {
-          return modal.show(orderConfirmDialogId, {
-            order: formattedOrder,
-            symbolInfo
-          });
-        }
-        return true;
-      },
+      (order) => order,
       // should catch validate error first, then submit
       (errors2) => {
         if (errors2.slippage) {
@@ -5287,7 +5502,38 @@ var OrderEntry = (props) => {
         setErrorMsgVisible(true);
         return Promise.reject();
       }
-    ).then(() => {
+    ).then((order) => {
+      const shouldShowPermissionlessNotice = isPermissionlessListing && walletAddress && !(permissionlessAcknowledgedKeys ?? []).includes(
+        `${walletAddress}_${symbol}`
+      );
+      if (shouldShowPermissionlessNotice) {
+        return modal.show(
+          isMobile ? permissionlessMarketNoticeDialogId : permissionlessMarketNoticeDesktopDialogId
+        ).then(() => {
+          setPermissionlessAcknowledgedKeys([
+            ...Array.isArray(permissionlessAcknowledgedKeys) ? permissionlessAcknowledgedKeys : [],
+            `${walletAddress}_${symbol}`
+          ]);
+          return order;
+        });
+      }
+      return Promise.resolve(order);
+    }).then((order) => {
+      if (isScaledOrder) {
+        return modal.show(scaledOrderConfirmDialogId, {
+          order,
+          symbolInfo,
+          size: isMobile ? "sm" : "md"
+        });
+      }
+      if (needConfirm) {
+        return modal.show(orderConfirmDialogId, {
+          order: formattedOrder,
+          symbolInfo
+        });
+      }
+      return true;
+    }).then(() => {
       return submit({ resetOnSuccess: false }).then((result) => {
         if (!result.success && result.message) {
           toast.error(result.message);
@@ -5355,7 +5601,7 @@ var OrderEntry = (props) => {
     if (order.side !== formattedOrder.side) {
       manualSetOrderValue("side", order.side);
     }
-    setOrderValues({
+    setOrderValuesRaw({
       position_type: order.position_type,
       tp_order_type: order.tp_order_type,
       tp_pnl: order.tp_pnl,
@@ -5454,7 +5700,11 @@ var OrderEntry = (props) => {
                   order_type: formattedOrder.order_type,
                   setOrderValue: manualSetOrderValue,
                   symbolLeverage: props.symbolLeverage,
-                  marginMode: props.marginMode
+                  marginMode: props.marginMode,
+                  marketOrderDisabled: props.isSymbolPostOnly,
+                  marketOrderDisabledTooltip: t(
+                    "orderEntry.orderType.symbolPostOnly.tooltip"
+                  )
                 }
               ),
               /* @__PURE__ */ jsx(
@@ -5852,11 +6102,14 @@ var useOrderEntryScript = (inputs) => {
     defaultSoundValue ?? null
   );
   const canTrade = useCanTrade();
-  const { marginMode } = useMarginModeBySymbol(symbol);
+  const { state: accountState } = useAccount();
+  const { marginMode, isPermissionlessListing } = useMarginModeBySymbol(symbol);
+  const walletAddress = accountState?.address;
   const {
     formattedOrder,
     setValue,
     setValues: setOrderValues,
+    setValuesRaw: setOrderValuesRaw,
     symbolInfo,
     symbolLeverage,
     ...state
@@ -6052,6 +6305,16 @@ var useOrderEntryScript = (inputs) => {
       setValue("distribution_type", DistributionType.FLAT);
     }
   }, [formattedOrder.order_type, formattedOrder.distribution_type]);
+  const isSymbolPostOnly = symbolInfo?.status === "POST_ONLY";
+  useEffect(() => {
+    if (isSymbolPostOnly && (formattedOrder.order_type === OrderType.MARKET || formattedOrder.order_type === OrderType.STOP_MARKET)) {
+      setLocalOrderType(OrderType.LIMIT);
+      setOrderValues({
+        order_type: OrderType.LIMIT,
+        order_type_ext: void 0
+      });
+    }
+  }, [isSymbolPostOnly, formattedOrder.order_type, setOrderValues]);
   const currentLtv = useComputedLTV();
   const askAndBid = useAskAndBid();
   const fillMiddleValue = () => {
@@ -6115,6 +6378,7 @@ var useOrderEntryScript = (inputs) => {
     setOrderValue,
     manualSetOrderValue,
     setOrderValues,
+    setOrderValuesRaw,
     // account-level leverage (for other consumers)
     currentLeverage,
     // symbol-level leverage & margin mode for this order entry
@@ -6143,7 +6407,10 @@ var useOrderEntryScript = (inputs) => {
     symbol,
     soundAlert,
     setSoundAlert,
-    currentFocusInput
+    currentFocusInput,
+    walletAddress,
+    isPermissionlessListing,
+    isSymbolPostOnly
   };
 };
 var OrderEntryWidget = (props) => {
@@ -6158,6 +6425,6 @@ var OrderEntryWidget = (props) => {
   );
 };
 
-export { AdditionalInfo, FeesWidget, LTVRiskTooltipWidget, OrderConfirmDialog, OrderEntry, OrderEntryWidget, useOrderEntryScript };
+export { AdditionalInfo, FeesWidget, LTVRiskTooltipWidget, OrderConfirmDialog, OrderEntry, OrderEntryWidget, SymbolBadge, useOrderEntryScript };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map