@skip-go/widget 3.17.4 → 3.18.0

package/build/{index-D7Z7Kxh5.js → index-DGioatDm.js}

@@ -1,5 +1,5 @@
 import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import o, { useState, useMemo, useEffect, useContext, useDebugValue, createElement, useRef, useCallback, Fragment as Fragment$1, memo, startTransition, forwardRef, Suspense } from "react";
+import o, { useState, useMemo, useEffect, useContext, useDebugValue, createElement, useRef, useCallback, Fragment as Fragment$1, useId, memo, startTransition, forwardRef, Suspense } from "react";
 import { Scope } from "react-shadow-scope";
 import { atom as atom$1, useAtomValue, useAtom, useSetAtom, createStore, Provider } from "jotai";
 import NiceModal, { useModal } from "@ebay/nice-modal-react";
@@ -46454,7 +46454,7 @@ function walletConnect(parameters) {
         const optionalChains = config2.chains.map((x2) => x2.id);
         if (!optionalChains.length)
           return;
-        const { EthereumProvider } = await import("./index.es-CNsSzKjI.js").then((n) => n.i);
+        const { EthereumProvider } = await import("./index.es-1jsSkaX7.js").then((n) => n.i);
         return await EthereumProvider.init({
           ...parameters,
           disableProviderPing: true,
@@ -47989,7 +47989,7 @@ const ModalRowItem = ({
   rightContent,
   onClick,
   style,
-  eureka
+  highlightColor
 }) => {
   return /* @__PURE__ */ jsxs(
     StyledModalRowItemContainer,
@@ -48000,7 +48000,7 @@ const ModalRowItem = ({
       onClick,
       gap: 16,
       style,
-      eureka,
+      highlightColor,
       children: [
         typeof leftContent === "string" ? /* @__PURE__ */ jsx(Text, { fontSize: 20, children: leftContent }) : leftContent,
         typeof rightContent === "string" ? /* @__PURE__ */ jsx(Text, { fontSize: 20, children: rightContent }) : rightContent
@@ -48040,31 +48040,9 @@ const StyledModalRowItemContainer = dt(Row)`
       }
     `};
 
-  --eureka-border: conic-gradient(
-    from 90deg at 50% 50%,
-    #49d6dd 0deg,
-    #ff663c 120.6000030040741deg,
-    #d466ff 251.99999570846558deg,
-    #49d6dd 360deg
-  );
-
-  ${({ eureka }) => {
-  return eureka ? lt`
-          &:before {
-            content: "";
-            position: absolute;
-            inset: 0;
-            z-index: -2;
-            padding: 2px;
-            border-radius: 12px;
-            background: var(--eureka-border);
-            -webkit-mask:
-              linear-gradient(#fff 0 0) content-box,
-              linear-gradient(#fff 0 0);
-            mask-composite: exclude;
-          }
-        ` : "";
-}}
+  ${({ highlightColor }) => highlightColor && lt`
+      box-shadow: inset 0 0 0 1.5px ${highlightColor};
+    `}
 `;
 const useIsMobileScreenSize = (size2 = 767) => {
   const [isMobileScreenSize, setIsMobileScreenSize] = useState(
@@ -50283,12 +50261,14 @@ const UnderlineText = dt.u`
 `;
 const PRIVILEGED_ASSETS = ["ATOM", "USDC", "USDT", "ETH", "TIA", "OSMO", "NTRN", "INJ"];
 const assetSymbolsSortedToTopAtom = atom$1(PRIVILEGED_ASSETS);
+const assetAnnotationsAtom = atom$1({});
 const EXCLUDED_TOKEN_COMBINATIONS = [{ id: "SOL", chainIDs: ["solana"] }];
 const useFilteredAssets = ({
   groupedAssetsByRecommendedSymbol,
   searchQuery
 }) => {
   const assetSymbolsSortedToTop = useAtomValue(assetSymbolsSortedToTopAtom);
+  const assetAnnotations = useAtomValue(assetAnnotationsAtom);
   const filteredAssets = useMemo(() => {
     if (!groupedAssetsByRecommendedSymbol) return;
     const sanitizedAssets = groupedAssetsByRecommendedSymbol.map((group) => {
@@ -50306,10 +50286,15 @@ const useFilteredAssets = ({
       var _a, _b;
       return (_b = (_a = asset.id) == null ? void 0 : _a.toLowerCase()) == null ? void 0 : _b.includes(searchLower);
     }).sort((assetA, assetB) => {
+      var _a, _b, _c, _d;
       const exactA = assetA.id.toLowerCase() === searchLower;
       const exactB = assetB.id.toLowerCase() === searchLower;
       if (exactA && !exactB) return -1;
       if (exactB && !exactA) return 1;
+      const pinnedA = Boolean((_b = (_a = assetAnnotations == null ? void 0 : assetAnnotations[assetA.id]) == null ? void 0 : _a.selector) == null ? void 0 : _b.pinToTop);
+      const pinnedB = Boolean((_d = (_c = assetAnnotations == null ? void 0 : assetAnnotations[assetB.id]) == null ? void 0 : _c.selector) == null ? void 0 : _d.pinToTop);
+      if (pinnedA && !pinnedB) return -1;
+      if (pinnedB && !pinnedA) return 1;
       if (assetA.totalUsd !== assetB.totalUsd) {
         return assetB.totalUsd - assetA.totalUsd;
       }
@@ -50325,10 +50310,9 @@ const useFilteredAssets = ({
       if (privB !== -1) return 1;
       return 0;
     });
-  }, [assetSymbolsSortedToTop, groupedAssetsByRecommendedSymbol, searchQuery]);
+  }, [assetSymbolsSortedToTop, assetAnnotations, groupedAssetsByRecommendedSymbol, searchQuery]);
   return filteredAssets;
 };
-const ibcEurekaHighlightedAssetsAtom = atom$1({});
 const hideAssetsUnlessWalletTypeConnectedAtom = atom$1(false);
 const chainIdsSortedToTopAtom = atom$1([]);
 const useFilteredChains = ({
@@ -50345,7 +50329,6 @@ const useFilteredChains = ({
   const cosmosWalletConnected = cosmosWallet !== void 0;
   const filter2 = useAtomValue(filterAtom);
   const filterOut = useAtomValue(filterOutAtom);
-  const ibcEurekaHighlightedAssets = useAtomValue(ibcEurekaHighlightedAssetsAtom);
   const filteredChains = useMemo(() => {
     if (!selectedGroup || !chains2) return;
     const allowedAssets = selectedGroup.assets.filter((asset) => {
@@ -50399,16 +50382,6 @@ const useFilteredChains = ({
       if (amountA !== amountB) {
         return amountB - amountA;
       }
-      const indexA = Object.keys(ibcEurekaHighlightedAssets).indexOf(
-        chainWithAssetA.asset.recommendedSymbol || ""
-      );
-      const indexB = Object.keys(ibcEurekaHighlightedAssets).indexOf(
-        chainWithAssetB.asset.recommendedSymbol || ""
-      );
-      const aIsHighlighted = indexA !== -1;
-      const bIsHighlighted = indexB !== -1;
-      if (aIsHighlighted && !bIsHighlighted) return -1;
-      if (bIsHighlighted && !aIsHighlighted) return 1;
       const privA = chainIdsSortedToTop.indexOf(chainWithAssetA.chainId);
       const privB = chainIdsSortedToTop.indexOf(chainWithAssetB.chainId);
       if (privA !== -1 && privB !== -1) {
@@ -50447,12 +50420,48 @@ const useFilteredChains = ({
     filterOutUnlessUserHasBalance,
     getBalance,
     hideAssetsUnlessWalletTypeConnected,
-    ibcEurekaHighlightedAssets,
     searchQuery,
     selectedGroup
   ]);
   return filteredChains;
 };
+const AssetAnnotationIcon = ({ size: size2 = 16, color }) => {
+  const maskId = useId();
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: size2,
+      height: size2,
+      viewBox: "0 0 40 41",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsxs("mask", { id: maskId, children: [
+          /* @__PURE__ */ jsx("rect", { y: "0.480713", width: "40", height: "40", rx: "20", fill: "white" }),
+          /* @__PURE__ */ jsx(
+            "path",
+            {
+              d: "M18.9042 24.141L17.4816 16.1506V11.6555C17.4816 10.5509 18.3771 9.65552 19.4816 9.65552H20.5182C21.6228 9.65552 22.5182 10.5509 22.5182 11.6555V16.1506L21.0957 24.141H18.9042ZM19.0972 31.3059C17.9926 31.3059 17.0972 30.4105 17.0972 29.3059V28.6975C17.0972 27.5929 17.9926 26.6975 19.0972 26.6975H20.9027C22.0073 26.6975 22.9027 27.5929 22.9027 28.6975V29.3059C22.9027 30.4105 22.0073 31.3059 20.9027 31.3059H19.0972Z",
+              fill: "black"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("rect", { y: "0.480713", width: "40", height: "40", rx: "20", fill: color, mask: `url(#${maskId})` })
+      ]
+    }
+  );
+};
+const getAnnotationColors = (theme, variant = "info") => {
+  switch (variant) {
+    case "warning":
+      return { accent: theme.warning.text };
+    case "error":
+      return { accent: theme.error.text };
+    case "info":
+    default:
+      return { accent: theme.brandColor };
+  }
+};
 const isGroupedAsset = (item) => {
   return item.chains !== void 0;
 };
@@ -50462,19 +50471,31 @@ const AssetAndChainSelectorModalRowItem = ({
   skeleton,
   onSelect,
   context,
-  eureka
+  annotation
 }) => {
   const { isFetching, isPending } = useAtomValue(skipChainsAtom);
   const isChainsLoading = isFetching && isPending;
   const getBalance = useGetBalance();
+  const theme = nt();
   if (!item || isChainsLoading) return skeleton;
+  const selectorAnnotation = annotation == null ? void 0 : annotation.selector;
+  const accentColor = selectorAnnotation ? getAnnotationColors(theme, annotation.variant).accent : void 0;
+  const borderColor = accentColor ? `${accentColor}80` : void 0;
   if (isGroupedAsset(item)) {
     return /* @__PURE__ */ jsx(
       ModalRowItem,
       {
         onClick: () => onSelect(item),
-        leftContent: /* @__PURE__ */ jsx(GroupedAssetRow, { item, context, eureka }),
-        eureka,
+        leftContent: /* @__PURE__ */ jsx(
+          GroupedAssetRow,
+          {
+            item,
+            context,
+            annotation,
+            accentColor
+          }
+        ),
+        highlightColor: borderColor,
         rightContent: Number(item.totalAmount) > 0 && /* @__PURE__ */ jsxs(Column, { align: "flex-end", children: [
           /* @__PURE__ */ jsx(SmallText, { normalTextColor: true, children: formatDisplayAmount(item.formattedTotalAmount) }),
           Number(item.totalUsd) > 0 && /* @__PURE__ */ jsx(SmallText, { children: formatUSD(item.totalUsd) })
@@ -50487,9 +50508,9 @@ const AssetAndChainSelectorModalRowItem = ({
   return /* @__PURE__ */ jsx(
     ModalRowItem,
     {
-      eureka,
+      highlightColor: borderColor,
       onClick: () => onSelect(item.asset),
-      leftContent: /* @__PURE__ */ jsx(ChainWithAssetRow, { item, eureka }),
+      leftContent: /* @__PURE__ */ jsx(ChainWithAssetRow, { item, annotation, accentColor }),
       rightContent: balance && Number(balance.amount) > 0 && /* @__PURE__ */ jsxs(Column, { align: "flex-end", children: [
         /* @__PURE__ */ jsx(SmallText, { normalTextColor: true, children: formatDisplayAmount(balance.formattedAmount) }),
         balance.valueUsd && Number(balance.valueUsd) > 0 && /* @__PURE__ */ jsx(SmallText, { children: formatUSD(balance.valueUsd) })
@@ -50501,7 +50522,8 @@ const AssetAndChainSelectorModalRowItem = ({
 const GroupedAssetRow = ({
   item,
   context,
-  eureka
+  annotation,
+  accentColor
 }) => {
   var _a;
   const filteredChains = useFilteredChains({ selectedGroup: item, context }) ?? [];
@@ -50515,11 +50537,16 @@ const GroupedAssetRow = ({
       image: /* @__PURE__ */ jsx(GroupedAssetImage, { height: 35, width: 35, groupedAsset: item }),
       mainText: item.assets[0].recommendedSymbol,
       subText,
-      eureka
+      annotation,
+      accentColor
     }
   );
 };
-const ChainWithAssetRow = ({ item, eureka }) => {
+const ChainWithAssetRow = ({
+  item,
+  annotation,
+  accentColor
+}) => {
   const chainImage = useCroppedImage(item == null ? void 0 : item.logoUri);
   return /* @__PURE__ */ jsx(
     RowLayout,
@@ -50527,31 +50554,57 @@ const ChainWithAssetRow = ({ item, eureka }) => {
       image: chainImage ? /* @__PURE__ */ jsx(StyledChainImage, { height: 35, width: 35, src: chainImage, alt: `${item.chainId} logo` }) : /* @__PURE__ */ jsx(CircleSkeletonElement, { height: 35, width: 35 }),
       mainText: item.prettyName,
       subText: /* @__PURE__ */ jsx(SmallText, { children: item.chainId }),
-      eureka
+      annotation,
+      accentColor
     }
   );
 };
-const RowLayout = ({ image, mainText, subText, eureka }) => {
+const RowLayout = ({ image, mainText, subText, annotation, accentColor }) => {
+  var _a;
   const isMobileScreenSize = useIsMobileScreenSize();
-  return /* @__PURE__ */ jsxs(Row, { align: "center", gap: 8, children: [
+  const description = (_a = annotation == null ? void 0 : annotation.selector) == null ? void 0 : _a.description;
+  return /* @__PURE__ */ jsxs(StyledRowLayout, { align: "center", gap: 8, children: [
     image,
-    /* @__PURE__ */ jsxs(
-      Row,
-      {
-        align: "baseline",
-        flexDirection: isMobileScreenSize ? "column" : "row",
-        gap: isMobileScreenSize ? void 0 : 8,
-        children: [
-          /* @__PURE__ */ jsx(Text, { useWindowsTextHack: true, children: mainText }),
-          /* @__PURE__ */ jsxs(Row, { align: "center", gap: 6, children: [
-            subText,
-            eureka && /* @__PURE__ */ jsx(SmallText, { normalTextColor: true, children: " IBC Eureka " })
-          ] })
-        ]
-      }
-    )
+    /* @__PURE__ */ jsxs(StyledInfoColumn, { gap: 2, children: [
+      /* @__PURE__ */ jsxs(
+        Row,
+        {
+          align: "baseline",
+          flexDirection: isMobileScreenSize && !description ? "column" : "row",
+          gap: isMobileScreenSize && !description ? void 0 : 8,
+          children: [
+            /* @__PURE__ */ jsx(Text, { useWindowsTextHack: true, children: mainText }),
+            subText
+          ]
+        }
+      ),
+      description && accentColor && /* @__PURE__ */ jsxs(StyledDescriptionRow, { align: "center", gap: 4, children: [
+        /* @__PURE__ */ jsx(StyledDescriptionIcon, { children: /* @__PURE__ */ jsx(AssetAnnotationIcon, { size: 14, color: accentColor }) }),
+        /* @__PURE__ */ jsx(StyledDescriptionText, { color: accentColor, children: description })
+      ] })
+    ] })
   ] });
 };
+const StyledRowLayout = dt(Row)`
+  flex: 1;
+  min-width: 0;
+`;
+const StyledInfoColumn = dt(Column)`
+  min-width: 0;
+`;
+const StyledDescriptionRow = dt(Row)`
+  min-width: 0;
+`;
+const StyledDescriptionText = dt(SmallText)`
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;
+const StyledDescriptionIcon = dt.span`
+  display: inline-flex;
+  flex-shrink: 0;
+  margin-top: -2px;
+`;
 const StyledChainImage = dt.img`
   border-radius: 50%;
   object-fit: cover;
@@ -50694,6 +50747,24 @@ const TinyTriangleIcon = ({
     children: /* @__PURE__ */ jsx("path", { d: "M4.44881 6.98877L0.420326 0.0112305L8.47729 0.0112305L4.44881 6.98877Z", fill: color })
   }
 );
+const AssetAnnotationBadge = ({
+  label,
+  variant
+}) => {
+  const theme = nt();
+  const { accent } = getAnnotationColors(theme, variant);
+  return /* @__PURE__ */ jsx(StyledBadge, { accent, children: label });
+};
+const StyledBadge = dt.span`
+  padding: 2px 7px;
+  border-radius: 8px;
+  font-size: 11px;
+  line-height: 1.4;
+  white-space: nowrap;
+  color: ${({ accent }) => accent};
+  background: transparent;
+  border: 1px solid ${({ accent }) => `${accent}66`};
+`;
 const SwapPageAssetChainInput = ({
   value,
   usdValue,
@@ -50708,7 +50779,7 @@ const SwapPageAssetChainInput = ({
   feeLabel,
   feeWarning
 }) => {
-  var _a;
+  var _a, _b;
   const theme = nt();
   const [_showPriceChangePercentage, setShowPriceChangePercentage] = useState(false);
   const isMobileScreenSize = useIsMobileScreenSize();
@@ -50725,6 +50796,10 @@ const SwapPageAssetChainInput = ({
       return group.id === ((_a2 = assetDetails.asset) == null ? void 0 : _a2.recommendedSymbol);
     }
   );
+  const assetAnnotations = useAtomValue(assetAnnotationsAtom);
+  const annotation = ((_a = assetDetails.asset) == null ? void 0 : _a.recommendedSymbol) ? assetAnnotations == null ? void 0 : assetAnnotations[assetDetails.asset.recommendedSymbol] : void 0;
+  const swapPageAnnotation = annotation == null ? void 0 : annotation.swapPage;
+  const annotationAccent = getAnnotationColors(theme, annotation == null ? void 0 : annotation.variant).accent;
   const handleInputChange = (e) => {
     if (!onChangeValue) return;
     let latest = e.target.value;
@@ -50823,6 +50898,7 @@ const SwapPageAssetChainInput = ({
             assetDetails.symbol ? /* @__PURE__ */ jsxs(StyledAssetLabel, { align: "center", justify: "center", gap: 7, children: [
               /* @__PURE__ */ jsx(GroupedAssetImage, { height: 23, width: 23, groupedAsset }),
               /* @__PURE__ */ jsx(Text, { useWindowsTextHack: true, children: assetDetails.symbol }),
+              swapPageAnnotation && /* @__PURE__ */ jsx(AssetAnnotationIcon, { size: 16, color: annotationAccent }),
               isMobileScreenSize && /* @__PURE__ */ jsx(
                 ChevronIcon,
                 {
@@ -50850,7 +50926,7 @@ const SwapPageAssetChainInput = ({
                 className: "chevron-icon",
                 color: theme.primary.text.normal,
                 backgroundColor: isAssetButtonHovered ? theme.secondary.background.hover : theme.secondary.background.normal,
-                backgroundRx: (_a = theme.borderRadius) == null ? void 0 : _a.selectionButton
+                backgroundRx: (_b = theme.borderRadius) == null ? void 0 : _b.selectionButton
               }
             )
           ]
@@ -50883,26 +50959,36 @@ const SwapPageAssetChainInput = ({
         ] }) : /* @__PURE__ */ jsx(SmallText, { children: usdValue && formatUSD(usdValue) }),
         usdValue && feeLabel && /* @__PURE__ */ jsx(Row, { style: { color: feeColor }, align: "center", gap: 4, children: typeof feeLabel === "string" ? /* @__PURE__ */ jsx(SmallText, { children: feeLabel }) : feeLabel })
       ] }),
-      (assetDetails == null ? void 0 : assetDetails.chainName) ? /* @__PURE__ */ jsx(
-        StyledOnChainGhostButton,
-        {
-          disabled,
-          onClick: handleChangeChain,
-          align: "center",
-          secondary: true,
-          gap: 4,
-          children: /* @__PURE__ */ jsxs(SmallText, { children: [
-            "on ",
-            assetDetails == null ? void 0 : assetDetails.chainName
-          ] })
-        }
-      ) : /* @__PURE__ */ jsx(Spacer, {})
+      (assetDetails == null ? void 0 : assetDetails.chainName) ? /* @__PURE__ */ jsxs(Row, { align: "center", gap: 6, children: [
+        swapPageAnnotation && /* @__PURE__ */ jsx(
+          AssetAnnotationBadge,
+          {
+            label: swapPageAnnotation.label,
+            variant: annotation == null ? void 0 : annotation.variant
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          StyledOnChainGhostButton,
+          {
+            disabled,
+            onClick: handleChangeChain,
+            align: "center",
+            secondary: true,
+            gap: 4,
+            children: /* @__PURE__ */ jsxs(SmallText, { children: [
+              "on ",
+              assetDetails == null ? void 0 : assetDetails.chainName
+            ] })
+          }
+        )
+      ] }) : /* @__PURE__ */ jsx(Spacer, {})
     ] })
   ] });
 };
 const StyledOnChainGhostButton = dt(GhostButton)`
+  padding: 4px 8px;
   @media (max-width: 767px) {
-    padding: 0 5px;
+    padding: 2px 6px;
     height: 25px;
   }
   ${({ disabled }) => disabled && "cursor: not-allowed"};
@@ -51001,6 +51087,11 @@ const StyledAssetLabel = dt(Row).attrs({
   p {
     z-index: 1;
   }
+
+  svg {
+    position: relative;
+    z-index: 1;
+  }
 `;
 const StyledSelectTokenLabel = dt(StyledAssetLabel)`
   background: ${(props) => props.theme.brandColor};
@@ -51133,7 +51224,7 @@ const AssetAndChainSelectorModal = createModal(
       isFetching: isFetchingAssets,
       isPending: isPendingAssets
     } = useAtomValue(skipAssetsAtom);
-    const ibcEurekaHighlightedAssets = useAtomValue(ibcEurekaHighlightedAssetsAtom);
+    const assetAnnotations = useAtomValue(assetAnnotationsAtom);
     const { isFetching: isFetchingChains, isPending: isPendingChains } = useAtomValue(skipChainsAtom);
     const isLoading = isFetchingAssets && isPendingAssets || isFetchingChains && isPendingChains;
     const [showSkeleton, setShowSkeleton] = useState(true);
@@ -51209,15 +51300,8 @@ const AssetAndChainSelectorModal = createModal(
     };
     const renderItem = useCallback(
       (item, index) => {
-        var _a, _b;
         const groupedAsset = item;
-        const chainWithAsset = item;
-        const highlightedSymbol = ibcEurekaHighlightedAssets && Object.keys(ibcEurekaHighlightedAssets);
-        const groupedAssetContainsEurekaAsset = highlightedSymbol == null ? void 0 : highlightedSymbol.includes(groupedAsset.id);
-        const chainWithAssetContainsEurekaAsset = ((_a = chainWithAsset == null ? void 0 : chainWithAsset.asset) == null ? void 0 : _a.recommendedSymbol) ? ibcEurekaHighlightedAssets && highlightedSymbol.includes(chainWithAsset.asset.recommendedSymbol) && (ibcEurekaHighlightedAssets == null ? void 0 : ibcEurekaHighlightedAssets[chainWithAsset.asset.recommendedSymbol]) === void 0 ? true : (ibcEurekaHighlightedAssets == null ? void 0 : ibcEurekaHighlightedAssets[chainWithAsset.asset.recommendedSymbol]) && ((_b = ibcEurekaHighlightedAssets == null ? void 0 : ibcEurekaHighlightedAssets[chainWithAsset.asset.recommendedSymbol]) == null ? void 0 : _b.includes(
-          chainWithAsset == null ? void 0 : chainWithAsset.chainId
-        )) : false;
-        const eureka = groupedAssetContainsEurekaAsset || chainWithAssetContainsEurekaAsset;
+        const annotation = assetAnnotations == null ? void 0 : assetAnnotations[groupedAsset.id];
         return /* @__PURE__ */ jsx(
           AssetAndChainSelectorModalRowItem,
           {
@@ -51226,11 +51310,11 @@ const AssetAndChainSelectorModal = createModal(
             onSelect,
             skeleton: /* @__PURE__ */ jsx(Skeleton, {}),
             context,
-            eureka
+            annotation
           }
         );
       },
-      [context, ibcEurekaHighlightedAssets, onSelect]
+      [context, assetAnnotations, onSelect]
     );
     const listOfAssetsOrChains = useMemo(() => {
       if (selectChain || groupedAssetSelected) {
@@ -54593,7 +54677,7 @@ const useConnectToMissingCosmosChain = () => {
   }, [sourceAsset, wallets, extraChainIdsToConnect, addExtraChainIdsToConnectForWalletType]);
   return { isAskingToApproveConnection };
 };
-const version = "3.17.4";
+const version = "3.18.0";
 const packageJson = {
   version
 };
@@ -56258,8 +56342,8 @@ const useInitWidget = (props = {}) => {
   const setSimulateTx = useSetAtom(simulateTxAtom);
   const setBatchSignTxs = useSetAtom(batchSignTxsAtom);
   const setDisableShadowDom = useSetAtom(disableShadowDomAtom);
-  const setIbcEurekaHighlightedAssets = useSetAtom(ibcEurekaHighlightedAssetsAtom);
   const setAssetSymbolsSortedToTop = useSetAtom(assetSymbolsSortedToTopAtom);
+  const setAssetAnnotations = useSetAtom(assetAnnotationsAtom);
   const setHideAssetsUnlessWalletTypeConnected = useSetAtom(
     hideAssetsUnlessWalletTypeConnectedAtom
   );
@@ -56356,12 +56440,12 @@ const useInitWidget = (props = {}) => {
     if (props.disableShadowDom !== void 0) {
       setDisableShadowDom(props.disableShadowDom);
     }
-    if (props.ibcEurekaHighlightedAssets) {
-      setIbcEurekaHighlightedAssets(props.ibcEurekaHighlightedAssets);
-    }
     if (props.assetSymbolsSortedToTop) {
       setAssetSymbolsSortedToTop(props.assetSymbolsSortedToTop);
     }
+    if (props.assetAnnotations) {
+      setAssetAnnotations(props.assetAnnotations);
+    }
     if (props.hideAssetsUnlessWalletTypeConnected) {
       setHideAssetsUnlessWalletTypeConnected(props.hideAssetsUnlessWalletTypeConnected);
     }
@@ -56405,10 +56489,10 @@ const useInitWidget = (props = {}) => {
     props.onRouteUpdated,
     props.disableShadowDom,
     setDisableShadowDom,
-    props.ibcEurekaHighlightedAssets,
-    setIbcEurekaHighlightedAssets,
     props.assetSymbolsSortedToTop,
     setAssetSymbolsSortedToTop,
+    props.assetAnnotations,
+    setAssetAnnotations,
     props.skipExplorerUrl,
     setSkipExplorerUrl,
     props.filterOut,
@@ -56747,7 +56831,7 @@ const WidgetContainer = dt.div`
   }
 
   * {
-    font-family: 'ABCDiatype', sans-serif;
+    font-family: "ABCDiatype", sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     text-rendering: optimizeLegibility;