@rango-dev/widget-embedded 0.60.2-next.0 → 0.60.2-next.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.60.2-next.0",
+  "version": "0.60.2-next.10",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -22,18 +22,21 @@
     "test:coverage": "vitest run --coverage"
   },
   "dependencies": {
+    "@hub3js/core": "^0.60.1",
+    "@hub3js/namespaces": "^0.1.1",
+    "@hub3js/std": "^0.1.1",
     "@lingui/core": "4.2.1",
     "@lingui/react": "4.2.1",
-    "@rango-dev/logging-core": "^0.12.1",
-    "@rango-dev/provider-all": "^0.62.2-next.0",
+    "@rango-dev/logging-core": "^0.12.2-next.0",
+    "@rango-dev/provider-all": "^0.62.2-next.6",
     "@rango-dev/queue-manager-core": "^0.33.0",
-    "@rango-dev/queue-manager-rango-preset": "^0.62.1-next.0",
+    "@rango-dev/queue-manager-rango-preset": "^0.62.1-next.5",
     "@rango-dev/queue-manager-react": "^0.33.0",
     "@rango-dev/signer-solana": "^0.48.0",
-    "@rango-dev/ui": "^0.63.1-next.0",
-    "@rango-dev/wallets-core": "^0.59.1-next.0",
-    "@rango-dev/wallets-react": "^0.46.1-next.0",
-    "@rango-dev/wallets-shared": "^0.60.1-next.0",
+    "@rango-dev/ui": "^0.63.1-next.4",
+    "@rango-dev/wallets-core": "^0.59.1-next.2",
+    "@rango-dev/wallets-react": "^0.46.1-next.4",
+    "@rango-dev/wallets-shared": "^0.60.1-next.3",
     "bignumber.js": "^9.1.1",
     "copy-to-clipboard": "^3.3.3",
     "crypto-browserify": "^3.12.1",

package/src/components/CustomTokenModal/CustomTokenModal.tsx

@@ -13,10 +13,10 @@ import React from 'react';
 
 import { DEFAULT_TOKEN_IMAGE_SRC } from '../../constants/customTokens';
 import { getContainer } from '../../utils/common';
+import { createTokenExplorerUrl } from '../../utils/meta';
 import { WatermarkedModal } from '../common/WatermarkedModal';
 
 import { CUSTOM_TOKEN_LEARN_MORE_LINK } from './CustomTokenModal.constants';
-import { generateExplorerLink } from './CustomTokenModal.helpers';
 import {
   Container,
   FlexCenteredContainer,
@@ -29,7 +29,12 @@ const MAX_SYMBOL_LENGTH_THRESHOLD = 9;
 export function CustomTokenModal(props: PropTypes) {
   const { open, onClose, token, onExit, onSubmitClick, blockchain } = props;
 
-  const explorerLink = generateExplorerLink(token.address, blockchain);
+  const explorerLink = token.address
+    ? createTokenExplorerUrl({
+        contractAddress: token.address,
+        blockchainMeta: blockchain,
+      })
+    : undefined;
 
   const onClickLearnMore = () =>
     window.open(CUSTOM_TOKEN_LEARN_MORE_LINK, '_blank');

package/src/components/StatefulConnectModal/StatefulConnectModal.tsx

@@ -1,6 +1,6 @@
 import type { Result } from '../../hooks/useStatefulConnect';
 import type { WalletInfoWithExtra } from '../../types';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 
 import { Divider } from '@rango-dev/ui';
 import React, { useEffect, useRef, useState } from 'react';

package/src/components/TokenList/TokenList.tsx

@@ -25,7 +25,7 @@ import { useAppStore } from '../../store/AppStore';
 import { useQuoteStore } from '../../store/quote';
 import { createTintsAndShades } from '../../utils/colors';
 import { getContainer } from '../../utils/common';
-import { findBlockchain } from '../../utils/meta';
+import { createTokenExplorerUrl, findBlockchain } from '../../utils/meta';
 import { formatBalance } from '../../utils/wallets';
 import { ImportCustomToken } from '../ImportCustomToken';
 
@@ -81,8 +81,7 @@ const renderDesc = (props: RenderDescProps) => {
         <div
           className={`${tokenAddressStyles()} ${
             !name && tokenWithoutNameStyles()
-          }`}
-        >
+          }`}>
           {length > 10
             ? `${address.slice(0, 5)}...${address.slice(length - 6, length)}`
             : address}{' '}
@@ -91,8 +90,7 @@ const renderDesc = (props: RenderDescProps) => {
             href={url}
             target="_blank"
             rel="nofollow noreferrer"
-            onClick={(e) => e.stopPropagation()}
-          >
+            onClick={(e) => e.stopPropagation()}>
             <ExternalLinkIcon size={12} />
           </StyledLink>
         </div>
@@ -153,8 +151,7 @@ export function TokenList(props: PropTypes) {
           type="primary"
           size="small"
           className="widget-token-list-item-import-btn"
-          onClick={handleClick}
-        >
+          onClick={handleClick}>
           <Typography variant="body" size="xsmall" color="background">
             {t('import')}
           </Typography>
@@ -187,8 +184,7 @@ export function TokenList(props: PropTypes) {
             <Typography
               variant="body"
               className={usdValueStyles()}
-              size="xsmall"
-            >
+              size="xsmall">
               {`$${tokenBalance.usdValue}`}
             </Typography>
           )}
@@ -266,6 +262,13 @@ export function TokenList(props: PropTypes) {
             }
           };
 
+          const url = address
+            ? createTokenExplorerUrl({
+                contractAddress: address,
+                blockchainMeta: blockchain,
+              })
+            : undefined;
+
           return (
             <ListItemContainer>
               <StyledListItemButton
@@ -306,8 +309,7 @@ export function TokenList(props: PropTypes) {
                         <TagTitle
                           variant="body"
                           size="xsmall"
-                          css={customCssForTagTitle}
-                        >
+                          css={customCssForTagTitle}>
                           {token.blockchain}
                         </TagTitle>
                       </Tag>
@@ -321,16 +323,17 @@ export function TokenList(props: PropTypes) {
                   ) : undefined
                 }
                 description={
-                  typeof token !== 'string' && !!blockchain.info && !!address
+                  typeof token !== 'string' &&
+                  !!blockchain.info &&
+                  !!address &&
+                  !!url
                     ? renderDesc({
                         address,
                         token,
                         customCssForTag,
                         customCssForTagTitle,
                         name: token.name,
-                        url: blockchain.info.addressUrl
-                          .split('{wallet}')
-                          .join(address),
+                        url,
                       })
                     : token.name || undefined
                 }

package/src/components/WalletStatefulConnect/DerivationPath.helpers.ts

@@ -1,4 +1,4 @@
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 import type { DerivationPath } from '@rango-dev/wallets-shared';
 
 import { namespaces } from '@rango-dev/wallets-shared';

package/src/components/WalletStatefulConnect/Detached.tsx

@@ -1,6 +1,6 @@
 import type { PropTypes } from './Detached.types';
+import type { Namespace } from '@hub3js/namespaces';
 import type { LegacyNamespaceMeta } from '@rango-dev/wallets-core/legacy';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
 
 import { i18n } from '@lingui/core';
 import {
@@ -161,7 +161,7 @@ export function Detached(props: PropTypes) {
       <MessageBox
         type="info"
         title={i18n.t(`Connect {wallet}`, {
-          wallet: targetWallet.type,
+          wallet: targetWallet.title,
         })}
         description={i18n.t(
           'This wallet supports multiple chains. Choose which chains you’d like to connect or disconnect.'

package/src/components/WalletStatefulConnect/Detached.types.ts

@@ -1,5 +1,5 @@
 import type { NeedsNamespacesState } from '../../hooks/useStatefulConnect';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 
 export interface PropTypes {
   value: NeedsNamespacesState;

package/src/components/WalletStatefulConnect/Namespaces.tsx

@@ -1,5 +1,5 @@
 import type { PropTypes } from './Namespaces.types';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 
 import { i18n } from '@lingui/core';
 import {

package/src/components/WalletStatefulConnect/Namespaces.types.tsx

@@ -1,7 +1,7 @@
 import type { NeedsNamespacesState } from '../../hooks/useStatefulConnect';
+import type { NamespaceData } from '@hub3js/core/store';
+import type { Namespace } from '@hub3js/namespaces';
 import type { LegacyNamespaceMeta } from '@rango-dev/wallets-core/legacy';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
-import type { NamespaceData } from '@rango-dev/wallets-core/store';
 
 export interface PropTypes {
   onConfirm: (namespaces: Namespace[]) => void;

package/src/containers/Wallets/Wallets.tsx

@@ -109,6 +109,9 @@ function Main(props: PropsWithChildren<PropTypes>) {
             [WalletTypes.TON_CONNECT]: {
               provider: { manifestUrl: config.tonConnect?.manifestUrl },
             },
+            [WalletTypes.TREZOR]: {
+              provider: { manifest: config.trezorManifest },
+            },
           },
         }}>
         {props.children}

package/src/hooks/useStatefulConnect/useStatefulConnect.state.ts

@@ -3,7 +3,7 @@ import type {
   NeedsDerivationPathState,
   NeedsNamespacesState,
 } from './useStatefulConnect.types';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 
 export interface State {
   status: 'init' | 'namespace' | 'derivationPath' | 'detached';

package/src/hooks/useStatefulConnect/useStatefulConnect.ts

@@ -1,6 +1,6 @@
 import type { HandleConnectOptions, Result } from './useStatefulConnect.types';
 import type { WalletInfoWithExtra } from '../../types';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 import type { NamespaceData } from '@rango-dev/wallets-shared';
 
 import { WalletState } from '@rango-dev/ui';

package/src/hooks/useStatefulConnect/useStatefulConnect.types.ts

@@ -1,5 +1,5 @@
 import type { ExtendedModalWalletInfo } from '../../utils/wallets';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 
 export interface HandleConnectOptions {
   // To have a switch between connect and disconnect when user is clicking on a button, this option can be helpful.

package/src/hooks/useWalletProviders/useWalletProviders.helpers.ts

@@ -1,6 +1,6 @@
 import type { ProviderInterface } from '@rango-dev/wallets-react';
 
-import { Provider } from '@rango-dev/wallets-core';
+import { Provider } from '@hub3js/core';
 
 export function hashProviders(
   providers: (string | ProviderInterface | Provider)[]

package/src/store/slices/config.ts

@@ -2,9 +2,9 @@ import type { DataSlice } from './data';
 import type { SettingsSlice } from './settings';
 import type { WidgetConfig } from '../../types';
 import type { StateCreatorWithInitialData } from '../app';
+import type { VersionedProviders } from '@hub3js/core/utils';
 
 import { allProviders as getAllProviders } from '@rango-dev/provider-all';
-import { type VersionedProviders } from '@rango-dev/wallets-core';
 
 import { cacheService } from '../../services/cacheService';
 import {
@@ -93,9 +93,6 @@ function generateProviders(config: WidgetConfig) {
         options?.walletConnectListedDesktopWalletLink,
     },
     selectedProviders: config.wallets,
-    trezor: options?.trezorManifest
-      ? { manifest: options.trezorManifest }
-      : undefined,
     tonConnect: options?.tonConnect?.manifestUrl
       ? { manifestUrl: options?.tonConnect.manifestUrl }
       : undefined,

package/src/store/slices/wallets.ts

@@ -1,5 +1,5 @@
 import type { AppStoreState } from './types';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 import type { Asset, Token, WalletDetail } from 'rango-sdk';
 
 import BigNumber from 'bignumber.js';

package/src/store/utils/wallets.ts

@@ -8,7 +8,7 @@ import type {
   BalanceState,
   ConnectedWallet,
 } from '../slices/wallets';
-import type { Namespace } from '@rango-dev/wallets-core/namespaces/common';
+import type { Namespace } from '@hub3js/namespaces';
 import type { Asset, WalletDetail } from 'rango-types';
 
 import BigNumber from 'bignumber.js';

package/src/types/config.ts

@@ -1,5 +1,5 @@
+import type { Provider } from '@hub3js/core';
 import type { Language, theme } from '@rango-dev/ui';
-import type { Provider } from '@rango-dev/wallets-core';
 import type { LegacyProviderInterface } from '@rango-dev/wallets-core/legacy';
 import type { WalletType } from '@rango-dev/wallets-shared';
 import type { Asset } from 'rango-sdk';

package/src/utils/meta.ts

@@ -70,3 +70,16 @@ export function isValidTokenAddress(
   const valid = regex.filter((r) => new RegExp(r).test(address)).length > 0;
   return valid;
 }
+
+export function createTokenExplorerUrl(params: {
+  contractAddress: string;
+  blockchainMeta: BlockchainMeta;
+}): string | undefined {
+  const { contractAddress, blockchainMeta } = params;
+
+  if (blockchainMeta.info?.tokenUrl) {
+    return blockchainMeta.info.tokenUrl.replace('{address}', contractAddress);
+  }
+
+  return blockchainMeta.info?.addressUrl.replace('{wallet}', contractAddress);
+}

package/src/utils/providers.ts

@@ -1,12 +1,12 @@
 import type { WidgetConfig } from '../types';
 import type { LegacyProviderInterface } from '@rango-dev/wallets-core/legacy';
 
+import { Provider } from '@hub3js/core';
 import {
   defineVersions,
   pickVersion,
-  Provider,
   type VersionedProviders,
-} from '@rango-dev/wallets-core';
+} from '@hub3js/core/utils';
 
 export interface ProvidersOptions {
   walletConnectProjectId?: WidgetConfig['walletConnectProjectId'];

package/src/utils/wallets.ts

@@ -23,6 +23,7 @@ import {
 import { legacyReadAccountAddress as readAccountAddress } from '@rango-dev/wallets-core/legacy';
 import {
   detectInstallLink,
+  HYPERLIQUID_SIGN_NETWORK,
   isEvmAddress,
   Networks,
 } from '@rango-dev/wallets-shared';
@@ -223,6 +224,14 @@ export function prepareAccountsForWalletStore(
            */
           addAccount(network, address.toLowerCase());
         });
+
+        const shouldAddHyperliquidAccount = evmChainsSupportedByWallet.includes(
+          HYPERLIQUID_SIGN_NETWORK
+        );
+
+        if (shouldAddHyperliquidAccount) {
+          addAccount(Networks.HYPERLIQUID, address.toLowerCase());
+        }
       }
     } else {
       addAccount(network, address);

package/dist/components/CustomTokenModal/CustomTokenModal.helpers.d.ts

@@ -1,3 +0,0 @@
-import type { BlockchainMeta } from 'rango-types';
-export declare function generateExplorerLink(address: string | null, blockchain: BlockchainMeta): string;
-//# sourceMappingURL=CustomTokenModal.helpers.d.ts.map

package/dist/components/CustomTokenModal/CustomTokenModal.helpers.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CustomTokenModal.helpers.d.ts","sourceRoot":"","sources":["../../../src/components/CustomTokenModal/CustomTokenModal.helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,MAAM,GAAG,IAAI,EACtB,UAAU,EAAE,cAAc,GACzB,MAAM,CAQR"}

package/src/components/CustomTokenModal/CustomTokenModal.helpers.ts

@@ -1,14 +0,0 @@
-import type { BlockchainMeta } from 'rango-types';
-
-export function generateExplorerLink(
-  address: string | null,
-  blockchain: BlockchainMeta
-): string {
-  const explorerLinkPattern = blockchain.info?.addressUrl;
-
-  if (!explorerLinkPattern || !address) {
-    return '';
-  }
-
-  return explorerLinkPattern.replace('{wallet}', address);
-}