@orderly.network/vaults 2.8.2 → 2.8.3-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 +200 -226
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.mjs +202 -228
  4. package/dist/index.mjs.map +1 -1
  5. package/dist/styles.css +1 -1
  6. package/package.json +10 -10
package/dist/index.js CHANGED
@@ -2087,22 +2087,37 @@ var init_vaultCard_ui = __esm({
2087
2087
  isButtonsDisabled
2088
2088
  } = props;
2089
2089
  const { t } = i18n.useTranslation();
2090
- const isPreLaunch = vaultInfo.status === "pre_launch";
2091
2090
  const { isMobile } = ui.useScreen();
2092
- const [isExpanded, setIsExpanded] = React.useState(false);
2093
- const [showExpandButton, setShowExpandButton] = React.useState(false);
2094
- const descriptionRef = React.useRef(null);
2095
- React.useEffect(() => {
2096
- if (descriptionRef.current) {
2097
- const lineHeight = 18;
2098
- const maxHeight = lineHeight * 3;
2099
- const actualHeight = descriptionRef.current.scrollHeight;
2100
- setShowExpandButton(actualHeight > maxHeight);
2091
+ const getStatusTag = () => {
2092
+ const { status } = vaultInfo;
2093
+ if (status === "live") {
2094
+ return {
2095
+ text: t("vaults.card.status.active"),
2096
+ color: "#00C076",
2097
+ bgColor: "rgba(0, 192, 118, 0.15)"
2098
+ };
2099
+ } else if (status === "pre_launch") {
2100
+ return {
2101
+ text: t("vaults.card.launchingSoon"),
2102
+ color: "#E88800",
2103
+ bgColor: "rgba(232, 136, 0, 0.15)"
2104
+ };
2105
+ } else if (status === "closing") {
2106
+ return {
2107
+ text: t("vaults.card.status.closing"),
2108
+ color: "#FF6B6B",
2109
+ bgColor: "rgba(255, 107, 107, 0.15)"
2110
+ };
2111
+ } else if (status === "closed") {
2112
+ return {
2113
+ text: t("vaults.card.status.closed"),
2114
+ color: "#999999",
2115
+ bgColor: "rgba(153, 153, 153, 0.15)"
2116
+ };
2101
2117
  }
2102
- }, [description]);
2103
- const handleToggleExpand = () => {
2104
- setIsExpanded(!isExpanded);
2118
+ return null;
2105
2119
  };
2120
+ const statusTag = getStatusTag();
2106
2121
  React.useMemo(() => {
2107
2122
  const chains = Array.isArray(vaultInfo?.supported_chains) ? vaultInfo.supported_chains : [];
2108
2123
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-flex oui-items-center", children: chains.map((chain, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -2122,134 +2137,58 @@ var init_vaultCard_ui = __esm({
2122
2137
  chain.chain_id
2123
2138
  )) });
2124
2139
  }, [vaultInfo.supported_chains, isMobile]);
2125
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-relative oui-h-[388px] oui-overflow-hidden oui-rounded-2xl oui-border oui-border-solid oui-border-white/[0.12] oui-bg-base-9", children: [
2126
- /* @__PURE__ */ jsxRuntime.jsx(
2127
- "img",
2128
- {
2129
- src: "/vaults/vaults-card-bg.png",
2130
- alt: "",
2131
- style: {
2132
- position: "absolute",
2133
- top: 0,
2134
- right: 0,
2135
- width: "100%",
2136
- height: "180px",
2137
- objectFit: "cover",
2138
- objectPosition: "top",
2139
- zIndex: 0
2140
- },
2141
- onError: (e) => {
2142
- e.currentTarget.style.display = "none";
2143
- }
2144
- }
2145
- ),
2146
- /* @__PURE__ */ jsxRuntime.jsx(
2147
- "div",
2148
- {
2149
- className: ui.cn(
2150
- "oui-absolute oui-left-0 oui-top-0 oui-z-20 oui-size-full oui-p-6",
2151
- isExpanded && "oui-overflow-y-auto"
2152
- ),
2153
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-3", children: [
2154
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-2", children: [
2155
- /* @__PURE__ */ jsxRuntime.jsx(
2156
- "img",
2157
- {
2158
- src: icon,
2159
- alt: vaultInfo.broker_id,
2160
- className: "oui-size-8",
2161
- onError: (e) => {
2162
- e.currentTarget.style.display = "none";
2163
- }
2164
- }
2165
- ),
2166
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-[18px] oui-font-semibold oui-text-white", children: title }),
2167
- isPreLaunch && /* @__PURE__ */ jsxRuntime.jsx(
2168
- "div",
2169
- {
2170
- className: "oui-flex oui-items-center oui-gap-[10px] oui-px-2 oui-text-[#E88800]",
2171
- style: {
2172
- height: "18px",
2173
- borderRadius: "4px",
2174
- background: "rgba(232, 136, 0, 0.15)",
2175
- fontSize: "12px",
2176
- fontWeight: 600,
2177
- lineHeight: "18px",
2178
- letterSpacing: "0.36px"
2179
- },
2180
- children: t("vaults.card.launchingSoon")
2181
- }
2182
- ),
2183
- /* @__PURE__ */ jsxRuntime.jsx(
2184
- "div",
2185
- {
2186
- className: "oui-z-50 oui-ml-auto oui-cursor-pointer",
2187
- onClick: openVaultWebsite,
2188
- children: /* @__PURE__ */ jsxRuntime.jsx(
2189
- ui.ArrowRightUpSquareFillIcon,
2190
- {
2191
- color: "white",
2192
- width: 18,
2193
- height: 18,
2194
- viewBox: "0 0 18 18"
2195
- }
2196
- )
2197
- }
2198
- )
2199
- ] }),
2200
- /* @__PURE__ */ jsxRuntime.jsxs(
2140
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-h-[435px] oui-overflow-hidden oui-rounded-2xl oui-bg-base-9", children: /* @__PURE__ */ jsxRuntime.jsx(
2141
+ "div",
2142
+ {
2143
+ className: ui.cn(
2144
+ "oui-absolute oui-left-0 oui-top-0 oui-z-20 oui-size-full oui-p-6",
2145
+ "oui-overflow-y-auto oui-custom-scrollbar"
2146
+ ),
2147
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-2", children: [
2148
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-1", children: [
2149
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-[18px] oui-font-semibold oui-text-white oui-break-words", children: title }),
2150
+ statusTag && /* @__PURE__ */ jsxRuntime.jsx(
2201
2151
  "div",
2202
2152
  {
2203
- className: ui.cn(
2204
- "-oui-mb-1 oui-flex oui-flex-col",
2205
- !isExpanded && "oui-h-[72px]"
2206
- ),
2153
+ className: "oui-flex oui-w-fit oui-items-center oui-gap-[10px] oui-px-2",
2154
+ style: {
2155
+ height: "18px",
2156
+ borderRadius: "4px",
2157
+ background: statusTag.bgColor,
2158
+ color: statusTag.color,
2159
+ fontSize: "12px",
2160
+ fontWeight: 600,
2161
+ lineHeight: "18px",
2162
+ letterSpacing: "0.36px"
2163
+ },
2164
+ children: statusTag.text
2165
+ }
2166
+ )
2167
+ ] }),
2168
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-1", children: [
2169
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-h-[54px]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-2xs oui-font-normal oui-leading-[18px] oui-text-base-contrast-54 oui-line-clamp-3", children: parseMarkdownLinks(description) }) }),
2170
+ /* @__PURE__ */ jsxRuntime.jsxs(
2171
+ "button",
2172
+ {
2173
+ onClick: openVaultWebsite,
2174
+ className: "oui-flex oui-w-fit oui-items-center oui-gap-1 oui-text-xs oui-font-medium",
2175
+ style: { color: "#608CFF" },
2207
2176
  children: [
2177
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("vaults.card.viewMore") }),
2208
2178
  /* @__PURE__ */ jsxRuntime.jsx(
2209
- "div",
2210
- {
2211
- ref: descriptionRef,
2212
- className: ui.cn(
2213
- "oui-text-2xs oui-font-normal oui-leading-[18px] oui-text-base-contrast-54",
2214
- !isExpanded && showExpandButton && "oui-line-clamp-3"
2215
- ),
2216
- children: parseMarkdownLinks(description)
2217
- }
2218
- ),
2219
- showExpandButton && /* @__PURE__ */ jsxRuntime.jsx(
2220
- "button",
2179
+ ui.ArrowRightUpSquareFillIcon,
2221
2180
  {
2222
- onClick: handleToggleExpand,
2223
- className: "oui-self-end oui-inline-flex oui-shrink-0 oui-cursor-pointer oui-items-center oui-gap-0.5 oui-text-[12px] oui-font-medium",
2224
2181
  style: { color: "#608CFF" },
2225
- children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2226
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("vaults.card.less") }),
2227
- /* @__PURE__ */ jsxRuntime.jsx(
2228
- ui.ChevronUpIcon,
2229
- {
2230
- size: 12,
2231
- opacity: 1,
2232
- color: "inherit",
2233
- className: "oui-translate-y-[0.5px]"
2234
- }
2235
- )
2236
- ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2237
- /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("vaults.card.more") }),
2238
- /* @__PURE__ */ jsxRuntime.jsx(
2239
- ui.ChevronDownIcon,
2240
- {
2241
- size: 12,
2242
- opacity: 1,
2243
- color: "inherit",
2244
- className: "oui-translate-y-[0.5px]"
2245
- }
2246
- )
2247
- ] })
2182
+ width: 16,
2183
+ height: 16,
2184
+ viewBox: "0 0 18 18"
2248
2185
  }
2249
2186
  )
2250
2187
  ]
2251
2188
  }
2252
- ),
2189
+ )
2190
+ ] }),
2191
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-6", children: [
2253
2192
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-2", children: [
2254
2193
  /* @__PURE__ */ jsxRuntime.jsx(
2255
2194
  VaultInfoItem,
@@ -2267,15 +2206,17 @@ var init_vaultCard_ui = __esm({
2267
2206
  VaultInfoItem,
2268
2207
  {
2269
2208
  label: t("vaults.card.apy"),
2270
- value: vaultInfo["30d_apy"] > 100 ? ">10000%" : (vaultInfo["30d_apy"] * 100).toFixed(2) + "%",
2209
+ value: vaultInfo.status === "pre_launch" || vaultInfo.vault_age !== null && vaultInfo.vault_age < 30 ? "--" : vaultInfo["30d_apy"] > 100 ? ">10000%" : (vaultInfo["30d_apy"] * 100).toFixed(2) + "%",
2271
2210
  textProps: {
2272
2211
  color: "brand",
2273
2212
  type: "gradient"
2274
- }
2213
+ },
2214
+ showTooltip: vaultInfo.status === "pre_launch" || vaultInfo.vault_age !== null && vaultInfo.vault_age < 30,
2215
+ tooltipContent: "APY is not calculated for vaults that are less than 30 days old."
2275
2216
  }
2276
2217
  )
2277
2218
  ] }),
2278
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-mt-3 oui-flex oui-flex-col oui-items-center oui-gap-2 oui-rounded-lg oui-bg-white/[0.06] oui-p-3", children: [
2219
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-items-center oui-gap-2 oui-rounded-lg oui-bg-white/[0.06] oui-p-3", children: [
2279
2220
  /* @__PURE__ */ jsxRuntime.jsx(
2280
2221
  LpInfoItem,
2281
2222
  {
@@ -2290,7 +2231,9 @@ var init_vaultCard_ui = __esm({
2290
2231
  value: lpInfo.earnings
2291
2232
  }
2292
2233
  )
2293
- ] }),
2234
+ ] })
2235
+ ] }),
2236
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-4 oui-mt-2", children: [
2294
2237
  /* @__PURE__ */ jsxRuntime.jsx(
2295
2238
  LpInfoItem,
2296
2239
  {
@@ -2308,12 +2251,12 @@ var init_vaultCard_ui = __esm({
2308
2251
  }
2309
2252
  )
2310
2253
  ] })
2311
- }
2312
- )
2313
- ] });
2254
+ ] })
2255
+ }
2256
+ ) });
2314
2257
  };
2315
2258
  VaultInfoItem = (props) => {
2316
- const { label, value, textProps } = props;
2259
+ const { label, value, textProps, showTooltip, tooltipContent } = props;
2317
2260
  return /* @__PURE__ */ jsxRuntime.jsxs(
2318
2261
  "div",
2319
2262
  {
@@ -2322,7 +2265,17 @@ var init_vaultCard_ui = __esm({
2322
2265
  "oui-rounded-lg oui-border oui-border-solid oui-border-white/[0.12]"
2323
2266
  ),
2324
2267
  children: [
2325
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-2xs oui-font-normal oui-leading-[18px] oui-text-base-contrast-54", children: label }),
2268
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-1 oui-text-2xs oui-font-normal oui-leading-[18px] oui-text-base-contrast-54", children: [
2269
+ label,
2270
+ showTooltip && tooltipContent && /* @__PURE__ */ jsxRuntime.jsx(ui.Tooltip, { content: tooltipContent, delayDuration: 100, children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
2271
+ ui.InfoCircleIcon,
2272
+ {
2273
+ size: 12,
2274
+ opacity: 0.54,
2275
+ className: "oui-text-base-contrast"
2276
+ }
2277
+ ) }) })
2278
+ ] }),
2326
2279
  textProps.type === "gradient" ? /* @__PURE__ */ jsxRuntime.jsx(
2327
2280
  ui.Text.gradient,
2328
2281
  {
@@ -2422,6 +2375,11 @@ var init_vaults_list = __esm({
2422
2375
  const { t } = i18n.useTranslation();
2423
2376
  const [sortField, setSortField] = React.useState("apy");
2424
2377
  const [sortDirection, setSortDirection] = React.useState("desc");
2378
+ const shouldShowApyTooltip = React.useMemo(() => {
2379
+ return vaults.some(
2380
+ (vault) => vault.status === "pre_launch" || vault.vault_age !== null && vault.vault_age < 30
2381
+ );
2382
+ }, [vaults]);
2425
2383
  const handleSort = (field) => {
2426
2384
  if (sortField === field) {
2427
2385
  setSortDirection(sortDirection === "asc" ? "desc" : "asc");
@@ -2498,17 +2456,34 @@ var init_vaults_list = __esm({
2498
2456
  ]
2499
2457
  }
2500
2458
  ),
2501
- /* @__PURE__ */ jsxRuntime.jsxs(
2502
- "button",
2503
- {
2504
- onClick: () => handleSort("apy"),
2505
- className: "oui-flex oui-items-center oui-text-2xs oui-font-normal oui-text-base-contrast-54 hover:oui-text-base-contrast",
2506
- children: [
2507
- t("vaults.card.apy"),
2508
- /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { field: "apy" })
2509
- ]
2510
- }
2511
- ),
2459
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-1", children: [
2460
+ /* @__PURE__ */ jsxRuntime.jsxs(
2461
+ "button",
2462
+ {
2463
+ onClick: () => handleSort("apy"),
2464
+ className: "oui-flex oui-items-center oui-text-2xs oui-font-normal oui-text-base-contrast-54 hover:oui-text-base-contrast",
2465
+ children: [
2466
+ t("vaults.card.apy"),
2467
+ /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { field: "apy" })
2468
+ ]
2469
+ }
2470
+ ),
2471
+ shouldShowApyTooltip && /* @__PURE__ */ jsxRuntime.jsx(
2472
+ ui.Tooltip,
2473
+ {
2474
+ content: "APY is not calculated for vaults that are less than 30 days old.",
2475
+ delayDuration: 100,
2476
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
2477
+ ui.InfoCircleIcon,
2478
+ {
2479
+ size: 12,
2480
+ opacity: 0.54,
2481
+ className: "oui-text-base-contrast"
2482
+ }
2483
+ ) })
2484
+ }
2485
+ )
2486
+ ] }),
2512
2487
  /* @__PURE__ */ jsxRuntime.jsxs(
2513
2488
  "button",
2514
2489
  {
@@ -2552,9 +2527,39 @@ var init_vaults_list = __esm({
2552
2527
  icon,
2553
2528
  isButtonsDisabled
2554
2529
  } = script;
2555
- const isPreLaunch = vaultInfo.status === "pre_launch";
2530
+ vaultInfo.status === "pre_launch";
2556
2531
  const { isMobile } = ui.useScreen();
2557
- const supportVaultsList = React.useMemo(() => {
2532
+ const getStatusTag = () => {
2533
+ const { status } = vaultInfo;
2534
+ if (status === "live") {
2535
+ return {
2536
+ text: t("vaults.card.status.active"),
2537
+ color: "#00C076",
2538
+ bgColor: "rgba(0, 192, 118, 0.15)"
2539
+ };
2540
+ } else if (status === "pre_launch") {
2541
+ return {
2542
+ text: t("vaults.card.launchingSoon"),
2543
+ color: "#E88800",
2544
+ bgColor: "rgba(232, 136, 0, 0.15)"
2545
+ };
2546
+ } else if (status === "closing") {
2547
+ return {
2548
+ text: t("vaults.card.status.closing"),
2549
+ color: "#FF6B6B",
2550
+ bgColor: "rgba(255, 107, 107, 0.15)"
2551
+ };
2552
+ } else if (status === "closed") {
2553
+ return {
2554
+ text: t("vaults.card.status.closed"),
2555
+ color: "#999999",
2556
+ bgColor: "rgba(153, 153, 153, 0.15)"
2557
+ };
2558
+ }
2559
+ return null;
2560
+ };
2561
+ const statusTag = getStatusTag();
2562
+ React.useMemo(() => {
2558
2563
  const chains = Array.isArray(vaultInfo?.supported_chains) ? vaultInfo.supported_chains : [];
2559
2564
  const ICON_SIZE = isMobile ? 18 : 20;
2560
2565
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-flex oui-items-center", children: chains.map((chain, index) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -2576,80 +2581,49 @@ var init_vaults_list = __esm({
2576
2581
  chain.chain_id
2577
2582
  )) });
2578
2583
  }, [vaultInfo.supported_chains, isMobile]);
2579
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-relative oui-grid oui-grid-cols-[2fr_1fr_1fr_1fr_1fr_1fr_1.5fr] oui-gap-4 oui-rounded-lg oui-border oui-border-solid oui-border-white/[0.12] oui-bg-base-9 oui-px-4 oui-py-4 oui-items-center oui-overflow-hidden", children: [
2580
- /* @__PURE__ */ jsxRuntime.jsx(
2581
- "img",
2582
- {
2583
- src: "/vaults/vaults-list-bg.png",
2584
- alt: "",
2585
- style: {
2586
- position: "absolute",
2587
- top: 0,
2588
- left: 0,
2589
- width: "40%",
2590
- height: "100%",
2591
- objectFit: "cover",
2592
- objectPosition: "left",
2593
- zIndex: 0
2594
- },
2595
- onError: (e) => {
2596
- e.currentTarget.style.display = "none";
2597
- }
2598
- }
2599
- ),
2600
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-relative oui-z-10 oui-flex oui-items-center oui-gap-2", children: [
2601
- /* @__PURE__ */ jsxRuntime.jsx(
2602
- "img",
2603
- {
2604
- src: icon,
2605
- alt: vaultInfo.broker_id,
2606
- className: "oui-size-10 oui-rounded-full",
2607
- onError: (e) => {
2608
- e.currentTarget.style.display = "none";
2584
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-relative oui-grid oui-grid-cols-[2fr_1fr_1fr_1fr_1fr_1fr_1.5fr] oui-gap-4 oui-rounded-2xl oui-bg-base-9 oui-px-4 oui-py-4 oui-items-center oui-overflow-hidden", children: [
2585
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-z-10 oui-flex oui-items-center oui-gap-2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-1", children: [
2586
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-sm oui-font-semibold oui-text-base-contrast", children: title }),
2587
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-wrap oui-items-center oui-gap-2", children: [
2588
+ statusTag && /* @__PURE__ */ jsxRuntime.jsx(
2589
+ "div",
2590
+ {
2591
+ className: "oui-flex oui-items-center oui-gap-[10px] oui-px-2 oui-whitespace-nowrap oui-flex-shrink-0",
2592
+ style: {
2593
+ height: "18px",
2594
+ borderRadius: "4px",
2595
+ background: statusTag.bgColor,
2596
+ color: statusTag.color,
2597
+ fontSize: "12px",
2598
+ fontWeight: 600,
2599
+ lineHeight: "18px",
2600
+ letterSpacing: "0.36px"
2601
+ },
2602
+ children: statusTag.text
2609
2603
  }
2610
- }
2611
- ),
2612
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-col oui-gap-1", children: [
2613
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-text-sm oui-font-semibold oui-text-base-contrast", children: title }),
2614
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-flex-wrap oui-items-center oui-gap-2", children: [
2615
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-flex oui-items-center oui-gap-2 oui-flex-shrink-0", children: supportVaultsList }),
2616
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "oui-flex oui-items-center oui-gap-2 oui-flex-shrink-0", children: [
2617
- /* @__PURE__ */ jsxRuntime.jsx(
2618
- "button",
2619
- {
2620
- onClick: openVaultWebsite,
2621
- className: "oui-flex oui-items-center oui-justify-center oui-flex-shrink-0",
2622
- children: /* @__PURE__ */ jsxRuntime.jsx(
2623
- ui.ArrowRightUpSquareFillIcon,
2624
- {
2625
- className: "oui-text-base-contrast-54",
2626
- width: 14,
2627
- height: 14,
2628
- viewBox: "0 0 18 18"
2629
- }
2630
- )
2631
- }
2632
- ),
2633
- isPreLaunch && /* @__PURE__ */ jsxRuntime.jsx(
2634
- "div",
2635
- {
2636
- className: "oui-flex oui-items-center oui-gap-[10px] oui-px-2 oui-text-[#E88800] oui-whitespace-nowrap oui-flex-shrink-0",
2637
- style: {
2638
- height: "18px",
2639
- borderRadius: "4px",
2640
- background: "rgba(232, 136, 0, 0.15)",
2641
- fontSize: "12px",
2642
- fontWeight: 600,
2643
- lineHeight: "18px",
2644
- letterSpacing: "0.36px"
2645
- },
2646
- children: t("vaults.card.launchingSoon")
2647
- }
2648
- )
2649
- ] })
2650
- ] })
2604
+ ),
2605
+ /* @__PURE__ */ jsxRuntime.jsxs(
2606
+ "button",
2607
+ {
2608
+ onClick: openVaultWebsite,
2609
+ className: "oui-flex oui-items-center oui-gap-1 oui-text-xs oui-font-medium",
2610
+ style: { color: "#608CFF" },
2611
+ children: [
2612
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: t("vaults.card.viewMore") }),
2613
+ /* @__PURE__ */ jsxRuntime.jsx(
2614
+ ui.ArrowRightUpSquareFillIcon,
2615
+ {
2616
+ style: { color: "#608CFF" },
2617
+ width: 16,
2618
+ height: 16,
2619
+ viewBox: "0 0 18 18"
2620
+ }
2621
+ )
2622
+ ]
2623
+ }
2624
+ )
2651
2625
  ] })
2652
- ] }),
2626
+ ] }) }),
2653
2627
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-z-10", children: /* @__PURE__ */ jsxRuntime.jsx(
2654
2628
  ui.Text.numeral,
2655
2629
  {
@@ -2659,7 +2633,7 @@ var init_vaults_list = __esm({
2659
2633
  children: vaultInfo.tvl
2660
2634
  }
2661
2635
  ) }),
2662
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-z-10", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text.gradient, { className: "oui-text-sm oui-font-semibold", color: "brand", children: vaultInfo["30d_apy"] > 100 ? ">10000%" : `${(vaultInfo["30d_apy"] * 100).toFixed(2)}%` }) }),
2636
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-z-10", children: /* @__PURE__ */ jsxRuntime.jsx(ui.Text.gradient, { className: "oui-text-sm oui-font-semibold", color: "brand", children: vaultInfo.status === "pre_launch" || vaultInfo.vault_age !== null && vaultInfo.vault_age < 30 ? "--" : vaultInfo["30d_apy"] > 100 ? ">10000%" : `${(vaultInfo["30d_apy"] * 100).toFixed(2)}%` }) }),
2663
2637
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "oui-relative oui-z-10", children: /* @__PURE__ */ jsxRuntime.jsx(
2664
2638
  ui.Text.numeral,
2665
2639
  {