{"_id":"@adxtya21/xion-builderkit","name":"@adxtya21/xion-builderkit","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@adxtya21/xion-builderkit","version":"1.0.0","description":"A collection of React components for building XION blockchain applications","main":"dist/index.js","module":"dist/index.esm.js","types":"dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.esm.js","require":"./dist/index.js"},"./styles":"./dist/styles.css"},"keywords":["xion","blockchain","react","components","web3","crypto","nft","payment","abstraxion"],"author":{"name":"Your Name"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/adityajha2005/builderkit.git"},"homepage":"https://github.com/adityajha2000/builderkit#readme","bugs":{"url":"https://github.com/adityajha2000/builderkit/issues"},"type":"module","scripts":{"dev":"vite","build":"npm run build:lib","build:lib":"vite build --mode lib","build:types":"tsc -p tsconfig.lib.json","prepublishOnly":"npm run build","lint":"eslint .","preview":"vite preview"},"peerDependencies":{"@burnt-labs/abstraxion":"^1.0.0-alpha.64","react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{"@radix-ui/react-icons":"^1.3.2","class-variance-authority":"^0.7.1","clsx":"^2.1.1","react-toastify":"^11.0.5","tailwind-merge":"^3.3.0"},"devDependencies":{"@eslint/js":"^9.25.0","@rollup/plugin-typescript":"^12.1.2","@tailwindcss/postcss":"^4.1.8","@tailwindcss/vite":"^4.1.8","@types/node":"^22.15.30","@types/react":"^19.1.2","@types/react-dom":"^19.1.2","@vitejs/plugin-react":"^4.4.1","eslint":"^9.25.0","eslint-plugin-react-hooks":"^5.2.0","eslint-plugin-react-refresh":"^0.4.19","globals":"^16.0.0","react":"^19.1.0","react-dom":"^19.1.0","react-router-dom":"^7.6.2","rollup":"^4.42.0","tailwindcss":"^4.1.8","typescript":"~5.8.3","typescript-eslint":"^8.30.1","vite":"^6.3.5","vite-plugin-dts":"^4.5.4"},"_id":"@adxtya21/xion-builderkit@1.0.0","gitHead":"29a4bdb29c0a9c407f73676284c264c21a3f47f0","_nodeVersion":"24.0.1","_npmVersion":"11.3.0","dist":{"integrity":"sha512-M/u4p248Gy9eyrBGUuVmgOtwVlgfQDCYx7VaSxKfCEE2JmzqSeDB2Y+AxuEn62j70sRtJjeTC8Ts9PALab4QDw==","shasum":"1dcf726931c49a6cae13d230bec857420493f20d","tarball":"https://registry.npmjs.org/@adxtya21/xion-builderkit/-/xion-builderkit-1.0.0.tgz","fileCount":7,"unpackedSize":186544,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIHCT8ev0LbYpsfKu8Avm7q9+hu0ZS2pmxovtTojv0qcIAiAadIk4EgO9Ln6FnRKngfRU9cDNfnI2UougMLzXzE8VeA=="}]},"_npmUser":{"name":"adxtya21","email":"2005akjha@gmail.com"},"directories":{},"maintainers":[{"name":"adxtya21","email":"2005akjha@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/xion-builderkit_1.0.0_1749279341755_0.6489381005717512"},"_hasShrinkwrap":false}},"time":{"created":"2025-06-07T06:55:41.699Z","1.0.0":"2025-06-07T06:55:41.939Z","modified":"2025-06-07T06:55:42.162Z"},"maintainers":[{"name":"adxtya21","email":"2005akjha@gmail.com"}],"description":"A collection of React components for building XION blockchain applications","homepage":"https://github.com/adityajha2000/builderkit#readme","keywords":["xion","blockchain","react","components","web3","crypto","nft","payment","abstraxion"],"repository":{"type":"git","url":"git+https://github.com/adityajha2005/builderkit.git"},"author":{"name":"Your Name"},"bugs":{"url":"https://github.com/adityajha2000/builderkit/issues"},"license":"MIT","readme":"# @xion/builderkit\n\nA collection of React components for building XION blockchain applications with ease. This library provides ready-to-use components for authentication, payments, NFT access control, and transaction handling.\n\n## Installation\n\n```bash\nnpm install @xion/builderkit\n```\n\n### Peer Dependencies\n\nMake sure you have the following peer dependencies installed:\n\n```bash\nnpm install react react-dom @burnt-labs/abstraxion\n```\n\n## Components\n\n### XionLogin\n\nA complete authentication component for XION wallet connection.\n\n```tsx\nimport { XionLogin } from '@xion/builderkit';\n\nfunction App() {\n  return <XionLogin />;\n}\n```\n\n### MagicCheckout\n\nA seamless payment component for processing transactions on XION.\n\n```tsx\nimport { MagicCheckout } from '@xion/builderkit';\n\nfunction PaymentPage() {\n  return (\n    <MagicCheckout\n      productId=\"product-123\"\n      amount=\"10.00\"\n      currency=\"usdc\"\n      onSuccess={(txHash) => console.log('Payment successful:', txHash)}\n      onError={(error) => console.error('Payment failed:', error)}\n    />\n  );\n}\n```\n\n### NFTAccess\n\nGate content based on NFT ownership with customizable fallback components.\n\n```tsx\nimport { NFTAccess } from '@xion/builderkit';\n\nfunction ExclusiveContent() {\n  return (\n    <NFTAccess\n      nftContractAddress=\"xion1...\"\n      tokenId=\"123\" // Optional: specific token ID\n      fallbackComponent={<div>You need the special NFT to access this!</div>}\n    >\n      <div>🎉 Exclusive content for NFT holders!</div>\n    </NFTAccess>\n  );\n}\n```\n\n### TransactionToast\n\nWrap any transaction with automatic toast notifications.\n\n```tsx\nimport { TransactionToast } from '@xion/builderkit';\n\nfunction MyComponent() {\n  const executeTransaction = async () => {\n    // Your transaction logic here\n    return await someBlockchainTransaction();\n  };\n\n  return (\n    <TransactionToast\n      onTransaction={executeTransaction}\n      pendingMessage=\"Processing transaction...\"\n      successMessage=\"Transaction completed!\"\n      errorMessage=\"Transaction failed:\"\n    >\n      <button>Execute Transaction</button>\n    </TransactionToast>\n  );\n}\n```\n\n## Hooks\n\n### useNFTAccess\n\nCheck NFT ownership programmatically.\n\n```tsx\nimport { useNFTAccess } from '@xion/builderkit';\n\nfunction MyComponent() {\n  const { hasAccess, isLoading, error } = useNFTAccess(\n    'xion1...', // contract address\n    '123',      // token ID (optional)\n    'xion1...'  // user address\n  );\n\n  if (isLoading) return <div>Checking NFT ownership...</div>;\n  if (error) return <div>Error: {error}</div>;\n  \n  return hasAccess ? <div>Access granted!</div> : <div>Access denied</div>;\n}\n```\n\n## Utilities\n\nThe library also exports various utility functions:\n\n```tsx\nimport {\n  xionToBaseUnits,\n  createTransferMessage,\n  getTransactionExplorerLink,\n  savePaymentSession,\n  // ... and more\n} from '@xion/builderkit';\n```\n\n## Setup Requirements\n\n### 1. Abstraxion Provider\n\nWrap your app with the Abstraxion provider:\n\n```tsx\nimport { AbstraxionProvider } from '@burnt-labs/abstraxion';\n\nfunction App() {\n  return (\n    <AbstraxionProvider\n      config={{\n        // Your Abstraxion config\n      }}\n    >\n      {/* Your app components */}\n    </AbstraxionProvider>\n  );\n}\n```\n\n### 2. Toast Container\n\nAdd the toast container for transaction notifications:\n\n```tsx\nimport { ToastContainer } from 'react-toastify';\nimport 'react-toastify/dist/ReactToastify.css';\n\nfunction App() {\n  return (\n    <div>\n      {/* Your app */}\n      <ToastContainer />\n    </div>\n  );\n}\n```\n\n### 3. Styles\n\nImport the required CSS files:\n\n```tsx\nimport '@burnt-labs/abstraxion/dist/index.css';\nimport '@burnt-labs/ui/dist/index.css';\nimport 'react-toastify/dist/ReactToastify.css';\n```\n\n## TypeScript Support\n\nThis library is built with TypeScript and includes full type definitions. All components and hooks are fully typed for the best development experience.\n\n## Examples\n\nCheck out the [examples directory](./examples) for complete implementation examples.\n\n## Contributing\n\nContributions are welcome! Please read our contributing guidelines and submit pull requests to our repository.\n\n## License\n\nMIT License - see LICENSE file for details.\n\n## Support\n\nFor support and questions, please open an issue on our GitHub repository.\n","readmeFilename":"README.md","_rev":"1-99b354daa7da6342db9000c8799149fa"}