@orderly.network/ui 2.8.5 → 2.8.6-alpha.0

package/dist/index.mjs

@@ -4314,7 +4314,7 @@ var NumType = (props) => {
   const renderChild = () => {
     switch (numType) {
       case "roi":
-        return formatNum.roi(children);
+        return formatNum.roi(children, props.rule === "percentages" ? 4 : 2)?.toString();
       case "pnl":
         return formatNum.pnl(children);
       case "notional":
@@ -4496,10 +4496,10 @@ var BaseInput = forwardRef(
       [innerFormatters]
     );
     const formattedValue = useMemo(() => {
-      if (typeof value === "undefined")
-        return value;
+      if (typeof value === "undefined" || value === null)
+        return "";
       return formatToRender(value);
-    }, [value]);
+    }, [value, formatToRender]);
     useEffect(() => {
       if (document.activeElement !== innerInputRef.current)
         return;
@@ -5422,7 +5422,7 @@ var SelectWithOptions = (props) => {
   }) }) });
 };
 var TokenSelect = (props) => {
-  const { tokens, showIcon = true, iconSize, ...rest } = props;
+  const { tokens, showIcon = true, iconSize, showCaret, ...rest } = props;
   const { icon } = selectVariants();
   const options = useMemo(() => {
     return tokens.map((token) => {
@@ -5460,7 +5460,7 @@ var TokenSelect = (props) => {
     SelectWithOptions,
     {
       ...rest,
-      showCaret: selectable,
+      showCaret: typeof showCaret === "boolean" ? showCaret : selectable,
       options,
       valueFormatter: showIcon ? valueRenderer : void 0,
       optionRenderer,
@@ -11211,7 +11211,81 @@ __export(tailwind_exports, {
   default: () => tailwind_default
 });
 var tailwind_default = {};
+var dotStatusVariants = tv$1({
+  slots: {
+    root: "oui-flex oui-items-center oui-justify-center oui-gap-1",
+    dot: "oui-flex-shrink-0 oui-rounded-full",
+    label: "oui-text-2xs"
+  },
+  variants: {
+    color: {
+      primary: {
+        dot: "oui-bg-primary-darken",
+        label: "oui-text-primary-darken"
+      },
+      warning: {
+        dot: "oui-bg-warning-darken",
+        label: "oui-text-warning-darken"
+      },
+      profit: {
+        dot: "oui-bg-profit-darken",
+        label: "oui-text-profit-darken"
+      },
+      loss: {
+        dot: "oui-bg-loss-darken",
+        label: "oui-text-loss-darken"
+      },
+      secondary: {
+        dot: "oui-bg-secondary-darken",
+        label: "oui-text-secondary-darken"
+      }
+    },
+    size: {
+      xs: {
+        dot: "oui-w-1 oui-h-1",
+        label: "oui-text-2xs"
+      },
+      sm: {
+        dot: "oui-w-2 oui-h-2",
+        label: "oui-text-2xs"
+      },
+      md: {
+        dot: "oui-w-3 oui-h-3",
+        label: "oui-text-2xs"
+      },
+      lg: {
+        dot: "oui-w-4 oui-h-4",
+        label: "oui-text-2xs"
+      }
+    }
+  },
+  defaultVariants: {
+    color: "primary",
+    size: "xs"
+  }
+});
+var DotStatus = (props) => {
+  const { color, size, label, classNames } = props;
+  const { root, dot, label: labelSlot } = dotStatusVariants({ color, size });
+  if (!label) {
+    return /* @__PURE__ */ jsx(Box, { r: "full", className: dot({ className: classNames?.dot }) });
+  }
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      itemAlign: "center",
+      justify: "center",
+      gapX: 1,
+      className: root({ className: classNames?.root }),
+      children: [
+        /* @__PURE__ */ jsx(Box, { r: "full", className: dot({ className: classNames?.dot }) }),
+        /* @__PURE__ */ jsx(Text2, { size: "2xs", className: labelSlot({ className: classNames?.label }), children: label })
+      ]
+    }
+  );
+};
+DotStatus.displayName = "DotStatus";
 
-export { ActionSheet, AddCircleIcon, AffiliateIcon, AlertDialog, ArrowDownShortIcon, ArrowDownSquareFillIcon, ArrowDownUpIcon, ArrowLeftRightIcon, ArrowLeftRightSquareFill, ArrowLeftShortIcon, ArrowRightShortIcon, ArrowRightUpSquareFillIcon, ArrowUpShortIcon, ArrowUpSquareFillIcon, AssetIcon, Avatar, Badge, BarChartIcon, BattleActiveIcon, BattleIcon, BattleInactiveIcon, BattleSolidActiveIcon, BattleSolidInactiveIcon, BellIcon, Box, Button, Calendar, CalendarIcon, CalendarMinusIcon, Card, CardBase, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CaretDownIcon, CaretLeftIcon, CaretRightIcon, CaretUpIcon, ChainIcon, CheckIcon, CheckSquareEmptyIcon, Checkbox, CheckedCircleFillIcon, CheckedSquareFillIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleOutlinedIcon, CloseCircleFillIcon, CloseIcon, CloseRoundFillIcon, CloseSquareFillIcon, collapse_default as Collapse, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ConfirmDialog, CopyIcon, DataFilter, DataTable, DatePicker2 as DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Divider, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuTrigger, EVMAvatar, EarnActiveIcon, EarnIcon, EarnInactiveIcon, EditIcon, Either, EmptyDataState, EmptyStateIcon, EsOrderlyIcon, ExclamationFillIcon, ExtensionPositionEnum, ExtensionSlot, EyeCloseIcon, EyeIcon, FeeTierIcon, Flex, GradientText, Grid2 as Grid, HoverCard, HoverCardContent, HoverCardRoot, HoverCardTrigger, Icon, InfoCircleIcon, Input2 as Input, InputAdditional, LeaderboardActiveIcon, LeaderboardInactiveIcon, LeftNavVaultsIcon, ListView, LocaleContext, LocaleProvider, Logo, MarketsActiveIcon, MarketsInactiveIcon, Marquee, ModalContext, ModalIdContext, ModalProvider, MultiSortHeader, NewsFillIcon, tailwind_exports as OUITailwind, OrderlyIcon, OrderlyThemeProvider, PaginationItems, PeopleIcon, PerpsIcon, PersonIcon, Picker, PlusIcon, Popover, PopoverAnchor, PopoverContent, PopoverRoot, PopoverTrigger, PopupUnionIcon, PortfolioActiveIcon, PortfolioInactiveIcon, QuestionFillIcon, ReduceIcon, ReferralSolidIcon, RefreshIcon, ScrollArea, ScrollBar, ScrollIndicator, Select2 as Select, SelectItem, SelectedChoicesFillIcon, ServerFillIcon, SettingFillIcon, SettingIcon, ShareIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleDialog, SimpleDialogFooter, SimpleDropdownMenu, SimpleSheet, Slider, SortingAscIcon, SortingDescIcon, SortingIcon, Spinner, SpotIcon, SquareOutlinedIcon, StarChildChatActiveIcon, StarChildChatInactiveIcon, Statistic, StatisticLabel, SwapHorizIcon, Switch, TabPanel, features_exports as TableFeatures, Tabs, TabsBase, TabsContent, TabsList, TabsTrigger, Text2 as Text, TextField, ThrottledButton, ToastTile, Toaster, TokenIcon, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipRoot, TooltipTrigger, TraderMobileIcon, TradingActiveIcon, TradingIcon, TradingInactiveIcon, TradingLeftNavIcon, TradingRewardsIcon, TriggerDialog, VaultsIcon, VectorIcon, WalletIcon, WoofiStakeIcon, boxVariants, buttonVariants, capitalizeFirstLetter, convertValueToPercentage, formatAddress, gradientTextVariants, formatter_exports as inputFormatter, installExtension, modal, parseNumber, registerSimpleDialog, registerSimpleSheet, scrollAreaVariants, setExtensionBuilder, startViewTransition, statisticVariants, textVariants, tv, useLocale, useMediaQuery, useModal, useMultiSort, useObserverElement, useOrderlyTheme, usePagination, useScreen };
+export { ActionSheet, AddCircleIcon, AffiliateIcon, AlertDialog, ArrowDownShortIcon, ArrowDownSquareFillIcon, ArrowDownUpIcon, ArrowLeftRightIcon, ArrowLeftRightSquareFill, ArrowLeftShortIcon, ArrowRightShortIcon, ArrowRightUpSquareFillIcon, ArrowUpShortIcon, ArrowUpSquareFillIcon, AssetIcon, Avatar, Badge, BarChartIcon, BattleActiveIcon, BattleIcon, BattleInactiveIcon, BattleSolidActiveIcon, BattleSolidInactiveIcon, BellIcon, Box, Button, Calendar, CalendarIcon, CalendarMinusIcon, Card, CardBase, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, CaretDownIcon, CaretLeftIcon, CaretRightIcon, CaretUpIcon, ChainIcon, CheckIcon, CheckSquareEmptyIcon, Checkbox, CheckedCircleFillIcon, CheckedSquareFillIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleOutlinedIcon, CloseCircleFillIcon, CloseIcon, CloseRoundFillIcon, CloseSquareFillIcon, collapse_default as Collapse, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ConfirmDialog, CopyIcon, DataFilter, DataTable, DatePicker2 as DatePicker, Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Divider, DotStatus, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuTrigger, EVMAvatar, EarnActiveIcon, EarnIcon, EarnInactiveIcon, EditIcon, Either, EmptyDataState, EmptyStateIcon, EsOrderlyIcon, ExclamationFillIcon, ExtensionPositionEnum, ExtensionSlot, EyeCloseIcon, EyeIcon, FeeTierIcon, Flex, GradientText, Grid2 as Grid, HoverCard, HoverCardContent, HoverCardRoot, HoverCardTrigger, Icon, InfoCircleIcon, Input2 as Input, InputAdditional, LeaderboardActiveIcon, LeaderboardInactiveIcon, LeftNavVaultsIcon, ListView, LocaleContext, LocaleProvider, Logo, MarketsActiveIcon, MarketsInactiveIcon, Marquee, ModalContext, ModalIdContext, ModalProvider, MultiSortHeader, NewsFillIcon, tailwind_exports as OUITailwind, OrderlyIcon, OrderlyThemeProvider, PaginationItems, PeopleIcon, PerpsIcon, PersonIcon, Picker, PlusIcon, Popover, PopoverAnchor, PopoverContent, PopoverRoot, PopoverTrigger, PopupUnionIcon, PortfolioActiveIcon, PortfolioInactiveIcon, QuestionFillIcon, ReduceIcon, ReferralSolidIcon, RefreshIcon, ScrollArea, ScrollBar, ScrollIndicator, Select2 as Select, SelectItem, SelectedChoicesFillIcon, ServerFillIcon, SettingFillIcon, SettingIcon, ShareIcon, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, SimpleDialog, SimpleDialogFooter, SimpleDropdownMenu, SimpleSheet, Slider, SortingAscIcon, SortingDescIcon, SortingIcon, Spinner, SpotIcon, SquareOutlinedIcon, StarChildChatActiveIcon, StarChildChatInactiveIcon, Statistic, StatisticLabel, SwapHorizIcon, Switch, TabPanel, features_exports as TableFeatures, Tabs, TabsBase, TabsContent, TabsList, TabsTrigger, Text2 as Text, TextField, ThrottledButton, ToastTile, Toaster, TokenIcon, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipRoot, TooltipTrigger, TraderMobileIcon, TradingActiveIcon, TradingIcon, TradingInactiveIcon, TradingLeftNavIcon, TradingRewardsIcon, TriggerDialog, VaultsIcon, VectorIcon, WalletIcon, WoofiStakeIcon, boxVariants, buttonVariants, capitalizeFirstLetter, convertValueToPercentage, dotStatusVariants, formatAddress, gradientTextVariants, formatter_exports as inputFormatter, installExtension, modal, parseNumber, registerSimpleDialog, registerSimpleSheet, scrollAreaVariants, setExtensionBuilder, startViewTransition, statisticVariants, textVariants, tv, useLocale, useMediaQuery, useModal, useMultiSort, useObserverElement, useOrderlyTheme, usePagination, useScreen };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.mjs.map