chore: migrate internal

src/checkout/components/CheckoutButton.test.tsx

@@ -8,7 +8,7 @@ vi.mock('./CheckoutProvider', () => ({
   useCheckoutContext: vi.fn(),
 }));
 
-vi.mock('../../internal/components/Spinner', () => ({
+vi.mock('@/ui-react/internal/Spinner', () => ({
   Spinner: () => <div data-testid="spinner">Loading...</div>,
 }));
 

src/checkout/components/CheckoutButton.tsx

@@ -1,6 +1,5 @@
+import { Spinner } from '@/ui-react/internal/Spinner';
 import { useMemo } from 'react';
-import { Spinner } from '../../internal/components/Spinner';
-
 import { useIcon } from '../../core-react/internal/hooks/useIcon';
 import {
   border,

src/core-react/internal/hooks/useIcon.test.tsx

@@ -1,9 +1,9 @@
+import { coinbasePaySvg } from '@/core/svg/coinbasePaySvg';
+import { fundWalletSvg } from '@/core/svg/fundWallet';
+import { swapSettingsSvg } from '@/core/svg/swapSettings';
+import { walletSvg } from '@/core/svg/walletSvg';
 import { renderHook } from '@testing-library/react';
 import { describe, expect, it } from 'vitest';
-import { coinbasePaySvg } from '../../../internal/svg/coinbasePaySvg';
-import { fundWalletSvg } from '../../../internal/svg/fundWallet';
-import { swapSettingsSvg } from '../../../internal/svg/swapSettings';
-import { walletSvg } from '../../../internal/svg/walletSvg';
 import { useIcon } from './useIcon';
 
 describe('useIcon', () => {

src/core-react/internal/hooks/useIcon.tsx

@@ -1,8 +1,8 @@
+import { coinbasePaySvg } from '@/core/svg/coinbasePaySvg';
+import { fundWalletSvg } from '@/core/svg/fundWallet';
+import { swapSettingsSvg } from '@/core/svg/swapSettings';
+import { walletSvg } from '@/core/svg/walletSvg';
 import { isValidElement, useMemo } from 'react';
-import { coinbasePaySvg } from '../../../internal/svg/coinbasePaySvg';
-import { fundWalletSvg } from '../../../internal/svg/fundWallet';
-import { swapSettingsSvg } from '../../../internal/svg/swapSettings';
-import { walletSvg } from '../../../internal/svg/walletSvg';
 
 export const useIcon = ({ icon }: { icon?: React.ReactNode }) => {
   return useMemo(() => {

src/fund/components/FundButton.tsx

@@ -1,6 +1,6 @@
+import { addSvg } from '@/core/svg/addSvg';
 import { useCallback } from 'react';
 import { useTheme } from '../../core-react/internal/hooks/useTheme';
-import { addSvg } from '../../internal/svg/addSvg';
 import { border, cn, color, pressable, text } from '../../styles/theme';
 
 import { openPopup } from '@/ui-react/internal/utils/openPopup';

src/identity/components/Avatar.tsx

@@ -1,7 +1,7 @@
+import { defaultAvatarSVG } from '@/core/svg/defaultAvatarSVG';
+import { defaultLoadingSVG } from '@/core/svg/defaultLoadingSVG';
 import { Children, useMemo } from 'react';
 import { findComponent } from '../../core-react/internal/utils/findComponent';
-import { defaultAvatarSVG } from '../../internal/svg/defaultAvatarSVG';
-import { defaultLoadingSVG } from '../../internal/svg/defaultLoadingSVG';
 import { cn } from '../../styles/theme';
 import { useAvatar } from '../hooks/useAvatar';
 import { useName } from '../hooks/useName';

src/identity/components/Badge.tsx

@@ -1,4 +1,4 @@
-import { badgeSvg } from '../../internal/svg/badgeSvg';
+import { badgeSvg } from '@/core/svg/badgeSvg';
 import { background, cn } from '../../styles/theme';
 import type { BadgeReact } from '../types';
 

src/identity/utils/getSocialPlatformDetails.tsx

@@ -1,8 +1,8 @@
-import { githubSvg } from '../../internal/svg/githubSvg';
-import { twitterSvg } from '../../internal/svg/twitterSvg';
-import { warpcastSvg } from '../../internal/svg/warpcastSvg';
-import { websiteSvg } from '../../internal/svg/websiteSvg';
-import { border, cn, pressable } from '../../styles/theme';
+import { githubSvg } from '@/core/svg/githubSvg';
+import { twitterSvg } from '@/core/svg/twitterSvg';
+import { warpcastSvg } from '@/core/svg/warpcastSvg';
+import { websiteSvg } from '@/core/svg/websiteSvg';
+import { border, cn, pressable } from '@/styles/theme';
 
 export type SocialPlatform = 'twitter' | 'github' | 'farcaster' | 'website';
 

src/swap/components/Swap.test.tsx

@@ -9,7 +9,7 @@ vi.mock('./SwapProvider', () => ({
   useSwapContext: vi.fn(),
 }));
 
-vi.mock('../../internal/svg/closeSvg', () => ({
+vi.mock('@/core/svg/closeSvg', () => ({
   CloseSvg: () => <div data-testid="mock-close-svg" />,
 }));
 

src/swap/components/SwapAmountInput.tsx

@@ -2,7 +2,6 @@ import { useCallback, useEffect, useMemo } from 'react';
 import { useValue } from '../../core-react/internal/hooks/useValue';
 import { getRoundedAmount } from '../../core/utils/getRoundedAmount';
 import { isValidAmount } from '../../core/utils/isValidAmount';
-import { TextInput } from '../../internal/components/TextInput';
 import {
   background,
   border,
@@ -13,6 +12,7 @@ import {
 } from '../../styles/theme';
 import { TokenChip, TokenSelectDropdown } from '../../token';
 import type { Token } from '../../token';
+import { TextInput } from '../../ui/react/internal/TextInput';
 import type { SwapAmountInputReact } from '../types';
 import { formatAmount } from '../utils/formatAmount';
 import { useSwapContext } from './SwapProvider';

src/swap/components/SwapButton.test.tsx

@@ -19,7 +19,7 @@ vi.mock('./SwapProvider', () => ({
   useSwapContext: vi.fn(),
 }));
 
-vi.mock('../../internal/components/Spinner', () => ({
+vi.mock('@/ui-react/internal/Spinner', () => ({
   Spinner: () => <div data-testid="spinner">Loading...</div>,
 }));
 

src/swap/components/SwapButton.tsx

@@ -1,4 +1,4 @@
-import { Spinner } from '../../internal/components/Spinner';
+import { Spinner } from '@/ui-react/internal/Spinner';
 import {
   background,
   border,

src/swap/components/SwapToast.tsx

@@ -1,10 +1,10 @@
 import { useCallback } from 'react';
 import { cn, color, text } from '../../styles/theme';
 
+import { successSvg } from '@/core/svg/successSvg';
 import { useAccount } from 'wagmi';
 import { getChainExplorer } from '../../core/network/getChainExplorer';
-import { Toast } from '../../internal/components/Toast';
-import { successSvg } from '../../internal/svg/successSvg';
+import { Toast } from '../../ui/react/internal/Toast';
 import type { SwapToastReact } from '../types';
 import { useSwapContext } from './SwapProvider';
 

src/swap/components/SwapToggleButton.tsx

@@ -1,4 +1,4 @@
-import { toggleSvg } from '../../internal/svg/toggleSvg';
+import { toggleSvg } from '@/core/svg/toggleSvg';
 import { border, cn, pressable } from '../../styles/theme';
 import type { SwapToggleButtonReact } from '../types';
 import { useSwapContext } from './SwapProvider';

src/token/components/TokenSearch.tsx

@@ -1,9 +1,9 @@
+import { closeSvg } from '@/core/svg/closeSvg';
+import { searchIconSvg } from '@/core/svg/searchIconSvg';
 import { useCallback, useState } from 'react';
 import { useTheme } from '../../core-react/internal/hooks/useTheme';
-import { TextInput } from '../../internal/components/TextInput';
-import { closeSvg } from '../../internal/svg/closeSvg';
-import { searchIconSvg } from '../../internal/svg/searchIconSvg';
 import { cn, color, placeholder, pressable } from '../../styles/theme';
+import { TextInput } from '../../ui/react/internal/TextInput';
 import type { TokenSearchReact } from '../types';
 
 export function TokenSearch({

src/token/components/TokenSelectButton.tsx

@@ -1,6 +1,6 @@
+import { caretDownSvg } from '@/core/svg/caretDownSvg';
+import { caretUpSvg } from '@/core/svg/caretUpSvg';
 import { type ForwardedRef, forwardRef } from 'react';
-import { caretDownSvg } from '../../internal/svg/caretDownSvg';
-import { caretUpSvg } from '../../internal/svg/caretUpSvg';
 import { border, cn, color, pressable, text } from '../../styles/theme';
 import type { TokenSelectButtonReact } from '../types';
 import { TokenImage } from './TokenImage';

src/transaction/components/TransactionButton.tsx

@@ -1,8 +1,8 @@
 import { useCallback, useMemo } from 'react';
 import { useAccount, useChainId } from 'wagmi';
 import { getChainExplorer } from '../../core/network/getChainExplorer';
-import { Spinner } from '../../internal/components/Spinner';
 import { border, cn, color, pressable, text } from '../../styles/theme';
+import { Spinner } from '../../ui/react/internal/Spinner';
 import type { TransactionButtonReact } from '../types';
 import { isSpinnerDisplayed } from '../utils/isSpinnerDisplayed';
 import { useTransactionContext } from './TransactionProvider';

src/transaction/components/TransactionToast.tsx

@@ -1,5 +1,5 @@
 import { useCallback } from 'react';
-import { Toast } from '../../internal/components/Toast';
+import { Toast } from '../../ui/react/internal/Toast';
 import type { TransactionToastReact } from '../types';
 import { useTransactionContext } from './TransactionProvider';
 

src/transaction/components/TransactionToastIcon.tsx

@@ -1,8 +1,8 @@
+import { errorSvg } from '@/core/svg/errorSvg';
+import { successSvg } from '@/core/svg/successSvg';
 import { useMemo } from 'react';
-import { Spinner } from '../../internal/components/Spinner';
-import { errorSvg } from '../../internal/svg/errorSvg';
-import { successSvg } from '../../internal/svg/successSvg';
 import { cn, text } from '../../styles/theme';
+import { Spinner } from '../../ui/react/internal/Spinner';
 import type { TransactionToastIconReact } from '../types';
 import { useTransactionContext } from './TransactionProvider';
 

src/internal/components/Draggable.tsx → src/ui/react/internal/Draggable.tsx

@@ -1,6 +1,6 @@
+import { zIndex } from '@/styles/constants';
+import { cn } from '@/styles/theme';
 import { useCallback, useEffect, useState } from 'react';
-import { zIndex } from '../../styles/constants';
-import { cn } from '../../styles/theme';
 
 type DraggableProps = {
   children: React.ReactNode;

src/internal/components/QrCode/QrCodeSvg.test.tsx → src/ui/react/internal/QrCode/QrCodeSvg.test.tsx

@@ -1,9 +1,9 @@
+import { cbwSvg } from '@/core/svg/cbwSvg';
 import { render, screen } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
-import { cbwSvg } from '../../svg/cbwSvg';
 import { QrCodeSvg } from './QrCodeSvg';
 
-vi.mock('../../../core-react/internal/hooks/useTheme', () => ({
+vi.mock('../../../../core-react/internal/hooks/useTheme', () => ({
   useTheme: vi.fn(() => 'default'),
 }));
 

src/internal/components/QrCode/QrCodeSvg.tsx → src/ui/react/internal/QrCode/QrCodeSvg.tsx

@@ -1,5 +1,5 @@
 import { useId, useMemo } from 'react';
-import { useTheme } from '../../../core-react/internal/hooks/useTheme';
+import { useTheme } from '../../../../core-react/internal/hooks/useTheme';
 import {
   GRADIENT_END_COORDINATES,
   GRADIENT_START_COORDINATES,

src/internal/components/QrCode/useLogo.tsx → src/ui/react/internal/QrCode/useLogo.tsx

@@ -1,6 +1,6 @@
+import { cbwSvg } from '@/core/svg/cbwSvg';
 import React, { useMemo } from 'react';
 import ReactDOMServer from 'react-dom/server';
-import { cbwSvg } from '../../svg/cbwSvg';
 
 type RenderLogoProps = {
   size: number;

src/internal/components/QuantitySelector.test.tsx → src/ui/react/internal/QuantitySelector.test.tsx

@@ -10,7 +10,7 @@ import {
   it,
   vi,
 } from 'vitest';
-import { pressable } from '../../styles/theme';
+import { pressable } from '../../../styles/theme';
 import { DELAY_MS, QuantitySelector } from './QuantitySelector';
 
 describe('QuantitySelector component', () => {

src/internal/components/QuantitySelector.tsx → src/ui/react/internal/QuantitySelector.tsx

@@ -1,6 +1,12 @@
+import { TextInput } from '@/ui-react/internal/TextInput';
 import { useCallback, useState } from 'react';
-import { TextInput } from '../../internal/components/TextInput';
-import { background, border, cn, color, pressable } from '../../styles/theme';
+import {
+  background,
+  border,
+  cn,
+  color,
+  pressable,
+} from '../../../styles/theme';
 
 export const DELAY_MS = 200;
 

src/internal/components/Spinner.tsx → src/ui/react/internal/Spinner.tsx

@@ -1,4 +1,4 @@
-import { cn } from '../../styles/theme';
+import { cn } from '../../../styles/theme';
 
 type SpinnerReact = {
   className?: string;

src/internal/components/TextInput.tsx → src/ui/react/internal/TextInput.tsx

@@ -1,6 +1,6 @@
 import { useCallback } from 'react';
 import type { ChangeEvent } from 'react';
-import { useDebounce } from '../../core-react/internal/hooks/useDebounce';
+import { useDebounce } from '../../../core-react/internal/hooks/useDebounce';
 
 type TextInputReact = {
   'aria-label'?: string;

src/internal/components/Toast.tsx → src/ui/react/internal/Toast.tsx

@@ -1,7 +1,7 @@
+import { closeSvg } from '@/core/svg/closeSvg';
 import { useEffect } from 'react';
-import { background, cn } from '../../styles/theme';
-import { getToastPosition } from '../../ui/react/internal/utils/getToastPosition';
-import { closeSvg } from '../svg/closeSvg';
+import { background, cn } from '../../../styles/theme';
+import { getToastPosition } from './utils/getToastPosition';
 
 type ToastProps = {
   className?: string;

src/ui/react/nft/mint/NFTMintButton.tsx

@@ -2,7 +2,6 @@ import { useNFTLifecycleContext } from '@/core-react/nft/providers/NFTLifecycleP
 import { useNFTContext } from '@/core-react/nft/providers/NFTProvider';
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useAccount, useChainId } from 'wagmi';
-import { Spinner } from '../../../../internal/components/Spinner';
 import { cn, color, text } from '../../../../styles/theme';
 import {
   Transaction,
@@ -16,6 +15,7 @@ import {
 } from '../../../../transaction';
 import type { Call } from '../../../../transaction/types';
 import { ConnectWallet } from '../../../../wallet';
+import { Spinner } from '../../internal/Spinner';
 
 type NFTMintButtonReact = {
   className?: string;

src/ui/react/nft/mint/NFTQuantitySelector.test.tsx

@@ -15,7 +15,7 @@ import { NFTQuantitySelector } from './NFTQuantitySelector';
 
 vi.mock('@/core-react/nft/providers/NFTProvider');
 
-vi.mock('../../../../internal/components/QuantitySelector', () => ({
+vi.mock('@/ui-react/internal/QuantitySelector', () => ({
   QuantitySelector: ({
     onChange,
     minQuantity,

src/ui/react/nft/mint/NFTQuantitySelector.tsx

@@ -1,5 +1,5 @@
 import { useNFTContext } from '@/core-react/nft/providers/NFTProvider';
-import { QuantitySelector } from '../../../../internal/components/QuantitySelector';
+import { QuantitySelector } from '@/ui-react/internal/QuantitySelector';
 import { cn } from '../../../../styles/theme';
 
 type NFTQuantitySelectorReact = {

src/ui/react/nft/mint/NFTTotalCost.tsx

@@ -1,7 +1,7 @@
 import { useNFTContext } from '@/core-react/nft/providers/NFTProvider';
+import { infoSvg } from '@/core/svg/infoSvg';
 import { multiplyFloats } from '@/core/utils/multiplyFloats';
 import { type ReactNode, useCallback, useMemo, useState } from 'react';
-import { infoSvg } from '../../../../internal/svg/infoSvg';
 import { background, border, cn, text } from '../../../../styles/theme';
 import { formatAmount } from '../../../../token/utils/formatAmount';
 

src/ui/react/nft/view/NFTImage.tsx

@@ -1,7 +1,7 @@
 import { useNFTContext } from '@/core-react/nft/providers/NFTProvider';
 import type { NFTError } from '@/core/api/types';
+import { defaultNFTSvg } from '@/core/svg/defaultNFTSvg';
 import { type MouseEvent, useCallback, useEffect, useState } from 'react';
-import { defaultNFTSvg } from '../../../../internal/svg/defaultNFTSvg';
 import { cn } from '../../../../styles/theme';
 
 type NFTImageReact = {

src/ui/react/nft/view/NFTNetwork.tsx

@@ -1,7 +1,7 @@
+import { baseSvg } from '@/core/svg/baseSvg';
 import type { ReactNode } from 'react';
 import { type Chain, base } from 'viem/chains';
 import { useChainId } from 'wagmi';
-import { baseSvg } from '../../../../internal/svg/baseSvg';
 import { cn, color, text } from '../../../../styles/theme';
 
 type NFTNetworkReact = {

src/ui/react/nft/view/NFTVideo.tsx

@@ -1,7 +1,7 @@
 import { useNFTContext } from '@/core-react/nft/providers/NFTProvider';
 import type { NFTError } from '@/core/api/types';
 import { useEffect, useRef } from 'react';
-import { defaultNFTSvg } from '../../../../internal/svg/defaultNFTSvg';
+import { defaultNFTSvg } from '../../../../core/svg/defaultNFTSvg';
 import { cn } from '../../../../styles/theme';
 
 type NFTVideoReact = {

src/wallet/components/ConnectWallet.tsx

@@ -5,14 +5,14 @@ import { useAccount, useConnect } from 'wagmi';
 import { findComponent } from '../../core-react/internal/utils/findComponent';
 import { useOnchainKit } from '../../core-react/useOnchainKit';
 import { IdentityProvider } from '../../identity/components/IdentityProvider';
-import { Spinner } from '../../internal/components/Spinner';
 import {
   border,
   cn,
   color,
   text as dsText,
   pressable,
 } from '../../styles/theme';
+import { Spinner } from '../../ui/react/internal/Spinner';
 import type { ConnectWalletReact } from '../types';
 import { ConnectButton } from './ConnectButton';
 import { ConnectWalletText } from './ConnectWalletText';

src/wallet/components/WalletDropdownBasename.tsx

@@ -1,9 +1,9 @@
+import { basenameSvg } from '@/core/svg/basenameSvg';
 import { base } from 'viem/chains';
 import { useAccount } from 'wagmi';
 import { useName } from '../../identity/hooks/useName';
-import { Spinner } from '../../internal/components/Spinner';
-import { basenameSvg } from '../../internal/svg/basenameSvg';
 import { cn, color, pressable, text } from '../../styles/theme';
+import { Spinner } from '../../ui/react/internal/Spinner';
 import type { WalletDropdownBasenameReact } from '../types';
 
 export function WalletDropdownBasename({