wgm-swap-components

# Changelog All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). ## [1.4.5] - 2025-07-23 ### Fixed - **MAJOR**: Fixed get balance function by using wagmi's useBalance hook directly (like in exam) - Fixed balance fetching that was not working properly with useReadContracts - Improved balance updates to follow exam pattern with proper error handling - Fixed balance display to show real token balances from wallet ### Changed - Switched from useReadContracts to useBalance hook for better reliability - Updated balance effect to match exam implementation exactly - Improved balance formatting and fallback handling - Better debouncing and refetch logic for balance updates ### Technical Notes - Now uses `useBalance({ address, token })` directly like exam implementation - Handles native tokens (IP) vs ERC20 tokens correctly - Automatic balance refresh every 10 seconds - Proper fallback to '0' when balance data is unavailable ## [1.4.4] - 2025-07-23 ### Fixed - **MAJOR**: Fixed missing hooks and services directories in distribution - **MAJOR**: Fixed module resolution errors for useWagmiIntegration, useFetchQuote, useTokens - **MAJOR**: Fixed missing apolloClient and quoteService imports - Fixed export issues in index.es.js and index.cjs.js - Fixed build process to include all necessary files and folders ### Changed - Updated build process to use TypeScript compilation instead of Vite bundling - Improved package structure to include proper hooks/ and services/ directories - Simplified ES/CJS module generation with stable file references - All imports now resolve correctly without hash-based filenames ### Added - Complete hooks/ directory with all hook implementations - Complete services/ directory with all service implementations - Proper ES and CommonJS module wrappers - All TypeScript definition files for hooks and services ## [1.4.3] - 2025-07-23 ### Published - Previous version had build artifact issues ## [1.4.2] - 2025-07-23 ### Fixed - **BREAKING**: Fixed QueryClient dependency by wrapping SwapForm with built-in ApolloProvider - Fixed build artifacts naming mismatch - now generates consistent file references - Added `@tanstack/react-query` to peerDependencies (required by wagmi) ### Changed - Main `SwapForm` export now includes built-in ApolloProvider for GraphQL functionality - Added `SwapFormCore` export for raw component without providers - Updated build process to generate stable artifact names without hashing - Improved external dependency handling in build process ### Added - `SwapFormProvider` component that wraps SwapForm with necessary providers - Better provider integration for GraphQL and Query functionality ## [1.4.1] - 2025-07-23 ### Changed - **BREAKING**: Moved `wagmi` and `@wagmi/core` from dependencies to peerDependencies - Added optional `config` prop to SwapForm for custom wagmi configuration - Updated useWagmiIntegration hook to accept wagmi config parameter - Improved wagmi integration to work with existing wagmi contexts ### Added - Support for custom wagmi configuration through props - Better integration with existing wagmi setups - Graceful fallback when no wagmi config is provided ### Fixed - Resolved wagmi hook usage in async functions - Better error handling for missing wagmi configuration ## [1.4.0] - 2025-07-23 ### Added - Real wagmi integration with wallet connectivity and balance checking - Live quote fetching with debouncing and error handling - Contract interaction for actual swap execution - IP/WIP priority with wrap/unwrap functionality - Balance management with real-time checking and validation - Price impact warnings with dynamic calculations ### Changed - Enhanced SwapForm with real blockchain integration - Updated hooks to support real DeFi functionality - Improved error handling and loading states ## [1.3.8] - 2025-07-21 ### Maintenance - Republished with latest optimizations and stability improvements - Package consistency updates ## [1.3.7] - 2025-07-21 ### Changed - Completely refactored useTokens hook to match improved token processing logic - Updated GraphQL queries to use GET_TOKENS with search parameters - Enhanced token merging and deduplication system - Improved token transformation and address handling - Added automatic address assignment for tokens with id but no address - Better token verification integration with tokenlist.org ### Technical Improvements - More efficient token deduplication using Map with address-based keys - Enhanced token filtering and search functionality - Simplified token processing pipeline - Better error handling and fallback mechanisms ## [1.3.6] - 2025-07-21 ### Maintenance - Republished with latest build and optimizations - Package stability improvements ## [1.3.5] - 2025-07-21 ### Improved - Enhanced token ordering logic to guarantee IP and WIP tokens always appear first - Improved sorting algorithm: IP → WIP → Verified tokens (alphabetical) → Unverified tokens (alphabetical) - More robust token list management with explicit positioning for priority tokens - GraphQL-fetched tokens now properly append below default priority tokens ## [1.3.4] - 2025-07-21 ### Improved - Updated demo App.tsx to showcase IP and WIP tokens as default selection - IP token now appears first in mock token list - WIP token appears second in mock token list - Better demonstration of token priority system ## [1.3.3] - 2025-07-21 ### Improved - Enhanced token sorting logic to prioritize verified tokens from tokenlist - Updated sorting order: IP → WIP → Verified tokens → Unverified tokens - Improved user experience with better token organization ## [1.3.2] - 2025-07-21 ### Changed - Removed all hardcoded token prices (now all prices default to 0) - IP and WIP tokens no longer have fake $2000 price - All mock tokens in App.tsx updated to price: 0 - Ready for real price API integration ### Notes - USD values will not display until price API is integrated - This prevents showing misleading/fake token prices - Prices can be fetched from external APIs like CoinGecko, 1inch, etc. ## [1.3.0] - 2025-07-21 ### Added - Token verification system with tokenlist.org integration - Enhanced useTokens hook with dual GraphQL endpoint queries - Environment variable configuration for all API endpoints - Native fetch API replacing axios dependency - Token deduplication and merging from multiple sources - Enhanced Token interface with verified flag ### Changed - useTokens hook completely rewritten with Apollo Client useQuery - Simultaneous querying of both V1 and V2 GraphQL endpoints - Token verification against official tokenlist.org registry - Improved error handling and fallback mechanisms - Better loading states for GraphQL operations ### Removed - axios dependency replaced with native fetch - Legacy token fetching methods - Hardcoded API URLs (moved to environment variables) ### Environment Variables - `NEXT_PUBLIC_GRAPHQL_API_URL` - Primary GraphQL endpoint - `NEXT_PUBLIC_GRAPHQL_API_URL_V2` - Fallback GraphQL endpoint - `NEXT_PUBLIC_TOKEN_LIST_URL` - Token verification list URL ## [1.2.1] - 2025-07-21 ### Fixed - Library build configuration with proper ES modules and CommonJS support - CSS import issues in browser environments - Module loading errors when importing in external applications - MIME type conflicts with CSS files in ES module imports ### Changed - Separated CSS imports - now requires manual import: `import 'wgm-swap-components/dist/styles.css'` - Updated package entry points: main (CJS) and module (ES) formats - Improved bundle structure for better compatibility ## [1.2.0] - 2025-07-21 ### Added - Real GraphQL token data integration using Apollo Client - Token fetching from tentou.tech GraphQL API endpoints - Dual API support (primary: mimboku, fallback: mimboku-v2) - Enhanced Token interface with address and decimals fields - Real-time token search functionality via GraphQL queries - Apollo Client error handling and retry logic - Production-ready token data instead of mock data ### Changed - TokenSelectModal now uses real token data from GraphQL APIs - SwapForm no longer requires tokens prop (fetched internally) - Bundle size increased to ~400KB due to Apollo Client inclusion - Improved token search with server-side filtering ### Dependencies - Added @apollo/client ^3.11.10 - Added graphql ^16.9.0 ## [1.1.0] - 2025-07-21 ### Added - TokenSelectModal component with advanced features - Token search and filtering functionality - Favorites and history management with localStorage - Portal rendering for better modal positioning - Responsive design for mobile and desktop ### Fixed - Modal z-index conflicts in external applications - CSS dependency issues when used as npm package ## [1.0.2] - 2025-07-21 ### Fixed - CSS export in npm package - Styling issues when imported in external projects ## [1.0.1] - 2025-07-21 ### Fixed - Package build configuration - Export issues in library mode ## [1.0.0] - 2025-07-18 ### Added - Initial release of WGM Swap Components - SwapForm component - Complete token swap interface - TokenInput component - Specialized input for token amounts with balance display - SwapButton component - Customizable button with loading states - Token interface definition for type safety - Advanced CSS styling with gradients and animations - Real-time exchange rate display - Slippage tolerance control - Mobile-responsive design - TypeScript support with full type definitions - Comprehensive documentation and examples ### Features - 🎨 Modern, responsive design with beautiful gradients - 🔄 Smooth animations and transitions - 💱 Real-time exchange rate calculations - 🎯 Slippage tolerance control - 📱 Mobile-friendly interface - 🔒 Full TypeScript support - 🎪 Customizable styling via CSS variables - ⚡ Optimized performance - 🌟 DeFi-focused components - 📊 Balance and USD value display