@lifi/widget 4.3.0 → 4.4.0

package/dist/esm/utils/elements.js

@@ -1,10 +1,17 @@
 //#region src/utils/elements.ts
+let ElementId = /* @__PURE__ */ function(ElementId) {
+	ElementId["AppExpandedContainer"] = "widget-app-expanded-container";
+	ElementId["Header"] = "widget-header";
+	ElementId["RelativeContainer"] = "widget-relative-container";
+	ElementId["ScrollableContainer"] = "widget-scrollable-container";
+	return ElementId;
+}({});
 const createElementId = (ElementId, elementId) => elementId ? `${ElementId}-${elementId}` : ElementId;
 const getAppContainer = (elementId) => document.getElementById(createElementId("widget-app-expanded-container", elementId));
 const getRelativeContainer = (elementId) => document.getElementById(createElementId("widget-relative-container", elementId));
 const getScrollableContainer = (elementId) => document.getElementById(createElementId("widget-scrollable-container", elementId));
 const getHeaderElement = (elementId) => document.getElementById(createElementId("widget-header", elementId));
 //#endregion
-export { createElementId, getAppContainer, getHeaderElement, getRelativeContainer, getScrollableContainer };
+export { ElementId, createElementId, getAppContainer, getHeaderElement, getRelativeContainer, getScrollableContainer };
 
 //# sourceMappingURL=elements.js.map

package/dist/esm/utils/elements.js.map

@@ -1 +1 @@
-{"version":3,"file":"elements.js","names":[],"sources":["../../../src/utils/elements.ts"],"sourcesContent":["export enum ElementId {\n  AppExpandedContainer = 'widget-app-expanded-container',\n  Header = 'widget-header',\n  RelativeContainer = 'widget-relative-container',\n  ScrollableContainer = 'widget-scrollable-container',\n}\n\nexport const createElementId = (\n  ElementId: ElementId,\n  elementId: string\n): string => (elementId ? `${ElementId}-${elementId}` : ElementId)\n\n// NOTE: The getter functions here are often used with code that can be effected by css changes in the\n//   AppExpandedContainer, RelativeContainer and CssBaselineContainer components as defined in AppContainer.ts\n\nexport const getAppContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.AppExpandedContainer, elementId)\n  )\n\nexport const getRelativeContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.RelativeContainer, elementId)\n  )\n\nexport const getScrollableContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.ScrollableContainer, elementId)\n  )\n\nexport const getHeaderElement = (elementId: string): HTMLElement | null =>\n  document.getElementById(createElementId(ElementId.Header, elementId))\n"],"mappings":";AAOA,MAAa,mBACX,WACA,cACY,YAAY,GAAG,UAAU,GAAG,cAAc;AAKxD,MAAa,mBAAmB,cAC9B,SAAS,eACP,gBAAA,iCAAgD,SAAS,CAC3D;AAEF,MAAa,wBAAwB,cACnC,SAAS,eACP,gBAAA,6BAA6C,SAAS,CACxD;AAEF,MAAa,0BAA0B,cACrC,SAAS,eACP,gBAAA,+BAA+C,SAAS,CAC1D;AAEF,MAAa,oBAAoB,cAC/B,SAAS,eAAe,gBAAA,iBAAkC,SAAS,CAAC"}
+{"version":3,"file":"elements.js","names":[],"sources":["../../../src/utils/elements.ts"],"sourcesContent":["export enum ElementId {\n  AppExpandedContainer = 'widget-app-expanded-container',\n  Header = 'widget-header',\n  RelativeContainer = 'widget-relative-container',\n  ScrollableContainer = 'widget-scrollable-container',\n}\n\nexport const createElementId = (\n  ElementId: ElementId,\n  elementId: string\n): string => (elementId ? `${ElementId}-${elementId}` : ElementId)\n\n// NOTE: The getter functions here are often used with code that can be effected by css changes in the\n//   AppExpandedContainer, RelativeContainer and CssBaselineContainer components as defined in AppContainer.ts\n\nexport const getAppContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.AppExpandedContainer, elementId)\n  )\n\nexport const getRelativeContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.RelativeContainer, elementId)\n  )\n\nexport const getScrollableContainer = (elementId: string): HTMLElement | null =>\n  document.getElementById(\n    createElementId(ElementId.ScrollableContainer, elementId)\n  )\n\nexport const getHeaderElement = (elementId: string): HTMLElement | null =>\n  document.getElementById(createElementId(ElementId.Header, elementId))\n"],"mappings":";AAAA,IAAY,YAAL,yBAAA,WAAA;CACL,UAAA,0BAAA;CACA,UAAA,YAAA;CACA,UAAA,uBAAA;CACA,UAAA,yBAAA;;AACF,EAAA,CAAA,CAAA;AAEA,MAAa,mBACX,WACA,cACY,YAAY,GAAG,UAAU,GAAG,cAAc;AAKxD,MAAa,mBAAmB,cAC9B,SAAS,eACP,gBAAA,iCAAgD,SAAS,CAC3D;AAEF,MAAa,wBAAwB,cACnC,SAAS,eACP,gBAAA,6BAA6C,SAAS,CACxD;AAEF,MAAa,0BAA0B,cACrC,SAAS,eACP,gBAAA,+BAA+C,SAAS,CAC1D;AAEF,MAAa,oBAAoB,cAC/B,SAAS,eAAe,gBAAA,iBAAkC,SAAS,CAAC"}

package/dist/esm/utils/enum.d.ts

@@ -0,0 +1,5 @@
+//#region src/utils/enum.d.ts
+declare const hasEnumFlag: <T extends number | bigint>(flags: T, flag: T) => boolean;
+//#endregion
+export { hasEnumFlag };
+//# sourceMappingURL=enum.d.ts.map

package/dist/esm/utils/enum.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"enum.d.ts","names":[],"sources":["../../../src/utils/enum.ts"],"mappings":";cAAa,cAAe,2BAC1B,OAAO,GACP,MAAM"}

package/dist/esm/utils/fees.d.ts

@@ -0,0 +1,17 @@
+import { RouteExtended, Token } from "@lifi/sdk";
+//#region src/utils/fees.d.ts
+interface FeesBreakdown {
+  amount: bigint;
+  amountUSD: number;
+  token: Token;
+}
+declare const getAccumulatedFeeCostsBreakdown: (route: RouteExtended, included?: boolean) => {
+  gasCosts: FeesBreakdown[];
+  feeCosts: FeesBreakdown[];
+  gasCostUSD: number;
+  feeCostUSD: number;
+  combinedFeesUSD: number;
+};
+//#endregion
+export { FeesBreakdown, getAccumulatedFeeCostsBreakdown };
+//# sourceMappingURL=fees.d.ts.map

package/dist/esm/utils/fees.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fees.d.ts","names":[],"sources":["../../../src/utils/fees.ts"],"mappings":";;UAGiB;EACf;EACA;EACA,OAAO;;cAGI,kCACX,OAAO,eACP;EAEA,UAAU;EACV,UAAU;EACV;EACA;EACA"}

package/dist/esm/utils/format.d.ts

@@ -1,26 +1,26 @@
 //#region src/utils/format.d.ts
 declare const usdDecimals = 2;
 /**
-* Format token amount to at least 6 decimals.
-* @param amount amount to format.
-* @returns formatted amount.
-*/
+ * Format token amount to at least 6 decimals.
+ * @param amount amount to format.
+ * @returns formatted amount.
+ */
 declare function formatTokenAmount(amount: bigint | undefined, decimals: number): string;
 declare function formatSlippage(slippage?: string, defaultValue?: string, returnInitial?: boolean): string;
 /**
-* Formats a user input amount string, normalizing it and optionally limiting decimal places.
-* @param amount - The amount string to format (e.g., '123.45', '1,23', '0..')
-* @param decimals - Maximum number of decimal places to allow. If null, no limit is applied.
-* @param returnInitial - If true, preserves the input format during typing (e.g., keeps trailing dots,
-*                        preserves leading zeros, keeps negative signs). If false (default), cleans up the
-*                        format on blur (removes leading/trailing zeros, removes negative signs).
-* @returns The formatted amount string, or empty string for invalid input.
-*/
+ * Formats a user input amount string, normalizing it and optionally limiting decimal places.
+ * @param amount - The amount string to format (e.g., '123.45', '1,23', '0..')
+ * @param decimals - Maximum number of decimal places to allow. If null, no limit is applied.
+ * @param returnInitial - If true, preserves the input format during typing (e.g., keeps trailing dots,
+ *                        preserves leading zeros, keeps negative signs). If false (default), cleans up the
+ *                        format on blur (removes leading/trailing zeros, removes negative signs).
+ * @returns The formatted amount string, or empty string for invalid input.
+ */
 declare function formatInputAmount(amount: string, decimals?: number | null, returnInitial?: boolean): string;
 declare function formatTokenPrice(amount?: string | bigint, price?: string, decimals?: number): number;
 /**
-* Convert price value to token amount
-*/
+ * Convert price value to token amount
+ */
 declare function priceToTokenAmount(priceValue: string, priceUSD?: string): string;
 declare function formatDuration(seconds: number, locale: string, unitDisplay?: Intl.NumberFormatOptions["unitDisplay"]): string;
 declare function wrapLongWords(text: string): string;

package/dist/esm/utils/format.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"format.d.ts","names":[],"sources":["../../../src/utils/format.ts"],"mappings":";cAEa,WAAA;AAAb;;;;AAAa;AAAb,iBAOgB,iBAAA,CACd,MAAA,sBACA,QAAA;AAAA,iBAWc,cAAA,CACd,QAAA,WACA,YAAA,WACA,aAAA;;;AAdA;AAWF;;;;;;iBAoCgB,iBAAA,CACd,MAAA,UACA,QAAA,kBACA,aAAA;AAAA,iBAqDc,gBAAA,CACd,MAAA,oBACA,KAAA,WACA,QAAA;AA5FA;AAiCF;;AAjCE,iBA2Hc,kBAAA,CACd,UAAA,UACA,QAAA;AAAA,iBA2Bc,cAAA,CACd,OAAA,UACA,MAAA,UACA,WAAA,GAAa,IAAA,CAAK,mBAAA;AAAA,iBAaJ,aAAA,CAAc,IAAA"}
+{"version":3,"file":"format.d.ts","names":[],"sources":["../../../src/utils/format.ts"],"mappings":";cAEa;;;;;;iBAOG,kBACd,4BACA;iBAWc,eACd,mBACA,uBACA;;;;;;;;;;iBAiCc,kBACd,gBACA,0BACA;iBAqDc,iBACd,0BACA,gBACA;;;;iBA+Bc,mBACd,oBACA;iBA2Bc,eACd,iBACA,gBACA,cAAa,KAAK;iBAaJ,cAAc"}

package/dist/esm/utils/getPriceImpact.d.ts

@@ -1,5 +1,4 @@
 import { Token } from "@lifi/sdk";
-
 //#region src/utils/getPriceImpact.d.ts
 interface GetPriceImpactProps {
   fromToken: Token;
@@ -7,12 +6,7 @@ interface GetPriceImpactProps {
   fromAmount?: bigint;
   toAmount?: bigint;
 }
-declare const getPriceImpact: ({
-  fromToken,
-  toToken,
-  fromAmount,
-  toAmount
-}: GetPriceImpactProps) => number;
+declare const getPriceImpact: ({ fromToken, toToken, fromAmount, toAmount }: GetPriceImpactProps) => number;
 //#endregion
 export { getPriceImpact };
 //# sourceMappingURL=getPriceImpact.d.ts.map

package/dist/esm/utils/getPriceImpact.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getPriceImpact.d.ts","names":[],"sources":["../../../src/utils/getPriceImpact.ts"],"mappings":";;;UAGU,mBAAA;EACR,SAAA,EAAW,KAAA;EACX,OAAA,EAAS,KAAA;EACT,UAAA;EACA,QAAA;AAAA;AAAA,cAGW,cAAA;EACX,SAAA;EACA,OAAA;EACA,UAAA;EACA;AAAA,GACC,mBAAA"}
+{"version":3,"file":"getPriceImpact.d.ts","names":[],"sources":["../../../src/utils/getPriceImpact.ts"],"mappings":";;UAGU;EACR,WAAW;EACX,SAAS;EACT;EACA;;cAGW,mBACX,WACA,SACA,YACA,YACC"}

package/dist/esm/utils/input.d.ts

@@ -0,0 +1,5 @@
+//#region src/utils/input.d.ts
+declare const fitInputText: (maxFontSize: number, minFontSize: number, element: HTMLElement) => void;
+//#endregion
+export { fitInputText };
+//# sourceMappingURL=input.d.ts.map

package/dist/esm/utils/input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.d.ts","names":[],"sources":["../../../src/utils/input.ts"],"mappings":";cAAa,eACX,qBACA,qBACA,SAAS"}

package/dist/esm/utils/navigationRoutes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"navigationRoutes.d.ts","names":[],"sources":["../../../src/utils/navigationRoutes.ts"],"mappings":";cAAa,gBAAA;EACX,IAAA;EACA,UAAA;EACA,OAAA;EACA,SAAA;EACA,SAAA;EACA,SAAA;EACA,SAAA;EACA,MAAA;EACA,QAAA;EACA,aAAA;EACA,QAAA;EACA,OAAA;EACA,OAAA;EACA,aAAA;EACA,kBAAA;EACA,oBAAA;EACA,YAAA;EACA,SAAA;EACA,aAAA;EACA,gBAAA;EACA,iBAAA;AAAA;AAAA,KAiDG,uBAAA,gBAAuC,gBAAA;AAAA,KAEhC,mBAAA,WACF,gBAAA,EAAkB,uBAAA"}
+{"version":3,"file":"navigationRoutes.d.ts","names":[],"sources":["../../../src/utils/navigationRoutes.ts"],"mappings":";cAAa;EACX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;KAiDG,uCAAuC;KAEhC,8BACF,kBAAkB"}

package/dist/esm/utils/percentFormatter.d.ts

@@ -1,10 +1,10 @@
 //#region src/utils/percentFormatter.d.ts
 /**
-* We use <0.01% for both small positive and negative changes to keep it simple and clear, focusing on minimal impact rather than direction.
-* Examples:
-* +0.007% -> <0.01%
-* -0.003% -> <0.01%
-*/
+ * We use <0.01% for both small positive and negative changes to keep it simple and clear, focusing on minimal impact rather than direction.
+ * Examples:
+ * +0.007% -> <0.01%
+ * -0.003% -> <0.01%
+ */
 declare const percentFormatter: (lng: string | undefined, options: any) => ((value: any) => string);
 //#endregion
 export { percentFormatter };

package/dist/esm/utils/percentFormatter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"percentFormatter.d.ts","names":[],"sources":["../../../src/utils/percentFormatter.ts"],"mappings":";;AAMA;;;;;cAAa,gBAAA,GACX,GAAA,sBACA,OAAA,YACG,KAAA"}
+{"version":3,"file":"percentFormatter.d.ts","names":[],"sources":["../../../src/utils/percentFormatter.ts"],"mappings":";;;;;;;cAMa,mBACX,yBACA,mBACG"}

package/dist/esm/utils/tokenList.js

@@ -2,8 +2,8 @@ import { formatUnits } from "@lifi/sdk";
 //#region src/utils/tokenList.ts
 const sortByBalances = (a, b) => Number.parseFloat(formatUnits(b.amount ?? 0n, b.decimals)) * Number.parseFloat(b.priceUSD ?? "0") - Number.parseFloat(formatUnits(a.amount ?? 0n, a.decimals)) * Number.parseFloat(a.priceUSD ?? "0");
 const sortByVolume = (a, b) => (b.volumeUSD24H ?? 0) - (a.volumeUSD24H ?? 0);
-const processTokenBalances = (isBalanceLoading, noCategories, configTokens, selectedChainId, tokens, tokensWithBalances, isPinnedToken) => {
-	if (isBalanceLoading) if (noCategories) {
+const processTokenList = (withoutBalances, noCategories, configTokens, selectedChainId, tokens, tokensWithBalances, isPinnedToken) => {
+	if (withoutBalances) if (noCategories) {
 		const sortedTokens = [...tokens ?? []].sort(sortByVolume);
 		if (isPinnedToken) {
 			const pinned = [];
@@ -142,6 +142,6 @@ const isSupportedToken = (token) => {
 	return Boolean(token.name && token.symbol && token.priceUSD && token.chainId);
 };
 //#endregion
-export { isSearchMatch, isSupportedToken, processTokenBalances };
+export { isSearchMatch, isSupportedToken, processTokenList };
 
 //# sourceMappingURL=tokenList.js.map

package/dist/esm/utils/tokenList.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokenList.js","names":[],"sources":["../../../src/utils/tokenList.ts"],"sourcesContent":["import {\n  formatUnits,\n  type TokenExtended,\n  type WalletTokenExtended,\n} from '@lifi/sdk'\nimport type { TokenAmount, TokenAmountExtended } from '../types/token.js'\nimport type { WidgetTokens } from '../types/widget.js'\n\nconst sortByBalances = (a: TokenAmount, b: TokenAmount) =>\n  Number.parseFloat(formatUnits(b.amount ?? 0n, b.decimals)) *\n    Number.parseFloat(b.priceUSD ?? '0') -\n  Number.parseFloat(formatUnits(a.amount ?? 0n, a.decimals)) *\n    Number.parseFloat(a.priceUSD ?? '0')\n\nconst sortByVolume = (a: TokenExtended, b: TokenExtended) =>\n  (b.volumeUSD24H ?? 0) - (a.volumeUSD24H ?? 0)\n\nexport const processTokenBalances = (\n  isBalanceLoading: boolean,\n  noCategories: boolean,\n  configTokens?: WidgetTokens,\n  selectedChainId?: number,\n  tokens?: TokenExtended[],\n  tokensWithBalances?: TokenAmount[],\n  isPinnedToken?: (chainId: number, tokenAddress: string) => boolean\n): {\n  processedTokens: TokenAmount[]\n  withCategories: boolean\n  withPinnedTokens: boolean\n} => {\n  if (isBalanceLoading) {\n    if (noCategories) {\n      const sortedTokens = [...(tokens ?? [])].sort(sortByVolume)\n      // Separate pinned tokens\n      if (isPinnedToken) {\n        const pinned: TokenAmount[] = []\n        const notPinned: TokenAmount[] = []\n        for (const token of sortedTokens) {\n          if (isPinnedToken(token.chainId, token.address)) {\n            const pinnedToken = { ...token, pinned: true } as TokenAmount\n            pinned.push(pinnedToken)\n          } else {\n            notPinned.push(token)\n          }\n        }\n        return {\n          processedTokens: [...pinned, ...notPinned],\n          withCategories: false,\n          withPinnedTokens: !!pinned.length,\n        }\n      }\n      return {\n        processedTokens: sortedTokens,\n        withCategories: false,\n        withPinnedTokens: false,\n      }\n    } else {\n      return processedTypedTokens(\n        tokens ?? [],\n        [],\n        selectedChainId,\n        configTokens,\n        isPinnedToken\n      )\n    }\n  }\n\n  const sortedTokensWithBalances = [...(tokensWithBalances ?? [])].sort(\n    sortByBalances\n  )\n\n  const tokensWithBalancesSet = new Set(\n    sortedTokensWithBalances.map(\n      (token) => `${token.chainId}-${token.address.toLowerCase()}`\n    )\n  )\n  const tokensWithoutBalances =\n    tokens\n      ?.filter((token) => {\n        const tokenKey = `${token.chainId}-${token.address.toLowerCase()}`\n        return !tokensWithBalancesSet.has(tokenKey)\n      })\n      .sort(sortByVolume) ?? []\n\n  if (noCategories) {\n    // Separate pinned tokens\n    if (isPinnedToken) {\n      const pinnedWithBalances: TokenAmount[] = []\n      const notPinnedWithBalances: TokenAmount[] = []\n      const pinnedWithoutBalances: TokenAmount[] = []\n      const notPinnedWithoutBalances: TokenAmount[] = []\n\n      for (const token of sortedTokensWithBalances) {\n        if (isPinnedToken(token.chainId, token.address)) {\n          const pinnedToken = { ...token, pinned: true } as TokenAmount\n          pinnedWithBalances.push(pinnedToken)\n        } else {\n          notPinnedWithBalances.push(token)\n        }\n      }\n\n      for (const token of tokensWithoutBalances) {\n        if (isPinnedToken(token.chainId, token.address)) {\n          const pinnedToken = { ...token, pinned: true } as TokenAmount\n          pinnedWithoutBalances.push(pinnedToken)\n        } else {\n          notPinnedWithoutBalances.push(token)\n        }\n      }\n\n      return {\n        processedTokens: [\n          ...pinnedWithBalances,\n          ...pinnedWithoutBalances,\n          ...notPinnedWithBalances,\n          ...notPinnedWithoutBalances,\n        ],\n        withCategories: false,\n        withPinnedTokens:\n          !!pinnedWithBalances.length || !!pinnedWithoutBalances.length,\n      }\n    }\n    return {\n      processedTokens: [...sortedTokensWithBalances, ...tokensWithoutBalances],\n      withCategories: false,\n      withPinnedTokens: false,\n    }\n  } else {\n    return processedTypedTokens(\n      tokensWithoutBalances,\n      sortedTokensWithBalances,\n      selectedChainId,\n      configTokens,\n      isPinnedToken\n    )\n  }\n}\n\n// NB: only for non-all-networks\nconst processedTypedTokens = (\n  tokens: TokenAmount[],\n  tokensWithBalances: TokenAmount[],\n  selectedChainId?: number,\n  configTokens?: WidgetTokens,\n  isPinnedToken?: (chainId: number, tokenAddress: string) => boolean\n) => {\n  const filteredTokensMap = new Map(\n    tokens.map((token) => [token.address, token])\n  )\n\n  const pinnedTokens: TokenAmount[] = []\n  const featuredTokensFromConfig: TokenAmount[] = []\n  const popularTokensFromConfig: TokenAmount[] = []\n\n  ;(['popular', 'featured'] as const).forEach((tokenType) => {\n    const typedTokens = configTokens?.[tokenType]?.filter(\n      (token) => token.chainId === selectedChainId\n    )\n\n    typedTokens?.forEach((token) => {\n      const tokenAmount = { ...token } as TokenAmount\n      tokenAmount[tokenType] = true\n      // Config tokens are explicitly set by integrator, mark as verified\n      tokenAmount.verified = true\n\n      const match = filteredTokensMap.get(token.address)\n      if (match?.priceUSD) {\n        tokenAmount.priceUSD = match.priceUSD\n      }\n      if (!token.logoURI && match?.logoURI) {\n        tokenAmount.logoURI = match.logoURI\n      }\n\n      if (tokenType === 'popular') {\n        popularTokensFromConfig.push(tokenAmount)\n      } else {\n        featuredTokensFromConfig.push(tokenAmount)\n      }\n\n      // Additionally add to pinned tokens if it is pinned\n      const isPinned =\n        isPinnedToken && selectedChainId\n          ? isPinnedToken(selectedChainId, token.address)\n          : false\n      if (isPinned) {\n        const pinnedToken = { ...tokenAmount, pinned: true } as TokenAmount\n        pinnedTokens.push(pinnedToken)\n      }\n    })\n  })\n\n  // Filter out config-added tokens from main list\n  const configTokenAddresses = new Set(\n    [...popularTokensFromConfig, ...featuredTokensFromConfig].map((t) =>\n      t.address.toLowerCase()\n    )\n  )\n\n  const remainingTokens = tokens.filter(\n    (token) => !configTokenAddresses.has(token.address.toLowerCase())\n  )\n\n  const otherTokens: TokenAmount[] = []\n\n  // Separate pinned tokens and categorize remaining tokens\n  for (const token of remainingTokens) {\n    const isPinned =\n      isPinnedToken && selectedChainId\n        ? isPinnedToken(selectedChainId, token.address)\n        : false\n\n    if (isPinned) {\n      const pinnedToken = { ...token, pinned: true } as TokenAmount\n      pinnedTokens.push(pinnedToken)\n    } else if (token.featured) {\n      featuredTokensFromConfig.push(token)\n    } else if (token.popular) {\n      popularTokensFromConfig.push(token)\n    } else {\n      otherTokens.push(token)\n    }\n  }\n\n  // Also check tokens with balances for pinned status\n  const pinnedTokensWithBalances: TokenAmount[] = []\n  const nonPinnedTokensWithBalances: TokenAmount[] = []\n\n  if (isPinnedToken && selectedChainId) {\n    for (const token of tokensWithBalances) {\n      if (isPinnedToken(selectedChainId, token.address)) {\n        const pinnedToken = { ...token, pinned: true } as TokenAmount\n        pinnedTokensWithBalances.push(pinnedToken)\n      } else {\n        nonPinnedTokensWithBalances.push(token)\n      }\n    }\n  } else {\n    nonPinnedTokensWithBalances.push(...tokensWithBalances)\n  }\n\n  const sortedPinnedTokens = [\n    ...pinnedTokens,\n    ...pinnedTokensWithBalances,\n  ].sort(sortByVolume)\n  const sortedFeaturedTokens = [...featuredTokensFromConfig].sort(sortByVolume)\n  const sortedPopularTokens = [...popularTokensFromConfig].sort(sortByVolume)\n  const sortedOtherTokens = [...otherTokens].sort(sortByVolume)\n\n  return {\n    processedTokens: [\n      ...sortedPinnedTokens,\n      ...sortedFeaturedTokens,\n      ...nonPinnedTokensWithBalances,\n      ...sortedPopularTokens,\n      ...sortedOtherTokens,\n    ],\n    withCategories:\n      !!featuredTokensFromConfig.length || !!popularTokensFromConfig.length,\n    withPinnedTokens: !!sortedPinnedTokens.length,\n  }\n}\n\nexport const isSearchMatch = (\n  token: TokenExtended | TokenAmountExtended,\n  search?: string\n): boolean => {\n  if (!search) {\n    return true\n  }\n\n  const searchLowerCase = search.toLowerCase()\n  return (\n    token.name?.toLowerCase().includes(searchLowerCase) ||\n    token.symbol\n      ?.replaceAll('₮', 'T')\n      .toLowerCase()\n      .includes(searchLowerCase) ||\n    token.address?.toLowerCase().includes(searchLowerCase)\n  )\n}\n\nexport const isSupportedToken = (token: WalletTokenExtended): boolean => {\n  return Boolean(token.name && token.symbol && token.priceUSD && token.chainId)\n}\n"],"mappings":";;AAQA,MAAM,kBAAkB,GAAgB,MACtC,OAAO,WAAW,YAAY,EAAE,UAAU,IAAI,EAAE,QAAQ,CAAC,IACvD,OAAO,WAAW,EAAE,YAAY,GAAG,IACrC,OAAO,WAAW,YAAY,EAAE,UAAU,IAAI,EAAE,QAAQ,CAAC,IACvD,OAAO,WAAW,EAAE,YAAY,GAAG;AAEvC,MAAM,gBAAgB,GAAkB,OACrC,EAAE,gBAAgB,MAAM,EAAE,gBAAgB;AAE7C,MAAa,wBACX,kBACA,cACA,cACA,iBACA,QACA,oBACA,kBAKG;CACH,IAAI,kBACF,IAAI,cAAc;EAChB,MAAM,eAAe,CAAC,GAAI,UAAU,CAAC,CAAE,CAAC,CAAC,KAAK,YAAY;EAE1D,IAAI,eAAe;GACjB,MAAM,SAAwB,CAAC;GAC/B,MAAM,YAA2B,CAAC;GAClC,KAAK,MAAM,SAAS,cAClB,IAAI,cAAc,MAAM,SAAS,MAAM,OAAO,GAAG;IAC/C,MAAM,cAAc;KAAE,GAAG;KAAO,QAAQ;IAAK;IAC7C,OAAO,KAAK,WAAW;GACzB,OACE,UAAU,KAAK,KAAK;GAGxB,OAAO;IACL,iBAAiB,CAAC,GAAG,QAAQ,GAAG,SAAS;IACzC,gBAAgB;IAChB,kBAAkB,CAAC,CAAC,OAAO;GAC7B;EACF;EACA,OAAO;GACL,iBAAiB;GACjB,gBAAgB;GAChB,kBAAkB;EACpB;CACF,OACE,OAAO,qBACL,UAAU,CAAC,GACX,CAAC,GACD,iBACA,cACA,aACF;CAIJ,MAAM,2BAA2B,CAAC,GAAI,sBAAsB,CAAC,CAAE,CAAC,CAAC,KAC/D,cACF;CAEA,MAAM,wBAAwB,IAAI,IAChC,yBAAyB,KACtB,UAAU,GAAG,MAAM,QAAQ,GAAG,MAAM,QAAQ,YAAY,GAC3D,CACF;CACA,MAAM,wBACJ,QACI,QAAQ,UAAU;EAClB,MAAM,WAAW,GAAG,MAAM,QAAQ,GAAG,MAAM,QAAQ,YAAY;EAC/D,OAAO,CAAC,sBAAsB,IAAI,QAAQ;CAC5C,CAAC,CAAC,CACD,KAAK,YAAY,KAAK,CAAC;CAE5B,IAAI,cAAc;EAEhB,IAAI,eAAe;GACjB,MAAM,qBAAoC,CAAC;GAC3C,MAAM,wBAAuC,CAAC;GAC9C,MAAM,wBAAuC,CAAC;GAC9C,MAAM,2BAA0C,CAAC;GAEjD,KAAK,MAAM,SAAS,0BAClB,IAAI,cAAc,MAAM,SAAS,MAAM,OAAO,GAAG;IAC/C,MAAM,cAAc;KAAE,GAAG;KAAO,QAAQ;IAAK;IAC7C,mBAAmB,KAAK,WAAW;GACrC,OACE,sBAAsB,KAAK,KAAK;GAIpC,KAAK,MAAM,SAAS,uBAClB,IAAI,cAAc,MAAM,SAAS,MAAM,OAAO,GAAG;IAC/C,MAAM,cAAc;KAAE,GAAG;KAAO,QAAQ;IAAK;IAC7C,sBAAsB,KAAK,WAAW;GACxC,OACE,yBAAyB,KAAK,KAAK;GAIvC,OAAO;IACL,iBAAiB;KACf,GAAG;KACH,GAAG;KACH,GAAG;KACH,GAAG;IACL;IACA,gBAAgB;IAChB,kBACE,CAAC,CAAC,mBAAmB,UAAU,CAAC,CAAC,sBAAsB;GAC3D;EACF;EACA,OAAO;GACL,iBAAiB,CAAC,GAAG,0BAA0B,GAAG,qBAAqB;GACvE,gBAAgB;GAChB,kBAAkB;EACpB;CACF,OACE,OAAO,qBACL,uBACA,0BACA,iBACA,cACA,aACF;AAEJ;AAGA,MAAM,wBACJ,QACA,oBACA,iBACA,cACA,kBACG;CACH,MAAM,oBAAoB,IAAI,IAC5B,OAAO,KAAK,UAAU,CAAC,MAAM,SAAS,KAAK,CAAC,CAC9C;CAEA,MAAM,eAA8B,CAAC;CACrC,MAAM,2BAA0C,CAAC;CACjD,MAAM,0BAAyC,CAAC;CAE/C,CAAE,WAAW,UAAU,CAAC,CAAW,SAAS,cAAc;EAKzD,CAJoB,eAAe,UAAU,EAAE,QAC5C,UAAU,MAAM,YAAY,eAC/B,EAAA,EAEa,SAAS,UAAU;GAC9B,MAAM,cAAc,EAAE,GAAG,MAAM;GAC/B,YAAY,aAAa;GAEzB,YAAY,WAAW;GAEvB,MAAM,QAAQ,kBAAkB,IAAI,MAAM,OAAO;GACjD,IAAI,OAAO,UACT,YAAY,WAAW,MAAM;GAE/B,IAAI,CAAC,MAAM,WAAW,OAAO,SAC3B,YAAY,UAAU,MAAM;GAG9B,IAAI,cAAc,WAChB,wBAAwB,KAAK,WAAW;QAExC,yBAAyB,KAAK,WAAW;GAQ3C,IAHE,iBAAiB,kBACb,cAAc,iBAAiB,MAAM,OAAO,IAC5C,OACQ;IACZ,MAAM,cAAc;KAAE,GAAG;KAAa,QAAQ;IAAK;IACnD,aAAa,KAAK,WAAW;GAC/B;EACF,CAAC;CACH,CAAC;CAGD,MAAM,uBAAuB,IAAI,IAC/B,CAAC,GAAG,yBAAyB,GAAG,wBAAwB,CAAC,CAAC,KAAK,MAC7D,EAAE,QAAQ,YAAY,CACxB,CACF;CAEA,MAAM,kBAAkB,OAAO,QAC5B,UAAU,CAAC,qBAAqB,IAAI,MAAM,QAAQ,YAAY,CAAC,CAClE;CAEA,MAAM,cAA6B,CAAC;CAGpC,KAAK,MAAM,SAAS,iBAMlB,IAJE,iBAAiB,kBACb,cAAc,iBAAiB,MAAM,OAAO,IAC5C,OAEQ;EACZ,MAAM,cAAc;GAAE,GAAG;GAAO,QAAQ;EAAK;EAC7C,aAAa,KAAK,WAAW;CAC/B,OAAO,IAAI,MAAM,UACf,yBAAyB,KAAK,KAAK;MAC9B,IAAI,MAAM,SACf,wBAAwB,KAAK,KAAK;MAElC,YAAY,KAAK,KAAK;CAK1B,MAAM,2BAA0C,CAAC;CACjD,MAAM,8BAA6C,CAAC;CAEpD,IAAI,iBAAiB,iBACnB,KAAK,MAAM,SAAS,oBAClB,IAAI,cAAc,iBAAiB,MAAM,OAAO,GAAG;EACjD,MAAM,cAAc;GAAE,GAAG;GAAO,QAAQ;EAAK;EAC7C,yBAAyB,KAAK,WAAW;CAC3C,OACE,4BAA4B,KAAK,KAAK;MAI1C,4BAA4B,KAAK,GAAG,kBAAkB;CAGxD,MAAM,qBAAqB,CACzB,GAAG,cACH,GAAG,wBACL,CAAC,CAAC,KAAK,YAAY;CACnB,MAAM,uBAAuB,CAAC,GAAG,wBAAwB,CAAC,CAAC,KAAK,YAAY;CAC5E,MAAM,sBAAsB,CAAC,GAAG,uBAAuB,CAAC,CAAC,KAAK,YAAY;CAC1E,MAAM,oBAAoB,CAAC,GAAG,WAAW,CAAC,CAAC,KAAK,YAAY;CAE5D,OAAO;EACL,iBAAiB;GACf,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;GACH,GAAG;EACL;EACA,gBACE,CAAC,CAAC,yBAAyB,UAAU,CAAC,CAAC,wBAAwB;EACjE,kBAAkB,CAAC,CAAC,mBAAmB;CACzC;AACF;AAEA,MAAa,iBACX,OACA,WACY;CACZ,IAAI,CAAC,QACH,OAAO;CAGT,MAAM,kBAAkB,OAAO,YAAY;CAC3C,OACE,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,eAAe,KAClD,MAAM,QACF,WAAW,KAAK,GAAG,CAAC,CACrB,YAAY,CAAC,CACb,SAAS,eAAe,KAC3B,MAAM,SAAS,YAAY,CAAC,CAAC,SAAS,eAAe;AAEzD;AAEA,MAAa,oBAAoB,UAAwC;CACvE,OAAO,QAAQ,MAAM,QAAQ,MAAM,UAAU,MAAM,YAAY,MAAM,OAAO;AAC9E"}
+{"version":3,"file":"tokenList.js","names":[],"sources":["../../../src/utils/tokenList.ts"],"sourcesContent":["import {\n  formatUnits,\n  type TokenExtended,\n  type WalletTokenExtended,\n} from '@lifi/sdk'\nimport type { TokenAmount, TokenAmountExtended } from '../types/token.js'\nimport type { WidgetTokens } from '../types/widget.js'\n\nconst sortByBalances = (a: TokenAmount, b: TokenAmount) =>\n  Number.parseFloat(formatUnits(b.amount ?? 0n, b.decimals)) *\n    Number.parseFloat(b.priceUSD ?? '0') -\n  Number.parseFloat(formatUnits(a.amount ?? 0n, a.decimals)) *\n    Number.parseFloat(a.priceUSD ?? '0')\n\nconst sortByVolume = (a: TokenExtended, b: TokenExtended) =>\n  (b.volumeUSD24H ?? 0) - (a.volumeUSD24H ?? 0)\n\nexport const processTokenList = (\n  withoutBalances: boolean,\n  noCategories: boolean,\n  configTokens?: WidgetTokens,\n  selectedChainId?: number,\n  tokens?: TokenExtended[],\n  tokensWithBalances?: TokenAmount[],\n  isPinnedToken?: (chainId: number, tokenAddress: string) => boolean\n): {\n  processedTokens: TokenAmount[]\n  withCategories: boolean\n  withPinnedTokens: boolean\n} => {\n  if (withoutBalances) {\n    if (noCategories) {\n      const sortedTokens = [...(tokens ?? [])].sort(sortByVolume)\n      // Separate pinned tokens\n      if (isPinnedToken) {\n        const pinned: TokenAmount[] = []\n        const notPinned: TokenAmount[] = []\n        for (const token of sortedTokens) {\n          if (isPinnedToken(token.chainId, token.address)) {\n            const pinnedToken = { ...token, pinned: true } as TokenAmount\n            pinned.push(pinnedToken)\n          } else {\n            notPinned.push(token)\n          }\n        }\n        return {\n          processedTokens: [...pinned, ...notPinned],\n          withCategories: false,\n          withPinnedTokens: !!pinned.length,\n        }\n      }\n      return {\n        processedTokens: sortedTokens,\n        withCategories: false,\n        withPinnedTokens: false,\n      }\n    } else {\n      return processedTypedTokens(\n        tokens ?? [],\n        [],\n        selectedChainId,\n        configTokens,\n        isPinnedToken\n      )\n    }\n  }\n\n  const sortedTokensWithBalances = [...(tokensWithBalances ?? [])].sort(\n    sortByBalances\n  )\n\n  const tokensWithBalancesSet = new Set(\n    sortedTokensWithBalances.map(\n      (token) => `${token.chainId}-${token.address.toLowerCase()}`\n    )\n  )\n  const tokensWithoutBalances =\n    tokens\n      ?.filter((token) => {\n        const tokenKey = `${token.chainId}-${token.address.toLowerCase()}`\n        return !tokensWithBalancesSet.has(tokenKey)\n      })\n      .sort(sortByVolume) ?? []\n\n  if (noCategories) {\n    // Separate pinned tokens\n    if (isPinnedToken) {\n      const pinnedWithBalances: TokenAmount[] = []\n      const notPinnedWithBalances: TokenAmount[] = []\n      const pinnedWithoutBalances: TokenAmount[] = []\n      const notPinnedWithoutBalances: TokenAmount[] = []\n\n      for (const token of sortedTokensWithBalances) {\n        if (isPinnedToken(token.chainId, token.address)) {\n          const pinnedToken = { ...token, pinned: true } as TokenAmount\n          pinnedWithBalances.push(pinnedToken)\n        } else {\n          notPinnedWithBalances.push(token)\n        }\n      }\n\n      for (const token of tokensWithoutBalances) {\n        if (isPinnedToken(token.chainId, token.address)) {\n          const pinnedToken = { ...token, pinned: true } as TokenAmount\n          pinnedWithoutBalances.push(pinnedToken)\n        } else {\n          notPinnedWithoutBalances.push(token)\n        }\n      }\n\n      return {\n        processedTokens: [\n          ...pinnedWithBalances,\n          ...pinnedWithoutBalances,\n          ...notPinnedWithBalances,\n          ...notPinnedWithoutBalances,\n        ],\n        withCategories: false,\n        withPinnedTokens:\n          !!pinnedWithBalances.length || !!pinnedWithoutBalances.length,\n      }\n    }\n    return {\n      processedTokens: [...sortedTokensWithBalances, ...tokensWithoutBalances],\n      withCategories: false,\n      withPinnedTokens: false,\n    }\n  } else {\n    return processedTypedTokens(\n      tokensWithoutBalances,\n      sortedTokensWithBalances,\n      selectedChainId,\n      configTokens,\n      isPinnedToken\n    )\n  }\n}\n\n// NB: only for non-all-networks\nconst processedTypedTokens = (\n  tokens: TokenAmount[],\n  tokensWithBalances: TokenAmount[],\n  selectedChainId?: number,\n  configTokens?: WidgetTokens,\n  isPinnedToken?: (chainId: number, tokenAddress: string) => boolean\n) => {\n  const filteredTokensMap = new Map(\n    tokens.map((token) => [token.address, token])\n  )\n\n  const pinnedTokens: TokenAmount[] = []\n  const featuredTokensFromConfig: TokenAmount[] = []\n  const popularTokensFromConfig: TokenAmount[] = []\n\n  ;(['popular', 'featured'] as const).forEach((tokenType) => {\n    const typedTokens = configTokens?.[tokenType]?.filter(\n      (token) => token.chainId === selectedChainId\n    )\n\n    typedTokens?.forEach((token) => {\n      const tokenAmount = { ...token } as TokenAmount\n      tokenAmount[tokenType] = true\n      // Config tokens are explicitly set by integrator, mark as verified\n      tokenAmount.verified = true\n\n      const match = filteredTokensMap.get(token.address)\n      if (match?.priceUSD) {\n        tokenAmount.priceUSD = match.priceUSD\n      }\n      if (!token.logoURI && match?.logoURI) {\n        tokenAmount.logoURI = match.logoURI\n      }\n\n      if (tokenType === 'popular') {\n        popularTokensFromConfig.push(tokenAmount)\n      } else {\n        featuredTokensFromConfig.push(tokenAmount)\n      }\n\n      // Additionally add to pinned tokens if it is pinned\n      const isPinned =\n        isPinnedToken && selectedChainId\n          ? isPinnedToken(selectedChainId, token.address)\n          : false\n      if (isPinned) {\n        const pinnedToken = { ...tokenAmount, pinned: true } as TokenAmount\n        pinnedTokens.push(pinnedToken)\n      }\n    })\n  })\n\n  // Filter out config-added tokens from main list\n  const configTokenAddresses = new Set(\n    [...popularTokensFromConfig, ...featuredTokensFromConfig].map((t) =>\n      t.address.toLowerCase()\n    )\n  )\n\n  const remainingTokens = tokens.filter(\n    (token) => !configTokenAddresses.has(token.address.toLowerCase())\n  )\n\n  const otherTokens: TokenAmount[] = []\n\n  // Separate pinned tokens and categorize remaining tokens\n  for (const token of remainingTokens) {\n    const isPinned =\n      isPinnedToken && selectedChainId\n        ? isPinnedToken(selectedChainId, token.address)\n        : false\n\n    if (isPinned) {\n      const pinnedToken = { ...token, pinned: true } as TokenAmount\n      pinnedTokens.push(pinnedToken)\n    } else if (token.featured) {\n      featuredTokensFromConfig.push(token)\n    } else if (token.popular) {\n      popularTokensFromConfig.push(token)\n    } else {\n      otherTokens.push(token)\n    }\n  }\n\n  // Also check tokens with balances for pinned status\n  const pinnedTokensWithBalances: TokenAmount[] = []\n  const nonPinnedTokensWithBalances: TokenAmount[] = []\n\n  if (isPinnedToken && selectedChainId) {\n    for (const token of tokensWithBalances) {\n      if (isPinnedToken(selectedChainId, token.address)) {\n        const pinnedToken = { ...token, pinned: true } as TokenAmount\n        pinnedTokensWithBalances.push(pinnedToken)\n      } else {\n        nonPinnedTokensWithBalances.push(token)\n      }\n    }\n  } else {\n    nonPinnedTokensWithBalances.push(...tokensWithBalances)\n  }\n\n  const sortedPinnedTokens = [\n    ...pinnedTokens,\n    ...pinnedTokensWithBalances,\n  ].sort(sortByVolume)\n  const sortedFeaturedTokens = [...featuredTokensFromConfig].sort(sortByVolume)\n  const sortedPopularTokens = [...popularTokensFromConfig].sort(sortByVolume)\n  const sortedOtherTokens = [...otherTokens].sort(sortByVolume)\n\n  return {\n    processedTokens: [\n      ...sortedPinnedTokens,\n      ...sortedFeaturedTokens,\n      ...nonPinnedTokensWithBalances,\n      ...sortedPopularTokens,\n      ...sortedOtherTokens,\n    ],\n    withCategories:\n      !!featuredTokensFromConfig.length || !!popularTokensFromConfig.length,\n    withPinnedTokens: !!sortedPinnedTokens.length,\n  }\n}\n\nexport const isSearchMatch = (\n  token: TokenExtended | TokenAmountExtended,\n  search?: string\n): boolean => {\n  if (!search) {\n    return true\n  }\n\n  const searchLowerCase = search.toLowerCase()\n  return (\n    token.name?.toLowerCase().includes(searchLowerCase) ||\n    token.symbol\n      ?.replaceAll('₮', 'T')\n      .toLowerCase()\n      .includes(searchLowerCase) ||\n    token.address?.toLowerCase().includes(searchLowerCase)\n  )\n}\n\nexport const isSupportedToken = (token: WalletTokenExtended): boolean => {\n  return Boolean(token.name && token.symbol && token.priceUSD && token.chainId)\n}\n"],"mappings":"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"}

package/dist/esm/utils/wallet.d.ts

@@ -0,0 +1,5 @@
+//#region src/utils/wallet.d.ts
+declare const shortenAddress: (address?: string) => string | null;
+//#endregion
+export { shortenAddress };
+//# sourceMappingURL=wallet.d.ts.map

package/dist/esm/utils/wallet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"wallet.d.ts","names":[],"sources":["../../../src/utils/wallet.ts"],"mappings":";cAAa,iBAAkB"}

package/package.json

@@ -1,10 +1,28 @@
 {
   "name": "@lifi/widget",
-  "version": "4.3.0",
+  "version": "4.4.0",
   "description": "LI.FI Widget for cross-chain bridging and swapping. It will drive your multi-chain strategy and attract new users from everywhere.",
   "type": "module",
   "main": "./dist/esm/index.js",
   "types": "./dist/esm/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/esm/index.d.ts",
+      "import": "./dist/esm/index.js",
+      "default": "./dist/esm/index.js"
+    },
+    "./skeleton": {
+      "types": "./dist/esm/components/Skeleton/WidgetSkeleton.d.ts",
+      "import": "./dist/esm/components/Skeleton/WidgetSkeleton.js",
+      "default": "./dist/esm/components/Skeleton/WidgetSkeleton.js"
+    },
+    "./shared": {
+      "types": "./dist/esm/shared.d.ts",
+      "import": "./dist/esm/shared.js",
+      "default": "./dist/esm/shared.js"
+    },
+    "./package.json": "./package.json"
+  },
   "sideEffects": false,
   "author": "Eugene Chybisov <eugene@li.finance>",
   "homepage": "https://github.com/lifinance/widget",
@@ -41,15 +59,15 @@
     "@tanstack/react-router": "^1.170.17",
     "@tanstack/react-virtual": "^3.14.5",
     "eventemitter3": "^5.0.4",
-    "i18next": "^26.3.4",
+    "i18next": "^26.3.6",
     "microdiff": "^1.5.0",
     "motion": "^12.42.2",
-    "react-i18next": "^17.0.8",
-    "react-intersection-observer": "^10.0.3",
+    "react-i18next": "^17.0.9",
+    "react-intersection-observer": "^10.1.0",
     "react-transition-group": "^4.4.5",
     "zustand": "^5.0.14",
-    "@lifi/wallet-management": "4.1.1",
-    "@lifi/widget-provider": "4.2.0"
+    "@lifi/wallet-management": "4.1.2",
+    "@lifi/widget-provider": "4.3.0"
   },
   "peerDependencies": {
     "@tanstack/react-query": ">=5.90.0",
@@ -61,6 +79,9 @@
     "*": {
       "skeleton": [
         "./dist/esm/components/Skeleton/WidgetSkeleton.d.ts"
+      ],
+      "shared": [
+        "./dist/esm/shared.d.ts"
       ]
     }
   },
@@ -78,18 +99,5 @@
     "!*.tmp",
     "!*.env",
     "!tsconfig.json"
-  ],
-  "exports": {
-    ".": {
-      "types": "./dist/esm/index.d.ts",
-      "import": "./dist/esm/index.js",
-      "default": "./dist/esm/index.js"
-    },
-    "./skeleton": {
-      "types": "./dist/esm/components/Skeleton/WidgetSkeleton.d.ts",
-      "import": "./dist/esm/components/Skeleton/WidgetSkeleton.js",
-      "default": "./dist/esm/components/Skeleton/WidgetSkeleton.js"
-    },
-    "./package.json": "./package.json"
-  }
+  ]
 }

package/src/components/RouteCard/RouteTokens.tsx

@@ -9,7 +9,8 @@ export const RouteTokens: React.FC<{
   route: RouteExtended
   showEssentials?: boolean
   defaultExpanded?: boolean
-}> = ({ route, showEssentials, defaultExpanded }) => {
+  fromSlot?: React.ReactNode
+}> = ({ route, showEssentials, defaultExpanded, fromSlot }) => {
   const { mode } = useWidgetConfig()
 
   const fromToken = {
@@ -30,7 +31,7 @@ export const RouteTokens: React.FC<{
 
   return (
     <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>
-      {fromToken ? <Token token={fromToken} /> : null}
+      {fromSlot ?? (fromToken ? <Token token={fromToken} /> : null)}
       <Box
         sx={{
           width: 40,

package/src/components/SendToWallet/SendToWalletButton.tsx

@@ -27,7 +27,16 @@ import {
   SendToWalletRequiredLabelText,
 } from './SendToWalletButton.style.js'
 
-export const SendToWalletButton: React.FC<CardProps> = (props) => {
+export const SendToWalletButton: React.FC<
+  CardProps & {
+    onEditAddress?: (() => void) | null
+    onClearAddress?: () => void
+    // Keep the card visible (and flag it required when empty) even when the
+    // widget's own toAddress requirement is off, e.g. a user-settable checkout
+    // recipient that must be filled before continuing.
+    requireAddress?: boolean
+  }
+> = ({ onEditAddress, onClearAddress, requireAddress, ...props }) => {
   const { t } = useTranslation()
   const navigate = useNavigate()
   const { disabledUI, hiddenUI, toAddress, toAddresses, mode, modeOptions } =
@@ -87,7 +96,15 @@ export const SendToWalletButton: React.FC<CardProps> = (props) => {
 
   const disabledForChanges = Boolean(toAddressFieldValue) && disabledToAddress
 
+  // `onEditAddress === null` renders the card read-only (consumer-controlled,
+  // e.g. a fixed checkout recipient); a function overrides the default route nav.
+  const readOnly = onEditAddress === null || disabledForChanges
+
   const handleOnClick = () => {
+    if (onEditAddress !== undefined) {
+      onEditAddress?.()
+      return
+    }
     navigate({
       to: toAddresses?.length
         ? navigationRoutes.configuredWallets
@@ -97,6 +114,10 @@ export const SendToWalletButton: React.FC<CardProps> = (props) => {
 
   const clearSelectedBookmark: MouseEventHandler<HTMLButtonElement> = (e) => {
     e.stopPropagation()
+    if (onClearAddress) {
+      onClearAddress()
+      return
+    }
     setFieldValue('toAddress', '', { isTouched: true })
     setSelectedBookmark()
   }
@@ -114,8 +135,9 @@ export const SendToWalletButton: React.FC<CardProps> = (props) => {
     return () => clearTimeout(timeout)
   }, [])
 
+  const addressRequired = requireAddress || requiredToAddress
   const isOpenCollapse =
-    !hiddenToAddress && (requiredToAddress || !!toAddressFieldValue)
+    !hiddenToAddress && (addressRequired || !!toAddressFieldValue)
 
   const title =
     mode === 'custom' && modeOptions?.custom?.type === 'deposit'
@@ -131,12 +153,12 @@ export const SendToWalletButton: React.FC<CardProps> = (props) => {
     >
       <Card
         role="button"
-        onClick={disabledForChanges ? undefined : handleOnClick}
+        onClick={readOnly ? undefined : handleOnClick}
         sx={{ width: '100%', ...props.sx }}
       >
         <SendToWalletCardTitleRow>
           <CardTitle sx={{ p: 0 }}>{title}</CardTitle>
-          {requiredToAddress && !toAddressFieldValue ? (
+          {addressRequired && !toAddressFieldValue ? (
             <SendToWalletRequiredLabel variant="warning">
               <WarningRounded sx={{ fontSize: 14 }} />
               <SendToWalletRequiredLabelText type="icon">
@@ -165,7 +187,7 @@ export const SendToWalletButton: React.FC<CardProps> = (props) => {
             subheader={headerSubheader}
             selected={!!toAddressFieldValue || disabledToAddress}
             action={
-              toAddressFieldValue && !disabledForChanges ? (
+              toAddressFieldValue && !readOnly ? (
                 <CardIconButton onClick={clearSelectedBookmark} size="small">
                   <CloseRounded fontSize="inherit" />
                 </CardIconButton>

package/src/components/TransactionCard/ActiveTransactionCard.style.tsx

@@ -22,3 +22,14 @@ export const DeleteButton: React.FC<React.ComponentProps<typeof IconButton>> =
     width: 24,
     height: 24,
   }))
+
+export const RetryButton: React.FC<React.ComponentProps<typeof IconButton>> =
+  styled(IconButton)(({ theme }) => ({
+    fontWeight: 700,
+    fontSize: 12,
+    height: 24,
+    borderRadius: theme.vars.shape.borderRadius,
+    padding: theme.spacing(0.5, 1.5),
+    color: theme.vars.palette.text.primary,
+    backgroundColor: theme.vars.palette.background.paper,
+  }))

package/src/config/version.ts

@@ -1,2 +1,2 @@
 export const name = '@lifi/widget'
-export const version = '4.3.0'
+export const version = '4.4.0'

package/src/hooks/useDisplayedTokens.ts

@@ -0,0 +1,70 @@
+import type { TokenExtended } from '@lifi/sdk'
+import { useMemo } from 'react'
+import type { FormType } from '../stores/form/types.js'
+import { usePinnedTokensStore } from '../stores/pinnedTokens/PinnedTokensStore.js'
+import { isSearchMatch } from '../utils/tokenList.js'
+import { useTokens } from './useTokens.js'
+
+export type IsPinnedToken = (chainId: number, tokenAddress: string) => boolean
+
+// Balance-free core shared by useTokenList and useTokenBalances.
+export const useDisplayedTokens = (
+  selectedChainId?: number,
+  formType?: FormType,
+  isAllNetworks?: boolean,
+  search?: string
+): {
+  allTokens: Record<number, TokenExtended[]> | undefined
+  displayedTokensList: TokenExtended[]
+  isPinnedToken: IsPinnedToken | undefined
+  isTokensLoading: boolean
+  isSearchLoading: boolean
+} => {
+  const {
+    allTokens,
+    isLoading: isTokensLoading,
+    isSearchLoading,
+  } = useTokens(formType, search, isAllNetworks ? undefined : selectedChainId)
+
+  const pinnedTokens = usePinnedTokensStore((state) => state.pinnedTokens)
+
+  const isPinnedToken = useMemo<IsPinnedToken | undefined>(() => {
+    if (isAllNetworks) {
+      const pinnedSet = new Set<string>()
+      Object.entries(pinnedTokens).forEach(([chainIdStr, addresses]) => {
+        const chainId = Number.parseInt(chainIdStr, 10)
+        addresses.forEach((address) => {
+          pinnedSet.add(`${chainId}-${address.toLowerCase()}`)
+        })
+      })
+      return (chainId, tokenAddress) =>
+        pinnedSet.has(`${chainId}-${tokenAddress.toLowerCase()}`)
+    }
+    if (selectedChainId) {
+      const chainPinnedTokens = pinnedTokens[selectedChainId] || []
+      const pinnedSet = new Set(
+        chainPinnedTokens.map((addr) => addr.toLowerCase())
+      )
+      return (chainId, tokenAddress) =>
+        chainId === selectedChainId && pinnedSet.has(tokenAddress.toLowerCase())
+    }
+    return undefined
+  }, [isAllNetworks, selectedChainId, pinnedTokens])
+
+  const displayedTokensList = useMemo(() => {
+    const tokensByChain = isAllNetworks
+      ? Object.values(allTokens ?? {}).flat()
+      : selectedChainId
+        ? allTokens?.[selectedChainId]
+        : undefined
+    return tokensByChain?.filter((t) => isSearchMatch(t, search)) ?? []
+  }, [allTokens, isAllNetworks, selectedChainId, search])
+
+  return {
+    allTokens,
+    displayedTokensList,
+    isPinnedToken,
+    isTokensLoading,
+    isSearchLoading,
+  }
+}

package/src/hooks/useListHeight.ts

@@ -32,6 +32,10 @@ const getContentHeight = (
     console.warn(
       `Can't find ${ElementId.ScrollableContainer} or ${ElementId.Header} id.`
     )
+    // Restore the height we zeroed above before returning early
+    if (listParentElement && oldHeight !== undefined) {
+      listParentElement.style.height = oldHeight
+    }
     return 0
   }
   const { height: containerHeight } = containerElement.getBoundingClientRect()