@orderly.network/markets 2.10.1 → 2.10.2-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.js +627 -310
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +627 -310
  4. package/dist/index.mjs.map +1 -1
  5. package/dist/styles.css +1 -1
  6. package/package.json +8 -8
package/dist/index.mjs CHANGED
@@ -92,7 +92,7 @@ var init_icons = __esm({
92
92
  y: "0",
93
93
  width: "16",
94
94
  height: "16",
95
- children: /* @__PURE__ */ jsx("path", { fill: "#D9D9D9", d: "M0 0h16v16H0z" })
95
+ children: /* @__PURE__ */ jsx("path", { fill: "rgb(var(--oui-color-tertiary))", d: "M0 0h16v16H0z" })
96
96
  }
97
97
  ),
98
98
  /* @__PURE__ */ jsx("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx("path", { d: "M3.333 12.667h.95L10.8 6.15l-.95-.95-6.517 6.517zM2.667 14a.65.65 0 0 1-.475-.192.65.65 0 0 1-.192-.475v-1.616a1.32 1.32 0 0 1 .383-.934l8.417-8.4q.2-.183.442-.283.24-.1.508-.1.267 0 .517.1.249.1.433.3l.917.933q.2.184.291.434a1.44 1.44 0 0 1 0 1.008 1.25 1.25 0 0 1-.291.442l-8.4 8.4a1.32 1.32 0 0 1-.933.383zm7.65-8.317L9.85 5.2l.95.95z" }) })
@@ -131,7 +131,7 @@ var init_icons = __esm({
131
131
  y: "0",
132
132
  width: "12",
133
133
  height: "12",
134
- children: /* @__PURE__ */ jsx("path", { fill: "#D9D9D9", d: "M0 0h12v12H0z" })
134
+ children: /* @__PURE__ */ jsx("path", { fill: "rgb(var(--oui-color-tertiary))", d: "M0 0h12v12H0z" })
135
135
  }
136
136
  ),
137
137
  /* @__PURE__ */ jsx("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx("path", { d: "M8.5 10a.48.48 0 0 1-.356-.144A.48.48 0 0 1 8 9.5V7q0-.213.144-.356A.48.48 0 0 1 8.5 6.5h1q.212 0 .356.144A.48.48 0 0 1 10 7v2.5q0 .212-.144.356A.48.48 0 0 1 9.5 10zm-3 0a.48.48 0 0 1-.356-.144A.48.48 0 0 1 5 9.5v-7q0-.212.144-.356A.48.48 0 0 1 5.5 2h1q.213 0 .356.144A.48.48 0 0 1 7 2.5v7q0 .212-.144.356A.48.48 0 0 1 6.5 10zm-3 0a.48.48 0 0 1-.356-.144A.48.48 0 0 1 2 9.5V5q0-.213.144-.356A.48.48 0 0 1 2.5 4.5h1q.212 0 .356.144A.48.48 0 0 1 4 5v4.5q0 .212-.144.356A.48.48 0 0 1 3.5 10z" }) })
@@ -159,6 +159,7 @@ var init_icons = __esm({
159
159
  fill: "currentColor",
160
160
  xmlns: "http://www.w3.org/2000/svg",
161
161
  ...props,
162
+ className: cn("oui-text-[rgba(255,154,46,1)]", props.className),
162
163
  children: [
163
164
  /* @__PURE__ */ jsx(
164
165
  "mask",
@@ -186,6 +187,10 @@ var init_icons = __esm({
186
187
  fill: "currentColor",
187
188
  xmlns: "http://www.w3.org/2000/svg",
188
189
  ...props,
190
+ className: cn(
191
+ "oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]",
192
+ props.className
193
+ ),
189
194
  children: [
190
195
  /* @__PURE__ */ jsx(
191
196
  "mask",
@@ -256,6 +261,7 @@ var init_icons = __esm({
256
261
  fill: "currentColor",
257
262
  xmlns: "http://www.w3.org/2000/svg",
258
263
  ...props,
264
+ className: cn("oui-text-[rgba(255,154,46,1)]", props.className),
259
265
  children: /* @__PURE__ */ jsx("path", { d: "M6.012 1.72c-.286 0-.577.178-.75.532L4.2 4.438l-2.42.344c-.78.108-1.03.872-.47 1.42l1.75 1.703-.407 2.39c-.133.773.508 1.24 1.203.874.268-.142 1.648-.857 2.155-1.124l2.155 1.124c.695.367 1.339-.1 1.202-.874l-.421-2.39 1.749-1.702c.565-.547.326-1.31-.453-1.421l-2.436-.344L6.76 2.252c-.172-.354-.464-.531-.75-.531" })
260
266
  }
261
267
  );
@@ -268,6 +274,10 @@ var init_icons = __esm({
268
274
  fill: "currentColor",
269
275
  xmlns: "http://www.w3.org/2000/svg",
270
276
  ...props,
277
+ className: cn(
278
+ "oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]",
279
+ props.className
280
+ ),
271
281
  children: /* @__PURE__ */ jsx("path", { d: "M6.012 1.72c-.286 0-.577.178-.75.532L4.2 4.438l-2.42.344c-.78.108-1.03.872-.47 1.42l1.75 1.703-.407 2.39c-.133.773.508 1.24 1.203.874.268-.142 1.648-.857 2.155-1.124l2.155 1.124c.695.367 1.339-.1 1.202-.874l-.421-2.39 1.749-1.702c.565-.547.326-1.31-.453-1.421l-2.436-.344L6.76 2.252c-.172-.354-.464-.531-.75-.531m0 1.297 1.03 2.108c.073.15.211.242.375.266l2.343.343-1.702 1.64a.48.48 0 0 0-.14.437l.405 2.312L6.246 9.03a.5.5 0 0 0-.468 0L3.7 10.123l.39-2.296a.52.52 0 0 0-.14-.453l-1.687-1.64 2.327-.328a.52.52 0 0 0 .39-.28z" })
272
282
  }
273
283
  );
@@ -1558,7 +1568,7 @@ var init_column = __esm({
1558
1568
  justify: "center",
1559
1569
  itemAlign: "center",
1560
1570
  className: "oui-mr-1 oui-cursor-pointer",
1561
- children: record.isFavorite ? /* @__PURE__ */ jsx(FavoritesIcon2, { className: "oui-size-3 oui-text-[rgba(255,154,46,1)]" }) : /* @__PURE__ */ jsx(UnFavoritesIcon2, { className: "oui-size-3 oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]" })
1571
+ children: record.isFavorite ? /* @__PURE__ */ jsx(FavoritesIcon2, { className: "oui-size-3" }) : /* @__PURE__ */ jsx(UnFavoritesIcon2, { className: "oui-size-3" })
1562
1572
  }
1563
1573
  ) });
1564
1574
  }
@@ -1922,7 +1932,10 @@ var init_searchInput = __esm({
1922
1932
  classNames: {
1923
1933
  ...classNames,
1924
1934
  // use mt-px to fix the top border issue
1925
- root: cn("oui-mt-px oui-border oui-border-line", classNames?.root)
1935
+ root: cn(
1936
+ "oui-mt-px oui-border oui-border-line focus-within:oui-border-transparent",
1937
+ classNames?.root
1938
+ )
1926
1939
  },
1927
1940
  size: "sm",
1928
1941
  prefix: /* @__PURE__ */ jsx(Box, { pl: 3, pr: 1, children: /* @__PURE__ */ jsx(SearchIcon, { className: "oui-text-base-contrast-36" }) }),
@@ -1957,18 +1970,22 @@ function getSymbolColumn(favorite, isFavoriteList = false) {
1957
1970
  justify: "center",
1958
1971
  itemAlign: "center",
1959
1972
  className: "oui-mr-1 oui-cursor-pointer",
1960
- children: record.isFavorite ? /* @__PURE__ */ jsx(FavoritesIcon2, { className: "oui-size-3 oui-text-[rgba(255,154,46,1)]" }) : /* @__PURE__ */ jsx(UnFavoritesIcon2, { className: "oui-size-3 oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]" })
1973
+ children: record.isFavorite ? /* @__PURE__ */ jsx(FavoritesIcon2, { className: "oui-size-3" }) : /* @__PURE__ */ jsx(UnFavoritesIcon2, { className: "oui-size-3" })
1961
1974
  }
1962
1975
  ) });
1963
1976
  }
1964
1977
  return /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
1965
1978
  favoritesIcon,
1966
- /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-[18px]" }),
1967
- /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "2xs", children: value }),
1968
- /* @__PURE__ */ jsx(RwaDotTooltip, { record }),
1969
- /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
1970
- record.leverage,
1971
- "x"
1979
+ /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "start", gapY: 1, children: [
1980
+ /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
1981
+ /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-[18px]" }),
1982
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "2xs", children: value }),
1983
+ /* @__PURE__ */ jsx(RwaDotTooltip, { record })
1984
+ ] }),
1985
+ /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
1986
+ record.leverage,
1987
+ "x"
1988
+ ] })
1972
1989
  ] })
1973
1990
  ] });
1974
1991
  }
@@ -2008,8 +2025,153 @@ function get24hPercentageColumn() {
2008
2025
  }
2009
2026
  };
2010
2027
  }
2028
+ function get24hVolOIColumn() {
2029
+ return {
2030
+ title: i18n.t("markets.column.24hVolOI"),
2031
+ dataIndex: "24h_amount",
2032
+ align: "right",
2033
+ className: "oui-h-[36px]",
2034
+ width: 100,
2035
+ multiSort: {
2036
+ fields: [
2037
+ {
2038
+ sortKey: "24h_amount",
2039
+ label: i18n.t("markets.column.24hVol")
2040
+ },
2041
+ {
2042
+ sortKey: "openInterest",
2043
+ label: i18n.t("markets.column.OI")
2044
+ }
2045
+ ]
2046
+ },
2047
+ render: (value, record) => /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "end", gapY: 1, children: [
2048
+ /* @__PURE__ */ jsx(Text.numeral, { rule: "human", dp: 2, rm: Decimal.ROUND_DOWN, children: value }),
2049
+ /* @__PURE__ */ jsx(
2050
+ Text.numeral,
2051
+ {
2052
+ rule: "human",
2053
+ dp: 2,
2054
+ rm: Decimal.ROUND_DOWN,
2055
+ size: "2xs",
2056
+ intensity: 54,
2057
+ children: record.openInterest
2058
+ }
2059
+ )
2060
+ ] })
2061
+ };
2062
+ }
2063
+ function getLastAnd24hPercentageColumn(favorite, isFavoriteList = false) {
2064
+ return {
2065
+ title: i18n.t("markets.column.last&24hPercentage"),
2066
+ dataIndex: "change",
2067
+ align: "right",
2068
+ onSort: true,
2069
+ className: "oui-h-[36px]",
2070
+ width: 100,
2071
+ render: (value, record) => {
2072
+ const onDelSymbol = (e) => {
2073
+ favorite.updateSymbolFavoriteState(
2074
+ record,
2075
+ favorite.selectedFavoriteTab,
2076
+ true
2077
+ );
2078
+ e.stopPropagation();
2079
+ };
2080
+ const iconCls = "oui-w-4 oui-h-4 oui-text-base-contrast-54 hover:oui-text-base-contrast";
2081
+ const actions = /* @__PURE__ */ jsx(
2082
+ "div",
2083
+ {
2084
+ className: cn(
2085
+ "oui-absolute oui-right-0 oui-top-[6.5px]",
2086
+ "oui-hidden group-hover:oui-block"
2087
+ ),
2088
+ children: /* @__PURE__ */ jsxs(
2089
+ Flex,
2090
+ {
2091
+ className: cn(
2092
+ "oui-inline-flex",
2093
+ "oui-bg-primary-darken oui-py-[6px]"
2094
+ ),
2095
+ r: "base",
2096
+ width: 52,
2097
+ justify: "center",
2098
+ itemAlign: "end",
2099
+ gapX: 2,
2100
+ children: [
2101
+ /* @__PURE__ */ jsx(
2102
+ TopIcon,
2103
+ {
2104
+ className: iconCls,
2105
+ onClick: (e) => {
2106
+ e.stopPropagation();
2107
+ favorite.pinToTop(record);
2108
+ }
2109
+ }
2110
+ ),
2111
+ /* @__PURE__ */ jsx(DeleteIcon, { className: iconCls, onClick: onDelSymbol })
2112
+ ]
2113
+ }
2114
+ )
2115
+ }
2116
+ );
2117
+ return /* @__PURE__ */ jsxs("div", { className: "oui-relative", children: [
2118
+ isFavoriteList && actions,
2119
+ /* @__PURE__ */ jsxs(
2120
+ Flex,
2121
+ {
2122
+ direction: "column",
2123
+ justify: "end",
2124
+ itemAlign: "end",
2125
+ gapY: 1,
2126
+ className: cn(isFavoriteList && "group-hover:oui-invisible"),
2127
+ children: [
2128
+ /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, size: "2xs", children: record["24h_close"] }),
2129
+ /* @__PURE__ */ jsx(
2130
+ Text.numeral,
2131
+ {
2132
+ rule: "percentages",
2133
+ coloring: true,
2134
+ rm: Decimal.ROUND_DOWN,
2135
+ showIdentifier: true,
2136
+ size: "2xs",
2137
+ children: value
2138
+ }
2139
+ )
2140
+ ]
2141
+ }
2142
+ )
2143
+ ] });
2144
+ }
2145
+ };
2146
+ }
2147
+ function getMarkIndexColumn() {
2148
+ return {
2149
+ title: i18n.t("markets.column.mark&Index"),
2150
+ dataIndex: "mark_price",
2151
+ align: "right",
2152
+ className: "oui-h-[36px]",
2153
+ width: 100,
2154
+ multiSort: {
2155
+ fields: [
2156
+ {
2157
+ sortKey: "mark_price",
2158
+ label: i18n.t("markets.column.mark")
2159
+ },
2160
+ {
2161
+ sortKey: "index_price",
2162
+ label: i18n.t("markets.column.index")
2163
+ }
2164
+ ]
2165
+ },
2166
+ render: (value, record) => /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "end", gapY: 1, children: [
2167
+ /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, size: "2xs", children: value }),
2168
+ /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, size: "2xs", intensity: 54, children: record.index_price })
2169
+ ] })
2170
+ };
2171
+ }
2011
2172
  var init_column2 = __esm({
2012
2173
  "src/components/shared/column.tsx"() {
2174
+ init_icons();
2013
2175
  init_icons();
2014
2176
  init_favoritesDropdownMenu();
2015
2177
  init_rwaDotTooltip();
@@ -2185,7 +2347,7 @@ var init_favoritesTabs_ui = __esm({
2185
2347
  isActive && cn(overLen ? "oui-bg-danger/15" : gradientColor)
2186
2348
  ),
2187
2349
  input: cn(
2188
- "oui-font-semibold oui-caret-[rgba(217,217,217,1)]",
2350
+ "oui-font-semibold oui-caret-[rgb(var(--oui-color-tertiary))]",
2189
2351
  overLen ? "oui-text-danger" : "oui-text-transparent oui-gradient-brand ",
2190
2352
  size === "sm" ? "oui-text-2xs" : "oui-text-sm"
2191
2353
  )
@@ -2484,8 +2646,9 @@ var init_marketsDataList_mobile_ui = __esm({
2484
2646
  (favorite, isFavoriteList = false) => {
2485
2647
  return [
2486
2648
  getSymbolColumn(favorite, isFavoriteList),
2487
- getLastColumn(),
2488
- get24hPercentageColumn()
2649
+ get24hVolOIColumn(),
2650
+ getLastAnd24hPercentageColumn(favorite, isFavoriteList),
2651
+ getMarkIndexColumn()
2489
2652
  ];
2490
2653
  },
2491
2654
  []
@@ -2640,7 +2803,7 @@ var init_column3 = __esm({
2640
2803
  itemAlign: "center",
2641
2804
  onClick: isFavoriteList ? onDelSymbol : void 0,
2642
2805
  "data-testid": "oui-testid-markets-table-row-favorite-icon",
2643
- children: value ? /* @__PURE__ */ jsx(FavoritesIcon, { className: "oui-text-[rgba(255,154,46,1)]" }) : /* @__PURE__ */ jsx(UnFavoritesIcon, { className: "oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]" })
2806
+ children: value ? /* @__PURE__ */ jsx(FavoritesIcon, {}) : /* @__PURE__ */ jsx(UnFavoritesIcon, {})
2644
2807
  }
2645
2808
  );
2646
2809
  if (isFavoriteList) {
@@ -2652,14 +2815,20 @@ var init_column3 = __esm({
2652
2815
  {
2653
2816
  title: t("markets.column.market"),
2654
2817
  dataIndex: "symbol",
2655
- width: 90,
2818
+ width: 120,
2656
2819
  onSort: true,
2657
- render: (value) => {
2658
- return /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", showIcon: true, children: value });
2820
+ render: (value, record) => {
2821
+ return /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
2822
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", showIcon: true, children: value }),
2823
+ typeof record.leverage === "number" && /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
2824
+ record.leverage,
2825
+ "x"
2826
+ ] })
2827
+ ] });
2659
2828
  }
2660
2829
  },
2661
2830
  {
2662
- title: t("common.price"),
2831
+ title: t("markets.column.last"),
2663
2832
  dataIndex: "24h_close",
2664
2833
  width: 100,
2665
2834
  align: "right",
@@ -2668,6 +2837,26 @@ var init_column3 = __esm({
2668
2837
  return /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, currency: "$", children: value });
2669
2838
  }
2670
2839
  },
2840
+ {
2841
+ title: t("markets.column.mark"),
2842
+ dataIndex: "mark_price",
2843
+ width: 100,
2844
+ align: "right",
2845
+ onSort: true,
2846
+ render: (value, record) => {
2847
+ return /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, currency: "$", children: value });
2848
+ }
2849
+ },
2850
+ {
2851
+ title: t("markets.column.index"),
2852
+ dataIndex: "index_price",
2853
+ width: 100,
2854
+ align: "right",
2855
+ onSort: true,
2856
+ render: (value, record) => {
2857
+ return /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, currency: "$", children: value });
2858
+ }
2859
+ },
2671
2860
  {
2672
2861
  title: t("markets.column.24hChange"),
2673
2862
  dataIndex: "change",
@@ -2961,7 +3150,7 @@ var init_marketsListFull_script = __esm({
2961
3150
  const { type = "all" } = options;
2962
3151
  const [loading, setLoading] = useState(true);
2963
3152
  const { setPage, pagination } = usePagination({
2964
- pageSize: 10
3153
+ pageSize: 100
2965
3154
  });
2966
3155
  const [data, favorite] = useMarkets(MarketsTypeMap2[type]);
2967
3156
  const { searchValue } = useMarketsContext();
@@ -3058,10 +3247,19 @@ var init_marketsDataList_ui = __esm({
3058
3247
  value: activeTab,
3059
3248
  onValueChange: onTabChange,
3060
3249
  trailing: /* @__PURE__ */ jsx(React6.Suspense, { fallback: null, children: /* @__PURE__ */ jsx(LazySearchInput, { classNames: { root: "oui-my-1 oui-w-[240px]" } }) }),
3250
+ classNames: {
3251
+ tabsList: "oui-tabs-markets-list",
3252
+ tabsContent: "oui-tabs-markets-content"
3253
+ },
3254
+ className: "oui-markets-list-tabs",
3061
3255
  children: [
3062
3256
  /* @__PURE__ */ jsx(
3063
3257
  TabPanel,
3064
3258
  {
3259
+ classNames: {
3260
+ trigger: "oui-tabs-favorites-trigger",
3261
+ content: "oui-tabs-favorites-content"
3262
+ },
3065
3263
  title: /* @__PURE__ */ jsx(FavoritesIcon, {}),
3066
3264
  value: "favorites",
3067
3265
  testid: "oui-testid-markets-favorites-tab",
@@ -3081,6 +3279,10 @@ var init_marketsDataList_ui = __esm({
3081
3279
  /* @__PURE__ */ jsx(
3082
3280
  TabPanel,
3083
3281
  {
3282
+ classNames: {
3283
+ trigger: "oui-tabs-all-trigger",
3284
+ content: "oui-tabs-all-content"
3285
+ },
3084
3286
  title: t("markets.allMarkets"),
3085
3287
  icon: /* @__PURE__ */ jsx(AllMarketsIcon, {}),
3086
3288
  value: "all",
@@ -3097,6 +3299,10 @@ var init_marketsDataList_ui = __esm({
3097
3299
  /* @__PURE__ */ jsx(
3098
3300
  TabPanel,
3099
3301
  {
3302
+ classNames: {
3303
+ trigger: "oui-tabs-rwa-trigger",
3304
+ content: "oui-tabs-rwa-content"
3305
+ },
3100
3306
  title: /* @__PURE__ */ jsx(RwaIconTab, {}),
3101
3307
  value: "rwa",
3102
3308
  testid: "oui-testid-markets-rwa-tab",
@@ -3112,6 +3318,10 @@ var init_marketsDataList_ui = __esm({
3112
3318
  /* @__PURE__ */ jsx(
3113
3319
  TabPanel,
3114
3320
  {
3321
+ classNames: {
3322
+ trigger: "oui-tabs-newListings-trigger",
3323
+ content: "oui-tabs-newListings-content"
3324
+ },
3115
3325
  title: t("markets.newListings"),
3116
3326
  icon: /* @__PURE__ */ jsx(NewListingsIcon, {}),
3117
3327
  value: "new",
@@ -3189,6 +3399,7 @@ var init_expandMarkets_ui = __esm({
3189
3399
  initialSort: tabSort[type],
3190
3400
  onSort: onTabSort(type),
3191
3401
  tableClassNames: {
3402
+ root: "oui-expandMarkets-list",
3192
3403
  scroll: cn(
3193
3404
  "oui-px-1",
3194
3405
  type === "favorites" /* Favorites */ ? "oui-pb-9" : "oui-pb-2"
@@ -3204,39 +3415,102 @@ var init_expandMarkets_ui = __esm({
3204
3415
  }
3205
3416
  ) }) });
3206
3417
  };
3207
- return /* @__PURE__ */ jsxs(Box, { className: cn("oui-overflow-hidden oui-font-semibold"), height: "100%", children: [
3208
- /* @__PURE__ */ jsx(Box, { px: 3, pb: 2, children: /* @__PURE__ */ jsx(React6.Suspense, { fallback: null, children: /* @__PURE__ */ jsx(LazySearchInput2, {}) }) }),
3209
- /* @__PURE__ */ jsxs(
3210
- Tabs,
3211
- {
3212
- variant: "contained",
3213
- size: "md",
3214
- value: activeTab,
3215
- onValueChange: onTabChange,
3216
- classNames: {
3217
- tabsList: cn("oui-my-[6px]"),
3218
- tabsContent: "oui-h-full",
3219
- scrollIndicator: "oui-mx-3"
3220
- },
3221
- className: cls,
3222
- showScrollIndicator: true,
3223
- children: [
3224
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(FavoritesIcon, {}), value: "favorites" /* Favorites */, children: renderTab("favorites" /* Favorites */) }),
3225
- /* @__PURE__ */ jsx(TabPanel, { title: t("common.all"), value: "all" /* All */, children: renderTab("all" /* All */) }),
3226
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaTab, {}), value: "rwa" /* Rwa */, children: renderTab("rwa" /* Rwa */) }),
3227
- /* @__PURE__ */ jsx(
3228
- TabPanel,
3229
- {
3230
- title: t("markets.newListings"),
3231
- value: "newListing" /* NewListing */,
3232
- children: renderTab("newListing" /* NewListing */)
3233
- }
3234
- ),
3235
- /* @__PURE__ */ jsx(TabPanel, { title: t("markets.recent"), value: "recent" /* Recent */, children: renderTab("recent" /* Recent */) })
3236
- ]
3237
- }
3238
- )
3239
- ] });
3418
+ return /* @__PURE__ */ jsxs(
3419
+ Box,
3420
+ {
3421
+ className: cn(
3422
+ "oui-markets-expandMarkets",
3423
+ "oui-overflow-hidden oui-font-semibold"
3424
+ ),
3425
+ height: "100%",
3426
+ children: [
3427
+ /* @__PURE__ */ jsx(Box, { className: "oui-expandMarkets-header", px: 3, pb: 2, children: /* @__PURE__ */ jsx(React6.Suspense, { fallback: null, children: /* @__PURE__ */ jsx(
3428
+ LazySearchInput2,
3429
+ {
3430
+ classNames: { root: "oui-expandMarkets-search-input" }
3431
+ }
3432
+ ) }) }),
3433
+ /* @__PURE__ */ jsxs(
3434
+ Tabs,
3435
+ {
3436
+ variant: "contained",
3437
+ size: "md",
3438
+ value: activeTab,
3439
+ onValueChange: onTabChange,
3440
+ classNames: {
3441
+ tabsList: cn("oui-my-[6px]"),
3442
+ tabsContent: "oui-h-full",
3443
+ scrollIndicator: "oui-mx-3"
3444
+ },
3445
+ className: cn("oui-expandMarkets-tabs", cls),
3446
+ showScrollIndicator: true,
3447
+ children: [
3448
+ /* @__PURE__ */ jsx(
3449
+ TabPanel,
3450
+ {
3451
+ classNames: {
3452
+ trigger: "oui-tabs-favorites-trigger",
3453
+ content: "oui-tabs-favorites-content"
3454
+ },
3455
+ title: /* @__PURE__ */ jsx(FavoritesIcon, {}),
3456
+ value: "favorites" /* Favorites */,
3457
+ children: renderTab("favorites" /* Favorites */)
3458
+ }
3459
+ ),
3460
+ /* @__PURE__ */ jsx(
3461
+ TabPanel,
3462
+ {
3463
+ classNames: {
3464
+ trigger: "oui-tabs-all-trigger",
3465
+ content: "oui-tabs-all-content"
3466
+ },
3467
+ title: t("common.all"),
3468
+ value: "all" /* All */,
3469
+ children: renderTab("all" /* All */)
3470
+ }
3471
+ ),
3472
+ /* @__PURE__ */ jsx(
3473
+ TabPanel,
3474
+ {
3475
+ classNames: {
3476
+ trigger: "oui-tabs-rwa-trigger",
3477
+ content: "oui-tabs-rwa-content"
3478
+ },
3479
+ title: /* @__PURE__ */ jsx(RwaTab, {}),
3480
+ value: "rwa" /* Rwa */,
3481
+ children: renderTab("rwa" /* Rwa */)
3482
+ }
3483
+ ),
3484
+ /* @__PURE__ */ jsx(
3485
+ TabPanel,
3486
+ {
3487
+ classNames: {
3488
+ trigger: "oui-tabs-newListings-trigger",
3489
+ content: "oui-tabs-newListings-content"
3490
+ },
3491
+ title: t("markets.newListings"),
3492
+ value: "newListing" /* NewListing */,
3493
+ children: renderTab("newListing" /* NewListing */)
3494
+ }
3495
+ ),
3496
+ /* @__PURE__ */ jsx(
3497
+ TabPanel,
3498
+ {
3499
+ classNames: {
3500
+ trigger: "oui-tabs-recent-trigger",
3501
+ content: "oui-tabs-recent-content"
3502
+ },
3503
+ title: t("markets.recent"),
3504
+ value: "recent" /* Recent */,
3505
+ children: renderTab("recent" /* Recent */)
3506
+ }
3507
+ )
3508
+ ]
3509
+ }
3510
+ )
3511
+ ]
3512
+ }
3513
+ );
3240
3514
  };
3241
3515
  }
3242
3516
  });
@@ -3350,16 +3624,28 @@ var init_columns = __esm({
3350
3624
  onSort: true,
3351
3625
  width: 135,
3352
3626
  className: isMobile ? "oui-pl-0" : void 0,
3353
- render: (value) => /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
3354
- /* @__PURE__ */ jsx(
3355
- TokenIcon,
3356
- {
3357
- symbol: value,
3358
- className: isMobile ? "oui-size-[18px]" : "oui-size-5"
3359
- }
3360
- ),
3361
- /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "xs", children: value })
3362
- ] })
3627
+ render: (value, record) => {
3628
+ if (isMobile) {
3629
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "start", gapY: 1, children: [
3630
+ /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
3631
+ /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-[18px]" }),
3632
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "2xs", children: value })
3633
+ ] }),
3634
+ typeof record.leverage === "number" && /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
3635
+ record.leverage,
3636
+ "x"
3637
+ ] })
3638
+ ] });
3639
+ }
3640
+ return /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
3641
+ /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-5" }),
3642
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "xs", children: value }),
3643
+ typeof record.leverage === "number" && /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
3644
+ record.leverage,
3645
+ "x"
3646
+ ] })
3647
+ ] });
3648
+ }
3363
3649
  },
3364
3650
  {
3365
3651
  title: t("markets.funding.column.estFunding"),
@@ -3547,7 +3833,7 @@ var init_fundingOverview_script = __esm({
3547
3833
  init_marketsProvider();
3548
3834
  init_utils();
3549
3835
  useFundingOverviewScript = () => {
3550
- const { pagination } = usePagination({ pageSize: 10 });
3836
+ const { pagination } = usePagination({ pageSize: 100 });
3551
3837
  const [marketData] = useMarkets(MarketsType.ALL);
3552
3838
  const {
3553
3839
  data: fundingHistory,
@@ -3579,6 +3865,7 @@ var init_fundingOverview_script = __esm({
3579
3865
  );
3580
3866
  return {
3581
3867
  symbol,
3868
+ leverage: item.leverage,
3582
3869
  estFunding: fundingRate("est_funding_rate"),
3583
3870
  lastFunding: fundingRate("last_funding_rate"),
3584
3871
  fundingInterval,
@@ -3728,16 +4015,28 @@ var init_columns2 = __esm({
3728
4015
  width: 150,
3729
4016
  onSort: true,
3730
4017
  className: isMobile ? "oui-pl-0" : void 0,
3731
- render: (value) => /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
3732
- /* @__PURE__ */ jsx(
3733
- TokenIcon,
3734
- {
3735
- symbol: value,
3736
- className: isMobile ? "oui-size-[18px]" : "oui-size-5"
3737
- }
3738
- ),
3739
- /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "xs", children: value })
3740
- ] })
4018
+ render: (value, record) => {
4019
+ if (isMobile) {
4020
+ return /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "start", gapY: 1, children: [
4021
+ /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
4022
+ /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-[18px]" }),
4023
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "2xs", children: value })
4024
+ ] }),
4025
+ typeof record.leverage === "number" && /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
4026
+ record.leverage,
4027
+ "x"
4028
+ ] })
4029
+ ] });
4030
+ }
4031
+ return /* @__PURE__ */ jsxs(Flex, { gapX: 1, itemAlign: "center", children: [
4032
+ /* @__PURE__ */ jsx(TokenIcon, { symbol: value, className: "oui-size-5" }),
4033
+ /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "xs", children: value }),
4034
+ typeof record.leverage === "number" && /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
4035
+ record.leverage,
4036
+ "x"
4037
+ ] })
4038
+ ] });
4039
+ }
3741
4040
  },
3742
4041
  {
3743
4042
  title: /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
@@ -3835,11 +4134,12 @@ var init_fundingComparison_script = __esm({
3835
4134
  init_utils();
3836
4135
  init_useEXchanges();
3837
4136
  useFundingComparisonScript = () => {
3838
- const { pagination } = usePagination({ pageSize: 10 });
4137
+ const { pagination } = usePagination({ pageSize: 100 });
3839
4138
  const { onSort, getSortedList } = useSort();
3840
4139
  const { searchValue } = useMarketsContext();
3841
4140
  const { exchanges, brokerName } = useEXchanges();
3842
4141
  const fundingRates = useFundingRates();
4142
+ const [markets] = useMarkets(MarketsType.ALL);
3843
4143
  const { data, isLoading } = useQuery("/v1/public/market_info/funding_comparison");
3844
4144
  const { data: futures } = useMarketsStream();
3845
4145
  const processedData = useMemo(() => {
@@ -3848,8 +4148,10 @@ var init_fundingComparison_script = __esm({
3848
4148
  }
3849
4149
  return data.map((row) => {
3850
4150
  const target = futures?.find((item) => item.symbol === row.symbol);
4151
+ const marketMeta = markets?.find((item) => item.symbol === row.symbol);
3851
4152
  const result = {
3852
4153
  symbol: row.symbol,
4154
+ leverage: marketMeta?.leverage,
3853
4155
  openInterest: target ? getOpenInterest(
3854
4156
  target?.open_interest,
3855
4157
  target?.index_price
@@ -3884,7 +4186,7 @@ var init_fundingComparison_script = __esm({
3884
4186
  }
3885
4187
  return result;
3886
4188
  });
3887
- }, [data, futures, fundingRates, exchanges, brokerName]);
4189
+ }, [data, futures, markets, fundingRates, exchanges, brokerName]);
3888
4190
  const filteredData = useMemo(() => {
3889
4191
  return searchBySymbol(processedData, searchValue, "base-type");
3890
4192
  }, [processedData, searchValue, pagination]);
@@ -4079,7 +4381,7 @@ var init_column4 = __esm({
4079
4381
  getLastColumn(),
4080
4382
  get24hPercentageColumn(),
4081
4383
  {
4082
- title: t("common.volume"),
4384
+ title: t("markets.column.24hVol"),
4083
4385
  dataIndex: "24h_amount",
4084
4386
  align: "right",
4085
4387
  onSort: true,
@@ -4195,7 +4497,7 @@ var init_dropDownMarkets_ui = __esm({
4195
4497
  const { activeTab, onTabChange, tabSort, onTabSort } = props;
4196
4498
  const { t } = useTranslation();
4197
4499
  const getColumns = useDropDownMarketsColumns();
4198
- const search = /* @__PURE__ */ jsxs(Flex, { mx: 3, gapX: 3, pt: 3, pb: 2, children: [
4500
+ const search = /* @__PURE__ */ jsxs(Flex, { className: "oui-dropDownMarkets-search", mx: 3, gapX: 3, pt: 3, pb: 2, children: [
4199
4501
  /* @__PURE__ */ jsx(
4200
4502
  SearchInput,
4201
4503
  {
@@ -4208,7 +4510,7 @@ var init_dropDownMarkets_ui = __esm({
4208
4510
  CloseIcon,
4209
4511
  {
4210
4512
  size: 12,
4211
- className: "oui-cursor-pointer oui-text-base-contrast-80",
4513
+ className: "oui-dropDownMarkets-close-btn oui-cursor-pointer oui-text-base-contrast-80",
4212
4514
  onClick: props.hide,
4213
4515
  opacity: 1
4214
4516
  }
@@ -4225,7 +4527,7 @@ var init_dropDownMarkets_ui = __esm({
4225
4527
  onSort: onTabSort(type),
4226
4528
  getColumns,
4227
4529
  tableClassNames: {
4228
- root: "!oui-bg-base-8",
4530
+ root: cn("oui-dropDownMarkets-list", "!oui-bg-base-8"),
4229
4531
  scroll: "oui-pb-5 oui-px-1"
4230
4532
  },
4231
4533
  rowClassName: "!oui-h-[34px]",
@@ -4242,7 +4544,10 @@ var init_dropDownMarkets_ui = __esm({
4242
4544
  return /* @__PURE__ */ jsxs(
4243
4545
  Box,
4244
4546
  {
4245
- className: cn("oui-overflow-hidden oui-font-semibold"),
4547
+ className: cn(
4548
+ "oui-markets-dropDownMarkets",
4549
+ "oui-overflow-hidden oui-font-semibold"
4550
+ ),
4246
4551
  height: "100%",
4247
4552
  intensity: 800,
4248
4553
  children: [
@@ -4258,20 +4563,68 @@ var init_dropDownMarkets_ui = __esm({
4258
4563
  tabsList: "oui-my-[6px] oui-px-3",
4259
4564
  tabsContent: "oui-h-full"
4260
4565
  },
4261
- className: cls3,
4566
+ className: cn("oui-dropDownMarkets-tabs", cls3),
4262
4567
  children: [
4263
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(FavoritesIcon, {}), value: "favorites" /* Favorites */, children: renderTab("favorites" /* Favorites */) }),
4264
- /* @__PURE__ */ jsx(TabPanel, { title: t("common.all"), value: "all" /* All */, children: renderTab("all" /* All */) }),
4265
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaTab, {}), value: "rwa" /* Rwa */, children: renderTab("rwa" /* Rwa */) }),
4266
4568
  /* @__PURE__ */ jsx(
4267
4569
  TabPanel,
4268
4570
  {
4571
+ classNames: {
4572
+ trigger: "oui-tabs-favorites-trigger",
4573
+ content: "oui-tabs-favorites-content"
4574
+ },
4575
+ title: /* @__PURE__ */ jsx(FavoritesIcon, {}),
4576
+ value: "favorites" /* Favorites */,
4577
+ children: renderTab("favorites" /* Favorites */)
4578
+ }
4579
+ ),
4580
+ /* @__PURE__ */ jsx(
4581
+ TabPanel,
4582
+ {
4583
+ classNames: {
4584
+ trigger: "oui-tabs-all-trigger",
4585
+ content: "oui-tabs-all-content"
4586
+ },
4587
+ title: t("common.all"),
4588
+ value: "all" /* All */,
4589
+ children: renderTab("all" /* All */)
4590
+ }
4591
+ ),
4592
+ /* @__PURE__ */ jsx(
4593
+ TabPanel,
4594
+ {
4595
+ classNames: {
4596
+ trigger: "oui-tabs-rwa-trigger",
4597
+ content: "oui-tabs-rwa-content"
4598
+ },
4599
+ title: /* @__PURE__ */ jsx(RwaTab, {}),
4600
+ value: "rwa" /* Rwa */,
4601
+ children: renderTab("rwa" /* Rwa */)
4602
+ }
4603
+ ),
4604
+ /* @__PURE__ */ jsx(
4605
+ TabPanel,
4606
+ {
4607
+ classNames: {
4608
+ trigger: "oui-tabs-newListings-trigger",
4609
+ content: "oui-tabs-newListings-content"
4610
+ },
4269
4611
  title: t("markets.newListings"),
4270
4612
  value: "newListing" /* NewListing */,
4271
4613
  children: renderTab("newListing" /* NewListing */)
4272
4614
  }
4273
4615
  ),
4274
- /* @__PURE__ */ jsx(TabPanel, { title: t("markets.recent"), value: "recent" /* Recent */, children: renderTab("recent" /* Recent */) })
4616
+ /* @__PURE__ */ jsx(
4617
+ TabPanel,
4618
+ {
4619
+ classNames: {
4620
+ trigger: "oui-tabs-recent-trigger",
4621
+ content: "oui-tabs-recent-content"
4622
+ },
4623
+ title: t("markets.recent"),
4624
+ value: "recent" /* Recent */,
4625
+ children: renderTab("recent" /* Recent */)
4626
+ }
4627
+ )
4275
4628
  ]
4276
4629
  }
4277
4630
  )
@@ -4800,6 +5153,10 @@ var init_funding_mobile_ui = __esm({
4800
5153
  /* @__PURE__ */ jsx(
4801
5154
  TabPanel,
4802
5155
  {
5156
+ classNames: {
5157
+ trigger: "oui-tabs-funding-overview-trigger",
5158
+ content: "oui-tabs-funding-overview-content"
5159
+ },
4803
5160
  title: t("common.overview"),
4804
5161
  value: "overview",
4805
5162
  testid: "oui-testid-funding-overview-tab",
@@ -4812,6 +5169,10 @@ var init_funding_mobile_ui = __esm({
4812
5169
  /* @__PURE__ */ jsx(
4813
5170
  TabPanel,
4814
5171
  {
5172
+ classNames: {
5173
+ trigger: "oui-tabs-funding-comparison-trigger",
5174
+ content: "oui-tabs-funding-comparison-content"
5175
+ },
4815
5176
  title: t("markets.funding.comparison"),
4816
5177
  value: "comparison",
4817
5178
  testid: "oui-testid-funding-comparison-tab",
@@ -4883,6 +5244,10 @@ var init_funding_ui = __esm({
4883
5244
  /* @__PURE__ */ jsx(
4884
5245
  TabPanel,
4885
5246
  {
5247
+ classNames: {
5248
+ trigger: "oui-tabs-funding-overview-trigger",
5249
+ content: "oui-tabs-funding-overview-content"
5250
+ },
4886
5251
  title: t("common.overview"),
4887
5252
  value: "overview",
4888
5253
  testid: "oui-testid-funding-overview-tab",
@@ -4892,6 +5257,10 @@ var init_funding_ui = __esm({
4892
5257
  /* @__PURE__ */ jsx(
4893
5258
  TabPanel,
4894
5259
  {
5260
+ classNames: {
5261
+ trigger: "oui-tabs-funding-comparison-trigger",
5262
+ content: "oui-tabs-funding-comparison-content"
5263
+ },
4895
5264
  title: t("markets.funding.comparison"),
4896
5265
  value: "comparison",
4897
5266
  testid: "oui-testid-funding-comparison-tab",
@@ -5007,7 +5376,7 @@ var SubMenuMarkets = (props) => {
5007
5376
  Box,
5008
5377
  {
5009
5378
  className: cn(
5010
- "oui-overflow-hidden oui-font-semibold oui-bg-base-9",
5379
+ "oui-subMenuMarkets oui-overflow-hidden oui-bg-base-9 oui-font-semibold",
5011
5380
  className
5012
5381
  ),
5013
5382
  height: "100%",
@@ -5025,45 +5394,82 @@ var SubMenuMarkets = (props) => {
5025
5394
  tabsContent: "oui-h-full",
5026
5395
  scrollIndicator: "oui-mx-1"
5027
5396
  },
5028
- className: cn(cls2, "oui-my-1.5"),
5397
+ className: cn(cls2, "oui-subMenuMarkets-tabs oui-my-1.5"),
5029
5398
  showScrollIndicator: true,
5030
5399
  children: [
5031
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(FavoritesIcon, {}), value: "favorites" /* Favorites */, children: (() => {
5032
- const favProps = getFavoritesProps("favorites" /* Favorites */);
5033
- return /* @__PURE__ */ jsx(
5034
- MarketTabPanel,
5035
- {
5036
- type: "favorites" /* Favorites */,
5037
- getColumns,
5038
- dataFilter: favProps?.dataFilter,
5039
- renderHeader: (favorite) => /* @__PURE__ */ jsx(Box, { className: "oui-px-1 oui-my-1", children: /* @__PURE__ */ jsx(FavoritesTabWidget, { favorite, size: "sm" }) }),
5040
- initialSort: tabSort["favorites" /* Favorites */],
5041
- onSort: onTabSort("favorites" /* Favorites */),
5042
- emptyView: /* @__PURE__ */ jsx(EmptyDataState, {})
5043
- }
5044
- );
5045
- })() }),
5046
- /* @__PURE__ */ jsx(TabPanel, { title: t("common.all"), value: "all" /* All */, children: /* @__PURE__ */ jsx(
5047
- MarketTabPanel,
5400
+ /* @__PURE__ */ jsx(
5401
+ TabPanel,
5402
+ {
5403
+ classNames: {
5404
+ trigger: "oui-tabs-favorites-trigger",
5405
+ content: "oui-tabs-favorites-content"
5406
+ },
5407
+ title: /* @__PURE__ */ jsx(FavoritesIcon, {}),
5408
+ value: "favorites" /* Favorites */,
5409
+ children: (() => {
5410
+ const favProps = getFavoritesProps("favorites" /* Favorites */);
5411
+ return /* @__PURE__ */ jsx(
5412
+ MarketTabPanel,
5413
+ {
5414
+ type: "favorites" /* Favorites */,
5415
+ getColumns,
5416
+ dataFilter: favProps?.dataFilter,
5417
+ renderHeader: (favorite) => /* @__PURE__ */ jsx(Box, { className: "oui-px-1 oui-my-1", children: /* @__PURE__ */ jsx(FavoritesTabWidget, { favorite, size: "sm" }) }),
5418
+ initialSort: tabSort["favorites" /* Favorites */],
5419
+ onSort: onTabSort("favorites" /* Favorites */),
5420
+ emptyView: /* @__PURE__ */ jsx(EmptyDataState, {})
5421
+ }
5422
+ );
5423
+ })()
5424
+ }
5425
+ ),
5426
+ /* @__PURE__ */ jsx(
5427
+ TabPanel,
5048
5428
  {
5049
- type: "all" /* All */,
5050
- getColumns,
5051
- initialSort: tabSort["all" /* All */],
5052
- onSort: onTabSort("all" /* All */)
5429
+ classNames: {
5430
+ trigger: "oui-tabs-all-trigger",
5431
+ content: "oui-tabs-all-content"
5432
+ },
5433
+ title: t("common.all"),
5434
+ value: "all" /* All */,
5435
+ children: /* @__PURE__ */ jsx(
5436
+ MarketTabPanel,
5437
+ {
5438
+ type: "all" /* All */,
5439
+ getColumns,
5440
+ initialSort: tabSort["all" /* All */],
5441
+ onSort: onTabSort("all" /* All */)
5442
+ }
5443
+ )
5053
5444
  }
5054
- ) }),
5055
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaIconTab, {}), value: "rwa" /* Rwa */, children: /* @__PURE__ */ jsx(
5056
- MarketTabPanel,
5445
+ ),
5446
+ /* @__PURE__ */ jsx(
5447
+ TabPanel,
5057
5448
  {
5058
- type: "rwa" /* Rwa */,
5059
- getColumns,
5060
- initialSort: tabSort["rwa" /* Rwa */],
5061
- onSort: onTabSort("rwa" /* Rwa */)
5449
+ classNames: {
5450
+ trigger: "oui-tabs-rwa-trigger",
5451
+ content: "oui-tabs-rwa-content"
5452
+ },
5453
+ title: /* @__PURE__ */ jsx(RwaIconTab, {}),
5454
+ value: "rwa" /* Rwa */,
5455
+ children: /* @__PURE__ */ jsx(
5456
+ MarketTabPanel,
5457
+ {
5458
+ type: "rwa" /* Rwa */,
5459
+ getColumns,
5460
+ initialSort: tabSort["rwa" /* Rwa */],
5461
+ onSort: onTabSort("rwa" /* Rwa */)
5462
+ }
5463
+ )
5062
5464
  }
5063
- ) }),
5465
+ ),
5064
5466
  /* @__PURE__ */ jsx(
5065
5467
  TabPanel,
5066
5468
  {
5469
+ classNames: {
5470
+ trigger: "oui-tabs-newListings-trigger",
5471
+ content: "oui-tabs-newListings-content"
5472
+ },
5067
5473
  title: t("markets.newListings"),
5068
5474
  value: "newListing" /* NewListing */,
5069
5475
  children: /* @__PURE__ */ jsx(
@@ -5077,15 +5483,26 @@ var SubMenuMarkets = (props) => {
5077
5483
  )
5078
5484
  }
5079
5485
  ),
5080
- /* @__PURE__ */ jsx(TabPanel, { title: t("markets.recent"), value: "recent" /* Recent */, children: /* @__PURE__ */ jsx(
5081
- MarketTabPanel,
5486
+ /* @__PURE__ */ jsx(
5487
+ TabPanel,
5082
5488
  {
5083
- type: "recent" /* Recent */,
5084
- getColumns,
5085
- initialSort: tabSort["recent" /* Recent */],
5086
- onSort: onTabSort("recent" /* Recent */)
5489
+ classNames: {
5490
+ trigger: "oui-tabs-recent-trigger",
5491
+ content: "oui-tabs-recent-content"
5492
+ },
5493
+ title: t("markets.recent"),
5494
+ value: "recent" /* Recent */,
5495
+ children: /* @__PURE__ */ jsx(
5496
+ MarketTabPanel,
5497
+ {
5498
+ type: "recent" /* Recent */,
5499
+ getColumns,
5500
+ initialSort: tabSort["recent" /* Recent */],
5501
+ onSort: onTabSort("recent" /* Recent */)
5502
+ }
5503
+ )
5087
5504
  }
5088
- ) })
5505
+ )
5089
5506
  ]
5090
5507
  }
5091
5508
  )
@@ -5231,165 +5648,12 @@ init_searchInput();
5231
5648
  init_useFavoritesExtraProps();
5232
5649
 
5233
5650
  // src/components/marketsSheet/column.tsx
5234
- init_icons();
5235
- init_favoritesDropdownMenu();
5236
- init_rwaDotTooltip();
5237
- init_symbolDisplay();
5651
+ init_column2();
5238
5652
  var getMarketsSheetColumns = (favorite, isFavoriteList = false) => {
5239
5653
  return [
5240
- {
5241
- title: i18n.t("common.symbol"),
5242
- dataIndex: "symbol",
5243
- align: "left",
5244
- onSort: true,
5245
- className: "oui-h-[36px]",
5246
- width: 124,
5247
- render: (value, record) => {
5248
- let favoritesIcon;
5249
- if (!isFavoriteList) {
5250
- favoritesIcon = /* @__PURE__ */ jsx(FavoritesDropdownMenuWidget, { row: record, favorite, children: /* @__PURE__ */ jsx(
5251
- Flex,
5252
- {
5253
- width: 12,
5254
- height: 12,
5255
- justify: "center",
5256
- itemAlign: "center",
5257
- className: "oui-mr-1 oui-cursor-pointer",
5258
- children: record.isFavorite ? /* @__PURE__ */ jsx(FavoritesIcon2, { className: "oui-size-3 oui-text-[rgba(255,154,46,1)]" }) : /* @__PURE__ */ jsx(UnFavoritesIcon2, { className: "oui-size-3 oui-text-base-contrast-36 hover:oui-text-[rgba(255,154,46,1)]" })
5259
- }
5260
- ) });
5261
- }
5262
- return /* @__PURE__ */ jsxs(Flex, { children: [
5263
- favoritesIcon,
5264
- /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "start", gapY: 1, children: [
5265
- /* @__PURE__ */ jsxs(Flex, { gapX: 1, children: [
5266
- /* @__PURE__ */ jsx(TokenIcon, { symbol: record.symbol, className: "oui-size-[18px]" }),
5267
- /* @__PURE__ */ jsx(SymbolDisplay, { formatString: "base", size: "2xs", children: record.symbol }),
5268
- /* @__PURE__ */ jsx(RwaDotTooltip, { record })
5269
- ] }),
5270
- /* @__PURE__ */ jsxs(Badge, { size: "xs", color: "primary", children: [
5271
- record.leverage,
5272
- "x"
5273
- ] })
5274
- ] })
5275
- ] });
5276
- }
5277
- },
5278
- {
5279
- title: i18n.t("markets.column.24hVolOI"),
5280
- dataIndex: "24h_amount",
5281
- align: "right",
5282
- className: "oui-h-[36px]",
5283
- width: 100,
5284
- multiSort: {
5285
- fields: [
5286
- {
5287
- sortKey: "24h_amount",
5288
- label: i18n.t("markets.column.24hVol")
5289
- },
5290
- {
5291
- sortKey: "openInterest",
5292
- label: i18n.t("markets.column.OI")
5293
- }
5294
- ]
5295
- },
5296
- render: (value, record) => /* @__PURE__ */ jsxs(Flex, { direction: "column", itemAlign: "end", gapY: 1, children: [
5297
- /* @__PURE__ */ jsx(Text.numeral, { rule: "human", dp: 2, rm: Decimal.ROUND_DOWN, children: value }),
5298
- /* @__PURE__ */ jsx(
5299
- Text.numeral,
5300
- {
5301
- rule: "human",
5302
- dp: 2,
5303
- rm: Decimal.ROUND_DOWN,
5304
- size: "2xs",
5305
- intensity: 54,
5306
- children: record.openInterest
5307
- }
5308
- )
5309
- ] })
5310
- },
5311
- {
5312
- title: i18n.t("markets.column.last&24hPercentage"),
5313
- dataIndex: "change",
5314
- align: "right",
5315
- onSort: true,
5316
- className: "oui-h-[36px]",
5317
- width: 100,
5318
- render: (value, record) => {
5319
- const onDelSymbol = (e) => {
5320
- favorite.updateSymbolFavoriteState(
5321
- record,
5322
- favorite.selectedFavoriteTab,
5323
- true
5324
- );
5325
- e.stopPropagation();
5326
- };
5327
- const iconCls = "oui-w-4 oui-h-4 oui-text-base-contrast-54 hover:oui-text-base-contrast";
5328
- const actions = /* @__PURE__ */ jsx(
5329
- "div",
5330
- {
5331
- className: cn(
5332
- "oui-absolute oui-right-0 oui-top-[6.5px]",
5333
- "oui-hidden group-hover:oui-block"
5334
- ),
5335
- children: /* @__PURE__ */ jsxs(
5336
- Flex,
5337
- {
5338
- className: cn(
5339
- "oui-inline-flex",
5340
- "oui-bg-primary-darken oui-py-[6px]"
5341
- ),
5342
- r: "base",
5343
- width: 52,
5344
- justify: "center",
5345
- itemAlign: "end",
5346
- gapX: 2,
5347
- children: [
5348
- /* @__PURE__ */ jsx(
5349
- TopIcon,
5350
- {
5351
- className: iconCls,
5352
- onClick: (e) => {
5353
- e.stopPropagation();
5354
- favorite.pinToTop(record);
5355
- }
5356
- }
5357
- ),
5358
- /* @__PURE__ */ jsx(DeleteIcon, { className: iconCls, onClick: onDelSymbol })
5359
- ]
5360
- }
5361
- )
5362
- }
5363
- );
5364
- return /* @__PURE__ */ jsxs("div", { className: "oui-relative", children: [
5365
- isFavoriteList && actions,
5366
- /* @__PURE__ */ jsxs(
5367
- Flex,
5368
- {
5369
- direction: "column",
5370
- justify: "end",
5371
- itemAlign: "end",
5372
- gapY: 1,
5373
- className: cn(isFavoriteList && "group-hover:oui-invisible"),
5374
- children: [
5375
- /* @__PURE__ */ jsx(Text.numeral, { dp: record.quote_dp || 2, size: "2xs", children: record["24h_close"] }),
5376
- /* @__PURE__ */ jsx(
5377
- Text.numeral,
5378
- {
5379
- rule: "percentages",
5380
- coloring: true,
5381
- rm: Decimal.ROUND_DOWN,
5382
- showIdentifier: true,
5383
- size: "2xs",
5384
- children: value
5385
- }
5386
- )
5387
- ]
5388
- }
5389
- )
5390
- ] });
5391
- }
5392
- }
5654
+ getSymbolColumn(favorite, isFavoriteList),
5655
+ get24hVolOIColumn(),
5656
+ getLastAnd24hPercentageColumn(favorite, isFavoriteList)
5393
5657
  ];
5394
5658
  };
5395
5659
  var MarketsSheet = (props) => {
@@ -5406,7 +5670,7 @@ var MarketsSheet = (props) => {
5406
5670
  onSort: onTabSort(type),
5407
5671
  getColumns: getMarketsSheetColumns,
5408
5672
  tableClassNames: {
5409
- root: "!oui-bg-base-8",
5673
+ root: cn("oui-marketsSheet-list", "!oui-bg-base-8"),
5410
5674
  scroll: cn(
5411
5675
  "oui-pb-[env(safe-area-inset-bottom,_20px)]",
5412
5676
  isFavorites ? "oui-h-[calc(100%_-_70px)]" : "oui-h-[calc(100%_-_40px)]"
@@ -5422,33 +5686,78 @@ var MarketsSheet = (props) => {
5422
5686
  }
5423
5687
  );
5424
5688
  };
5425
- return /* @__PURE__ */ jsxs(Box, { height: "100%", className: cn("oui-font-semibold", className), children: [
5426
- /* @__PURE__ */ jsxs(Box, { px: 3, mt: 3, mb: 2, children: [
5427
- /* @__PURE__ */ jsx(Text, { size: "base", intensity: 80, children: t("common.markets") }),
5428
- /* @__PURE__ */ jsx(SearchInput, { classNames: { root: "oui-mt-4" } })
5429
- ] }),
5430
- /* @__PURE__ */ jsxs(
5431
- Tabs,
5432
- {
5433
- variant: "contained",
5434
- size: "md",
5435
- value: props.activeTab,
5436
- onValueChange: props.onTabChange,
5437
- classNames: {
5438
- tabsList: cn("oui-my-[6px]"),
5439
- tabsContent: "oui-h-full",
5440
- scrollIndicator: "oui-mx-3"
5441
- },
5442
- className: "oui-h-[calc(100%_-_92px)]",
5443
- showScrollIndicator: true,
5444
- children: [
5445
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(FavoritesIcon, {}), value: "favorites" /* Favorites */, children: renderTab("favorites" /* Favorites */) }),
5446
- /* @__PURE__ */ jsx(TabPanel, { title: t("common.all"), value: "all" /* All */, children: renderTab("all" /* All */) }),
5447
- /* @__PURE__ */ jsx(TabPanel, { title: /* @__PURE__ */ jsx(RwaTab, {}), value: "rwa" /* Rwa */, children: renderTab("rwa" /* Rwa */) })
5448
- ]
5449
- }
5450
- )
5451
- ] });
5689
+ return /* @__PURE__ */ jsxs(
5690
+ Box,
5691
+ {
5692
+ height: "100%",
5693
+ className: cn("oui-markets-marketsSheet", "oui-font-semibold", className),
5694
+ children: [
5695
+ /* @__PURE__ */ jsxs(Box, { className: "oui-marketsSheet-header", px: 3, mt: 3, mb: 2, children: [
5696
+ /* @__PURE__ */ jsx(Text, { size: "base", intensity: 80, children: t("common.markets") }),
5697
+ /* @__PURE__ */ jsx(
5698
+ SearchInput,
5699
+ {
5700
+ classNames: { root: cn("oui-marketsSheet-search-input", "oui-mt-4") }
5701
+ }
5702
+ )
5703
+ ] }),
5704
+ /* @__PURE__ */ jsxs(
5705
+ Tabs,
5706
+ {
5707
+ variant: "contained",
5708
+ size: "md",
5709
+ value: props.activeTab,
5710
+ onValueChange: props.onTabChange,
5711
+ classNames: {
5712
+ tabsList: cn("oui-my-[6px]"),
5713
+ tabsContent: "oui-h-full",
5714
+ scrollIndicator: "oui-mx-3"
5715
+ },
5716
+ className: cn("oui-marketsSheet-tabs", "oui-h-[calc(100%_-_92px)]"),
5717
+ showScrollIndicator: true,
5718
+ children: [
5719
+ /* @__PURE__ */ jsx(
5720
+ TabPanel,
5721
+ {
5722
+ classNames: {
5723
+ trigger: "oui-tabs-favorites-trigger",
5724
+ content: "oui-tabs-favorites-content"
5725
+ },
5726
+ title: /* @__PURE__ */ jsx(FavoritesIcon, {}),
5727
+ value: "favorites" /* Favorites */,
5728
+ children: renderTab("favorites" /* Favorites */)
5729
+ }
5730
+ ),
5731
+ /* @__PURE__ */ jsx(
5732
+ TabPanel,
5733
+ {
5734
+ classNames: {
5735
+ trigger: "oui-tabs-all-trigger",
5736
+ content: "oui-tabs-all-content"
5737
+ },
5738
+ title: t("common.all"),
5739
+ value: "all" /* All */,
5740
+ children: renderTab("all" /* All */)
5741
+ }
5742
+ ),
5743
+ /* @__PURE__ */ jsx(
5744
+ TabPanel,
5745
+ {
5746
+ classNames: {
5747
+ trigger: "oui-tabs-rwa-trigger",
5748
+ content: "oui-tabs-rwa-content"
5749
+ },
5750
+ title: /* @__PURE__ */ jsx(RwaTab, {}),
5751
+ value: "rwa" /* Rwa */,
5752
+ children: renderTab("rwa" /* Rwa */)
5753
+ }
5754
+ )
5755
+ ]
5756
+ }
5757
+ )
5758
+ ]
5759
+ }
5760
+ );
5452
5761
  };
5453
5762
 
5454
5763
  // src/components/marketsSheet/marketsSheet.script.ts
@@ -6152,7 +6461,7 @@ var ScrollIndicator2 = (props) => {
6152
6461
  onClick?.(leading ? "left" : "right");
6153
6462
  },
6154
6463
  style: {
6155
- background: "linear-gradient(90deg, #07080A 0%, rgba(7, 8, 10, 0.60) 65%, rgba(7, 8, 10, 0.00) 100%)"
6464
+ background: "linear-gradient(90deg, rgb(var(--oui-color-base-10)) 0%, rgba(var(--oui-color-base-10), 0.60) 65%, rgba(var(--oui-color-base-10), 0.00) 100%)"
6156
6465
  },
6157
6466
  className: cn(
6158
6467
  "oui-flex oui-w-[80px] oui-items-center",
@@ -6765,6 +7074,10 @@ var MarketsDesktopContent = (props) => {
6765
7074
  /* @__PURE__ */ jsxs(
6766
7075
  TabPanel,
6767
7076
  {
7077
+ classNames: {
7078
+ trigger: "oui-tabs-markets-trigger",
7079
+ content: "oui-tabs-markets-content"
7080
+ },
6768
7081
  title: t("common.markets"),
6769
7082
  value: "markets" /* Markets */,
6770
7083
  testid: "oui-testid-markets-tab",
@@ -6777,6 +7090,10 @@ var MarketsDesktopContent = (props) => {
6777
7090
  /* @__PURE__ */ jsx(
6778
7091
  TabPanel,
6779
7092
  {
7093
+ classNames: {
7094
+ trigger: "oui-tabs-funding-trigger",
7095
+ content: "oui-tabs-funding-content"
7096
+ },
6780
7097
  title: t("common.funding"),
6781
7098
  value: "funding" /* Funding */,
6782
7099
  testid: "oui-testid-funding-tab",