web-sdk-core package

examples/components/package.json

@@ -9,6 +9,7 @@
   },
   "peerDependencies": {
     "@0xsequence/design-system": "2.1.11",
+    "@0xsequence/web-sdk-core": "workspace:*",
     "@0xsequence/network": "*",
     "wagmi": "^2.15.0"
   },

examples/components/src/WalletListItem.tsx

@@ -1,5 +1,5 @@
-import { truncateAtMiddle } from '@0xsequence/connect'
 import { Button, Card, cn, Text } from '@0xsequence/design-system'
+import { truncateAtMiddle } from '@0xsequence/web-sdk-core'
 
 interface WalletListItemProps {
   id: string

examples/next/package.json

@@ -10,6 +10,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
+    "@0xsequence/web-sdk-core": "workspace:*",
     "@0xsequence/checkout": "workspace:*",
     "@0xsequence/connect": "workspace:*",
     "@0xsequence/design-system": "2.1.11",

examples/next/src/app/components/Connected.tsx

@@ -1,6 +1,5 @@
 import type { CheckoutSettings } from '@0xsequence/checkout'
 import {
-  ContractVerificationStatus,
   signEthAuthProof,
   useOpenConnectModal,
   // useSocialLink,
@@ -13,6 +12,7 @@ import { Button, Card, cn, Text } from '@0xsequence/design-system'
 import { useIndexerClient } from '@0xsequence/hooks'
 import { allNetworks, ChainId } from '@0xsequence/network'
 import { useOpenWalletModal } from '@0xsequence/wallet-widget'
+import { ContractVerificationStatus } from '@0xsequence/web-sdk-core'
 import { CardButton, Header, WalletListItem } from 'example-shared-components'
 import { useCallback, useEffect, useState, type ComponentProps } from 'react'
 import { encodeFunctionData, formatUnits, parseAbi, parseUnits } from 'viem'

examples/react/package.json

@@ -11,6 +11,7 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
+    "@0xsequence/web-sdk-core": "workspace:*",
     "@0xsequence/checkout": "workspace:*",
     "@0xsequence/connect": "workspace:*",
     "@0xsequence/design-system": "2.1.11",

examples/react/src/components/Connected.tsx

@@ -8,7 +8,6 @@ import {
 } from '@0xsequence/checkout'
 import type { SwapModalSettings } from '@0xsequence/checkout'
 import {
-  getModalPositionCss,
   signEthAuthProof,
   useOpenConnectModal,
   useSocialLink,
@@ -20,6 +19,7 @@ import {
 import { Button, Card, cn, Modal, Scroll, Switch, Text, TextInput } from '@0xsequence/design-system'
 import { allNetworks, ChainId } from '@0xsequence/network'
 import { useOpenWalletModal } from '@0xsequence/wallet-widget'
+import { getModalPositionCss } from '@0xsequence/web-sdk-core'
 import { CardButton, Header, WalletListItem } from 'example-shared-components'
 import { AnimatePresence } from 'motion/react'
 import React, { useEffect, type ComponentProps } from 'react'

examples/react/src/components/CustomCheckout/index.tsx

@@ -1,6 +1,6 @@
 import { CreditCardProviders, useCheckoutUI } from '@0xsequence/checkout'
-import { CryptoOption } from '@0xsequence/connect'
 import { Button, Image, NetworkImage, Spinner, Text } from '@0xsequence/design-system'
+import { CryptoOption } from '@0xsequence/web-sdk-core'
 import { useState } from 'react'
 import { encodeFunctionData, toHex } from 'viem'
 import { useAccount } from 'wagmi'

packages/checkout/package.json

@@ -41,6 +41,7 @@
   "peerDependencies": {
     "0xsequence": ">= 2.3.23",
     "@0xsequence/api": ">=2.3.23",
+    "@0xsequence/web-sdk-core": "workspace:*",
     "@0xsequence/connect": "workspace:*",
     "@0xsequence/hooks": "workspace:*",
     "@0xsequence/indexer": ">= 2.3.23",

packages/checkout/src/components/SequenceCheckoutProvider/SequenceCheckoutProvider.tsx

@@ -1,7 +1,8 @@
 'use client'
 
-import { getModalPositionCss, ShadowRoot, useConnectConfigContext, useTheme } from '@0xsequence/connect'
+import { ShadowRoot, useConnectConfigContext, useTheme } from '@0xsequence/connect'
 import { Modal } from '@0xsequence/design-system'
+import { getModalPositionCss } from '@0xsequence/web-sdk-core'
 import { AnimatePresence } from 'motion/react'
 import { useEffect, useState, type ReactNode } from 'react'
 

packages/checkout/src/contexts/AddFundsModal.ts

@@ -1,8 +1,7 @@
 import { TransactionOnRampProvider } from '@0xsequence/marketplace'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 import type { Hex } from 'viem'
 
-import { createGenericContext } from './genericContext.js'
-
 export interface AddFundsSettings {
   walletAddress: string | Hex
   fiatAmount?: string

packages/checkout/src/contexts/CheckoutModal.ts

@@ -1,9 +1,9 @@
 'use client'
 
 import type { Theme } from '@0xsequence/design-system'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 
-import { createGenericContext } from './genericContext.js'
-import type { SupplementaryAnalyticsInfo, ActionButtons } from './SelectPaymentModal.js'
+import type { ActionButtons, SupplementaryAnalyticsInfo } from './SelectPaymentModal.js'
 
 interface CoinQuantity {
   contractAddress: string

packages/checkout/src/contexts/Environment.ts

@@ -1,6 +1,6 @@
 'use client'
 
-import { createGenericContext } from './genericContext.js'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 
 export interface EnvironmentOverrides {
   marketplaceApiUrl: string

packages/checkout/src/contexts/Navigation.ts

@@ -1,8 +1,8 @@
 'use client'
 
-import type { CreditCardCheckout } from '../contexts/CheckoutModal.js'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 
-import { createGenericContext } from './genericContext.js'
+import type { CreditCardCheckout } from '../contexts/CheckoutModal.js'
 
 export interface SelectCheckoutNavigation {
   location: 'select-method-checkout'

packages/checkout/src/contexts/NavigationCheckout.ts

@@ -1,6 +1,6 @@
 'use client'
 
-import { createGenericContext } from './genericContext.js'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 
 export interface PaymentMethodSelectionParams {
   selectedCurrency?: {

packages/checkout/src/contexts/SelectPaymentModal.ts

@@ -1,10 +1,9 @@
 import { TransactionOnRampProvider } from '@0xsequence/marketplace'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 import type { Hex } from 'viem'
 
 import type { TransakConfig } from '../contexts/CheckoutModal.js'
 
-import { createGenericContext } from './genericContext.js'
-
 export type CreditCardProviders = 'sardine' | 'transak'
 
 export interface Collectible {

packages/checkout/src/contexts/SwapModal.ts

@@ -1,9 +1,8 @@
 'use client'
 
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 import type { Hex } from 'viem'
 
-import { createGenericContext } from './genericContext.js'
-
 interface Transaction {
   to: Hex
   data?: Hex

packages/checkout/src/contexts/TransactionStatusModal.ts

@@ -1,4 +1,5 @@
-import { createGenericContext } from './genericContext.js'
+import { createGenericContext } from '@0xsequence/web-sdk-core'
+
 import type { ActionButtons } from './SelectPaymentModal.js'
 
 interface Item {

packages/checkout/src/contexts/TransferFundsModal.ts

@@ -1,7 +1,6 @@
+import { createGenericContext } from '@0xsequence/web-sdk-core'
 import type { Hex } from 'viem'
 
-import { createGenericContext } from './genericContext.js'
-
 export interface TransferFundsSettings {
   walletAddress: string | Hex
   onClose?: () => void

packages/checkout/src/hooks/useCheckoutUI/useCreditCardPayment.tsx

@@ -1,8 +1,8 @@
 import { useProjectAccessKey } from '@0xsequence/connect'
-import { compareAddress } from '@0xsequence/connect'
 import { useConfig } from '@0xsequence/hooks'
 import type { ContractInfo, TokenMetadata } from '@0xsequence/metadata'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { compareAddress } from '@0xsequence/web-sdk-core'
 import pako from 'pako'
 import React, { useEffect, useRef } from 'react'
 import { formatUnits, zeroAddress, type Hex } from 'viem'

packages/checkout/src/hooks/useCheckoutUI/useCryptoPayment.tsx

@@ -1,7 +1,7 @@
-import { compareAddress, ContractVerificationStatus, formatDisplay, sendTransactions } from '@0xsequence/connect'
 import { useGetSwapQuote, useGetSwapRoutes, useGetTokenBalancesSummary, useIndexerClient } from '@0xsequence/hooks'
 import type { ContractInfo, TokenMetadata } from '@0xsequence/metadata'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { compareAddress, ContractVerificationStatus, formatDisplay, sendTransactions } from '@0xsequence/web-sdk-core'
 import { useState } from 'react'
 import { encodeFunctionData, formatUnits, zeroAddress, type Hex } from 'viem'
 import { useAccount, usePublicClient, useReadContract, useWalletClient } from 'wagmi'

packages/checkout/src/hooks/useCheckoutUI/useOrderSummary.tsx

@@ -1,8 +1,8 @@
-import { compareAddress, formatDisplay, NetworkBadge } from '@0xsequence/connect'
 import { networkImageUrl } from '@0xsequence/design-system'
 import { useGetCoinPrices } from '@0xsequence/hooks'
 import type { ContractInfo, TokenMetadata } from '@0xsequence/metadata'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { compareAddress, formatDisplay, NetworkBadge } from '@0xsequence/web-sdk-core'
 import type { ReactNode } from 'react'
 import { formatUnits, zeroAddress } from 'viem'
 

packages/checkout/src/hooks/useERC1155SaleContractCheckout.ts

@@ -1,7 +1,7 @@
 import { useFindVersion } from '@0xsequence/hooks'
 import { type CheckoutOptionsSalesContractArgs } from '@0xsequence/marketplace'
 import { findSupportedNetwork } from '@0xsequence/network'
-import { encodeFunctionData, keccak256, sha256, toHex, zeroAddress, type Abi, type Hex } from 'viem'
+import { encodeFunctionData, sha256, toHex, zeroAddress, type Hex } from 'viem'
 import { useBytecode, useReadContract, useReadContracts } from 'wagmi'
 
 import { ERC_1155_SALE_CONTRACT } from '../constants/abi.js'

packages/checkout/src/views/Checkout/PaymentMethodSelect/OrderSummary/index.tsx

@@ -1,7 +1,7 @@
-import { CollectibleTileImage, formatDisplay } from '@0xsequence/connect'
 import { Spinner, Text, TokenImage } from '@0xsequence/design-system'
 import { useGetCoinPrices, useGetContractInfo, useGetTokenMetadata } from '@0xsequence/hooks'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { CollectibleTileImage, formatDisplay } from '@0xsequence/web-sdk-core'
 import { formatUnits } from 'viem'
 
 import { useSelectPaymentModal } from '../../../../hooks/useSelectPaymentModal.js'

packages/checkout/src/views/Checkout/PaymentMethodSelect/PayWithCrypto/index.tsx

@@ -1,11 +1,3 @@
-import {
-  compareAddress,
-  ContractVerificationStatus,
-  formatDisplay,
-  sendTransactions,
-  TRANSACTION_CONFIRMATIONS_DEFAULT,
-  useAnalyticsContext
-} from '@0xsequence/connect'
 import { AddIcon, Button, ChevronDownIcon, Spinner, Text, TokenImage, WarningIcon } from '@0xsequence/design-system'
 import {
   useClearCachedBalances,
@@ -17,6 +9,14 @@ import {
 } from '@0xsequence/hooks'
 import { TransactionOnRampProvider } from '@0xsequence/marketplace'
 import { findSupportedNetwork } from '@0xsequence/network'
+import {
+  compareAddress,
+  ContractVerificationStatus,
+  formatDisplay,
+  sendTransactions,
+  TRANSACTION_CONFIRMATIONS_DEFAULT,
+  useAnalyticsContext
+} from '@0xsequence/web-sdk-core'
 import { useState } from 'react'
 import { encodeFunctionData, formatUnits, zeroAddress, type Hex } from 'viem'
 import { useAccount, usePublicClient, useReadContract, useWalletClient } from 'wagmi'

packages/checkout/src/views/Checkout/TokenSelection/index.tsx

@@ -1,7 +1,7 @@
-import { compareAddress, ContractVerificationStatus, formatDisplay } from '@0xsequence/connect'
 import { Card, Scroll, SearchInput, Spinner, Text, TokenImage } from '@0xsequence/design-system'
 import { useGetContractInfo, useGetSwapRoutes, useGetTokenBalancesSummary } from '@0xsequence/hooks'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { compareAddress, ContractVerificationStatus, formatDisplay } from '@0xsequence/web-sdk-core'
 import Fuse from 'fuse.js'
 import { useState } from 'react'
 import { formatUnits } from 'viem'

packages/checkout/src/views/CheckoutSelection/component/OrderSummaryItem.tsx

@@ -1,6 +1,6 @@
-import { formatDisplay } from '@0xsequence/connect'
 import { Card, Image, NetworkImage, Skeleton, Text, TokenImage } from '@0xsequence/design-system'
 import { useGetContractInfo, useGetTokenMetadata } from '@0xsequence/hooks'
+import { formatDisplay } from '@0xsequence/web-sdk-core'
 import { formatUnits } from 'viem'
 
 interface OrderSummaryItem {

packages/checkout/src/views/CheckoutSelection/index.tsx

@@ -1,4 +1,3 @@
-import { compareAddress, ContractVerificationStatus, formatDisplay, getNativeTokenInfoByChainId } from '@0xsequence/connect'
 import {
   Button,
   ChevronRightIcon,
@@ -11,6 +10,8 @@ import {
   Tooltip
 } from '@0xsequence/design-system'
 import { useGetContractInfo, useGetTokenBalancesSummary } from '@0xsequence/hooks'
+import { ContractVerificationStatus } from '@0xsequence/indexer'
+import { compareAddress, formatDisplay, getNativeTokenInfoByChainId } from '@0xsequence/web-sdk-core'
 import { useEffect } from 'react'
 import { formatUnits, zeroAddress } from 'viem'
 import { useAccount, useConfig } from 'wagmi'

packages/checkout/src/views/PendingCreditCardTransaction.tsx

@@ -1,7 +1,8 @@
-import { useAnalyticsContext, useProjectAccessKey } from '@0xsequence/connect'
+import { useProjectAccessKey } from '@0xsequence/connect'
 import { Spinner, Text } from '@0xsequence/design-system'
 import { useConfig, useGetContractInfo, useGetTokenMetadata } from '@0xsequence/hooks'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { useAnalyticsContext } from '@0xsequence/web-sdk-core'
 import pako from 'pako'
 import { useEffect, useRef } from 'react'
 import { formatUnits } from 'viem'

packages/checkout/src/views/Swap/index.tsx

@@ -1,4 +1,3 @@
-import { compareAddress, CryptoOption, formatDisplay, sendTransactions } from '@0xsequence/connect'
 import { Button, Spinner, Text } from '@0xsequence/design-system'
 import {
   useGetContractInfo,
@@ -8,6 +7,7 @@ import {
   useIndexerClient
 } from '@0xsequence/hooks'
 import { findSupportedNetwork } from '@0xsequence/network'
+import { compareAddress, CryptoOption, formatDisplay, sendTransactions } from '@0xsequence/web-sdk-core'
 import { useEffect, useMemo, useState } from 'react'
 import { formatUnits, zeroAddress, type Hex } from 'viem'
 import { useAccount, usePublicClient, useWalletClient } from 'wagmi'

packages/checkout/src/views/TransactionStatus/index.tsx

@@ -1,9 +1,3 @@
-import {
-  CollectibleTileImage,
-  formatDisplay,
-  TRANSACTION_CONFIRMATIONS_DEFAULT,
-  waitForTransactionReceipt
-} from '@0xsequence/connect'
 import {
   ArrowDownIcon,
   Button,
@@ -19,6 +13,12 @@ import {
 import { useGetContractInfo, useGetTokenMetadata, useIndexerClient } from '@0xsequence/hooks'
 import { TransactionStatus as TransactionStatusSequence } from '@0xsequence/indexer'
 import { findSupportedNetwork } from '@0xsequence/network'
+import {
+  CollectibleTileImage,
+  formatDisplay,
+  TRANSACTION_CONFIRMATIONS_DEFAULT,
+  waitForTransactionReceipt
+} from '@0xsequence/web-sdk-core'
 import { formatDistanceToNow } from 'date-fns'
 import { useEffect, useState } from 'react'
 import { formatUnits, type Hex, type PublicClient } from 'viem'

packages/connect/package.json

@@ -60,6 +60,7 @@
   "peerDependencies": {
     "0xsequence": ">= 2.3.23",
     "@0xsequence/hooks": "workspace:*",
+    "@0xsequence/web-sdk-core": "workspace:*",
     "@databeat/tracker": "^0.9.3",
     "@react-oauth/google": "^0.11.1",
     "@tanstack/react-query": ">= 5",

packages/connect/src/components/Connect/Connect.tsx

@@ -3,6 +3,8 @@
 import { ArrowRightIcon, Divider, IconButton, Image, ModalPrimitive, Spinner, Text, TextInput } from '@0xsequence/design-system'
 import { useGetWaasStatus } from '@0xsequence/hooks'
 import { SequenceWaaS } from '@0xsequence/waas'
+import type { ExtendedConnector, LogoProps } from '@0xsequence/web-sdk-core'
+import { isEmailValid, useAnalyticsContext } from '@0xsequence/web-sdk-core'
 import { genUserId } from '@databeat/tracker'
 import { clsx } from 'clsx'
 import { useEffect, useState, type ChangeEventHandler, type ReactNode } from 'react'
@@ -12,15 +14,13 @@ import { useConnect, useConnections, useSignMessage } from 'wagmi'
 import { EVENT_SOURCE } from '../../constants/analytics.js'
 import { LocalStorageKey } from '../../constants/localStorage.js'
 import { CHAIN_ID_FOR_SIGNATURE } from '../../constants/walletLinking.js'
-import { useAnalyticsContext } from '../../contexts/Analytics.js'
 import { useStorage } from '../../hooks/useStorage.js'
 import { useEmailAuth } from '../../hooks/useWaasEmailAuth.js'
 import type { FormattedEmailConflictInfo } from '../../hooks/useWaasEmailConflict.js'
 import { useWaasLinkWallet } from '../../hooks/useWaasLinkWallet.js'
 import { useWallets } from '../../hooks/useWallets.js'
 import { useWalletSettings } from '../../hooks/useWalletSettings.js'
-import type { ConnectConfig, ExtendedConnector, LogoProps } from '../../types.js'
-import { isEmailValid } from '../../utils/helpers.js'
+import type { ConnectConfig } from '../../types.js'
 import { GuestWaasConnectButton, XWaasConnectButton } from '../ConnectButton/ConnectButton.js'
 import {
   AppleWaasConnectButton,
@@ -92,8 +92,9 @@ export const Connect = (props: ConnectProps) => {
 
       try {
         analytics?.track({
-          event: 'UNLINK_WALLET',
+          event: 'REQUEST',
           props: {
+            type: 'UNLINK_WALLET',
             parentWalletAddress: parentWallet ? getUserIdForEvent(parentWallet) : '',
             linkedWalletAddress: getUserIdForEvent(address),
             linkedWalletType: linkedWallets?.find(lw => lw.linkedWalletAddress === address)?.walletType || '',
@@ -150,8 +151,9 @@ export const Connect = (props: ConnectProps) => {
 
           try {
             analytics?.track({
-              event: 'LINK_WALLET',
+              event: 'REQUEST',
               props: {
+                type: 'LINK_WALLET',
                 parentWalletAddress: getUserIdForEvent(waasWalletAddress),
                 linkedWalletAddress: getUserIdForEvent(childWalletAddress),
                 linkedWalletType: connections.find(c => c.accounts[0] === lastConnectedWallet)?.connector?.name || '',

packages/connect/src/components/Connect/ExtendedWalletList.tsx

@@ -9,10 +9,10 @@ import {
   Text,
   useTheme
 } from '@0xsequence/design-system'
+import type { ExtendedConnector } from '@0xsequence/web-sdk-core'
 import Fuse from 'fuse.js'
 import { useState } from 'react'
 
-import type { ExtendedConnector } from '../../types.js'
 import { getLogo } from '../ConnectButton/index.js'
 
 interface ExtendedWalletListProps {