{"_id":"@airdropprotocol/widget","_rev":"2-8a68ffcb8a51df72c0c3528644cea90d","name":"@airdropprotocol/widget","dist-tags":{"latest":"0.3.2"},"versions":{"0.3.1":{"name":"@airdropprotocol/widget","version":"0.3.1","keywords":["solana","airdrop","react","widget","claim","merkle-distributor","wallet-adapter"],"author":{"name":"airdrop protocol"},"license":"MIT","_id":"@airdropprotocol/widget@0.3.1","maintainers":[{"name":"mppfinance","email":"mppfinanc3@outlook.com"}],"homepage":"https://github.com/airdropprotocol/airdrop-protocol/tree/main/packages/widget#readme","bugs":{"url":"https://github.com/airdropprotocol/airdrop-protocol/issues"},"dist":{"shasum":"775430a78b3142ceb7969c58ed6cce21847bb070","tarball":"https://registry.npmjs.org/@airdropprotocol/widget/-/widget-0.3.1.tgz","fileCount":12,"integrity":"sha512-UZfJzeVGQEgrFm2G7dRIU5CP2LL/d+8UxtQFRRXcp3zkONOuodbkJv2tofTTiIv+kFu3xCscf9ebiV0F8ShGpA==","signatures":[{"sig":"MEUCIQD6djqSLtizdr4jsk64WDBVyOFy/+Jk9bz/RmH1w87bFAIgAusM2sKet+EYomqr41IpYKgGFAwZSKjqpLC148hZSjk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":24252},"main":"dist/index.js","type":"module","types":"dist/index.d.ts","engines":{"node":">=18"},"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./styles.css":"./dist/styles.css"},"gitHead":"73dd5c20e37d37ff4db9a63dbcdbc6ab940d6ebf","scripts":{"build":"tsc && cp src/styles.css dist/styles.css","typecheck":"tsc --noEmit"},"_npmUser":{"name":"mppfinance","email":"mppfinanc3@outlook.com"},"repository":{"url":"git+https://github.com/airdropprotocol/airdrop-protocol.git","type":"git","directory":"packages/widget"},"_npmVersion":"10.8.2","description":"Drop-in React claim widget for airdrop-protocol. Headless hook + styled component, built on wallet-adapter.","directories":{},"_nodeVersion":"20.20.2","dependencies":{"@airdropprotocol/sdk":"^0.3.1","@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-adapter-react":"^0.15.35"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.5.3","@types/react":"^18.3.3","@solana/web3.js":"^1.95.3","@types/react-dom":"^18.3.0"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0","@solana/web3.js":"^1.95.0"},"_npmOperationalInternal":{"tmp":"tmp/widget_0.3.1_1776559561549_0.19968582523753287","host":"s3://npm-registry-packages-npm-production"}},"0.3.2":{"name":"@airdropprotocol/widget","version":"0.3.2","description":"Drop-in React claim widget for airdrop-protocol. Headless hook + styled component, built on wallet-adapter.","license":"MIT","type":"module","author":{"name":"airdrop protocol"},"homepage":"https://github.com/airdropprotocol/airdrop-protocol/tree/main/packages/widget#readme","repository":{"type":"git","url":"git+https://github.com/airdropprotocol/airdrop-protocol.git","directory":"packages/widget"},"bugs":{"url":"https://github.com/airdropprotocol/airdrop-protocol/issues"},"keywords":["solana","airdrop","react","widget","claim","merkle-distributor","wallet-adapter"],"main":"dist/index.js","types":"dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"},"./styles.css":"./dist/styles.css"},"scripts":{"build":"tsc && cp src/styles.css dist/styles.css","typecheck":"tsc --noEmit"},"engines":{"node":">=18"},"peerDependencies":{"@solana/web3.js":"^1.95.0","react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{"@airdropprotocol/sdk":"^0.3.2","@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-adapter-react":"^0.15.35"},"devDependencies":{"@solana/web3.js":"^1.95.3","@types/react":"^18.3.3","@types/react-dom":"^18.3.0","react":"^18.3.1","react-dom":"^18.3.1","typescript":"^5.5.3"},"_id":"@airdropprotocol/widget@0.3.2","gitHead":"2a917200777ef4bc3ec5c3d9795cc4a0d8884b17","_nodeVersion":"20.20.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-wnt2jHBhThYDLb/mW1DP5yH0S7tGlVlaQvaZbxV6xmVeirrBNyg90fpPROBaioqW866oGVJ7iwnN3WhehhLC6A==","shasum":"538fa64812242e876bfafcf336ac968f3a14d41d","tarball":"https://registry.npmjs.org/@airdropprotocol/widget/-/widget-0.3.2.tgz","fileCount":12,"unpackedSize":24252,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCSxTMawLMAEcM2GYM/XCjkkK3XiS7HDuD8LWETmKQstAIgE4iHwf50o+ygOovy1FESR5vOjIES/GYz1THLeNk9zR0="}]},"_npmUser":{"name":"mppfinance","email":"mppfinanc3@outlook.com"},"directories":{},"maintainers":[{"name":"mppfinance","email":"mppfinanc3@outlook.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/widget_0.3.2_1776601409856_0.2285566539170094"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-19T00:46:01.388Z","modified":"2026-04-19T12:23:30.124Z","0.3.1":"2026-04-19T00:46:01.679Z","0.3.2":"2026-04-19T12:23:30.008Z"},"bugs":{"url":"https://github.com/airdropprotocol/airdrop-protocol/issues"},"author":{"name":"airdrop protocol"},"license":"MIT","homepage":"https://github.com/airdropprotocol/airdrop-protocol/tree/main/packages/widget#readme","keywords":["solana","airdrop","react","widget","claim","merkle-distributor","wallet-adapter"],"repository":{"type":"git","url":"git+https://github.com/airdropprotocol/airdrop-protocol.git","directory":"packages/widget"},"description":"Drop-in React claim widget for airdrop-protocol. Headless hook + styled component, built on wallet-adapter.","maintainers":[{"name":"mppfinance","email":"mppfinanc3@outlook.com"}],"readme":"# @airdropprotocol/widget\n\n[![npm](https://img.shields.io/npm/v/@airdropprotocol/widget.svg?color=cb3837&logo=npm)](https://www.npmjs.com/package/@airdropprotocol/widget)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://github.com/airdropprotocol/airdrop-protocol/blob/main/LICENSE)\n\nDrop-in React claim widget for [airdrop-protocol](https://github.com/airdropprotocol/airdrop-protocol).\nBuilt on `@solana/wallet-adapter-react` and `@airdropprotocol/sdk`.\n\n```bash\nnpm install @airdropprotocol/widget @airdropprotocol/sdk \\\n  @solana/web3.js \\\n  @solana/wallet-adapter-react \\\n  @solana/wallet-adapter-wallets \\\n  @solana/wallet-adapter-react-ui\n```\n\n## Usage\n\n```tsx\nimport { AirdropClaim } from \"@airdropprotocol/widget\";\nimport \"@airdropprotocol/widget/styles.css\";\nimport \"@solana/wallet-adapter-react-ui/styles.css\";\n\nexport default function ClaimPage() {\n  return (\n    <AirdropClaim\n      proofsUrl=\"/proofs.json\"\n      distributor=\"MerkleDistributorPubkey...\"\n      vault=\"VaultTokenAccountPubkey...\"\n    />\n  );\n}\n```\n\nWrap your app with the usual `ConnectionProvider` / `WalletProvider` from\nwallet-adapter — the widget reads connection and wallet from context.\n\n### Props\n\n| Prop | Required | Description |\n|---|---|---|\n| `proofsUrl` | ✅ | URL to the static `proofs.json` produced by `airdrop tree` |\n| `distributor` | ✅ | Pubkey of the deployed `MerkleDistributor` account |\n| `vault` | ✅ | Pubkey of the distributor's token vault (holds the supply) |\n| `programId` |  | Distributor program (defaults to the Jupiter merkle-distributor) |\n| `title` |  | Widget header text (default: `\"claim your airdrop\"`) |\n| `className` |  | Added to the root `.ap-widget` element |\n| `explorerUrl` |  | `(sig) => string` — defaults to Solscan |\n\n## Headless mode\n\nIf you want to build your own UI, skip the component and use the hook:\n\n```tsx\nimport { useAirdropClaim } from \"@airdropprotocol/widget\";\nimport { useConnection, useWallet } from \"@solana/wallet-adapter-react\";\n\nfunction Custom() {\n  const { connection } = useConnection();\n  const { publicKey, signTransaction } = useWallet();\n  const state = useAirdropClaim({\n    proofsUrl: \"/proofs.json\",\n    distributor: \"...\",\n    vault: \"...\",\n    connection,\n    wallet: { publicKey, signTransaction },\n  });\n  // state.phase: \"loading\" | \"not-connected\" | \"not-eligible\" | \"eligible\" | \"claiming\" | \"claimed\" | \"error\"\n  // state.allocation, state.signature, state.error\n  // state.claim() — triggers the claim tx\n}\n```\n\n## Theming\n\nThe widget uses CSS variables on `.ap-widget`. Override at any level:\n\n```css\n.ap-widget {\n  --ap-accent:    #6fe3a5;\n  --ap-fg:        #0b0b0b;\n  --ap-bg:        #ffffff;\n  --ap-border:    #0b0b0b;\n  --ap-radius:    12px;\n  --ap-font:      \"Inter\", system-ui, sans-serif;\n  --ap-font-mono: \"JetBrains Mono\", ui-monospace, monospace;\n}\n```\n\nFull prop / hook / theming reference:\n[`docs/widget.md`](https://github.com/airdropprotocol/airdrop-protocol/blob/main/docs/widget.md).\n\n## License\n\nMIT\n","readmeFilename":"README.md"}