{"_id":"@billmyagent/payments-vue","_rev":"6-59edc5ac3337d47aeb54c4baaba60155","name":"@billmyagent/payments-vue","dist-tags":{"latest":"4.0.0"},"versions":{"2.1.0":{"name":"@billmyagent/payments-vue","version":"2.1.0","_id":"@billmyagent/payments-vue@2.1.0","maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"dist":{"shasum":"050175755213a9b5b21b0e2811edca88bc358bbf","tarball":"https://registry.npmjs.org/@billmyagent/payments-vue/-/payments-vue-2.1.0.tgz","fileCount":14,"integrity":"sha512-j+0FB/8zegyx0kGMThuKIp/xHLReJCl7aKnQ8OgEP8dmiDOlWt1IQdJ+w/NSNRnIRkDcracj623aS9lchByULQ==","signatures":[{"sig":"MEQCICd+1x7S8i9wCyu3eSBa3PZQF2v7mtee2mrsz43MDzrfAiAYDzdaU2zonl0vbIDtIcy32VbMeP6u9bFtUhlFUJ0e9g==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19325},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"cc32d76b234dd10ecbfe465c2da6edc70935301a","scripts":{"test":"jest","build":"tsc"},"_npmUser":{"name":"billmyagentadmin","email":"admin@billmyagent.ai"},"overrides":{"js-yaml@<4.2.0":"^4.2.0"},"deprecated":"Broken deps; use >=2.1.2","_npmVersion":"10.8.2","description":"Vue composable + button for paying x402-gated APIs (viem signer)","directories":{},"_nodeVersion":"20.20.2","dependencies":{"vue":"^3.0.0","@billmyagent/payments-core":"^2.1.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","ts-jest":"^29.2.5","typescript":"^5.7.3","@types/jest":"^29.5.14","@types/node":"^22.10.5"},"peerDependencies":{"vue":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/payments-vue_2.1.0_1782746325418_0.177222663613108","host":"s3://npm-registry-packages-npm-production"}},"2.1.1":{"name":"@billmyagent/payments-vue","version":"2.1.1","_id":"@billmyagent/payments-vue@2.1.1","maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"dist":{"shasum":"99a6fa7e0e0c1788482139fa26ca01030d0115a8","tarball":"https://registry.npmjs.org/@billmyagent/payments-vue/-/payments-vue-2.1.1.tgz","fileCount":14,"integrity":"sha512-hsF6ibqOTNB9cdS1cnOJJ8G9e/CyJjMw1AcKnkLTV+qLBqoKegce93GD+ek9yVBDNOb+b01O9YUQCx+dGZBvdg==","signatures":[{"sig":"MEUCIBTOBKIjSGTY9Zmqw4H1Pk3ndwWM9q9f668LOpTAglcuAiEA/RGHqYLgNvtBEZiYqzOKx/WXuaThNJNof20Zp3I+Yb4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19325},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"d802171578bd411e0af14bae73473c0addf71561","scripts":{"test":"jest","build":"tsc"},"_npmUser":{"name":"billmyagentadmin","email":"admin@billmyagent.ai"},"overrides":{"js-yaml@<4.2.0":"^4.2.0"},"_npmVersion":"10.8.2","description":"Vue composable + button for paying x402-gated APIs (viem signer)","directories":{},"_nodeVersion":"20.20.2","dependencies":{"vue":"^3.0.0","@billmyagent/payments-core":"^2.1.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","ts-jest":"^29.2.5","typescript":"^5.7.3","@types/jest":"^29.5.14","@types/node":"^22.10.5"},"peerDependencies":{"vue":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/payments-vue_2.1.1_1782748726069_0.031323477907488906","host":"s3://npm-registry-packages-npm-production"}},"2.1.2":{"name":"@billmyagent/payments-vue","version":"2.1.2","license":"Apache-2.0","_id":"@billmyagent/payments-vue@2.1.2","maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"homepage":"https://developer.billmyagent.ai","bugs":{"url":"https://github.com/RealMaxPower/payment-processing/issues"},"dist":{"shasum":"363a09e2b6638a6fd4824ec0f4b960703fd21bfc","tarball":"https://registry.npmjs.org/@billmyagent/payments-vue/-/payments-vue-2.1.2.tgz","fileCount":14,"integrity":"sha512-Sgi0DlQeMW4/3mojA+57V4mh1/Vqx3NDwrsJ3Ofm9oTfEzTzf/deu2qvnC0uWIRvXwXMMFNYnpE3wPh1jXCq7g==","signatures":[{"sig":"MEYCIQC5FQobHpqXMzJRrFzs+bP7/cpomqpOdM9Iw2Nkhk7zBQIhANeUxRqQ7eQvYmPeq5/0NYkx/7eHou2SKYvgsp8gyLxd","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19544},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"234016b07c1e9e790a6f47346c48adf0b5509568","scripts":{"test":"jest","build":"tsc"},"_npmUser":{"name":"billmyagentadmin","email":"admin@billmyagent.ai"},"overrides":{"js-yaml@<4.2.0":"^4.2.0"},"repository":{"url":"git+https://github.com/RealMaxPower/payment-processing.git","type":"git","directory":"sdk/vue"},"_npmVersion":"10.8.2","description":"Vue composable + button for paying x402-gated APIs (viem signer)","directories":{},"_nodeVersion":"20.20.2","dependencies":{"vue":"^3.0.0","@billmyagent/payments-core":"^2.1.2"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","ts-jest":"^29.2.5","typescript":"^5.7.3","@types/jest":"^29.5.14","@types/node":"^22.10.5"},"peerDependencies":{"vue":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/payments-vue_2.1.2_1782759649034_0.8001103180873921","host":"s3://npm-registry-packages-npm-production"}},"2.2.0":{"name":"@billmyagent/payments-vue","version":"2.2.0","license":"Apache-2.0","_id":"@billmyagent/payments-vue@2.2.0","maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"homepage":"https://developer.billmyagent.ai","bugs":{"url":"https://github.com/RealMaxPower/payment-processing/issues"},"dist":{"shasum":"08b698c082210520763951b9a10782a48df38ee6","tarball":"https://registry.npmjs.org/@billmyagent/payments-vue/-/payments-vue-2.2.0.tgz","fileCount":14,"integrity":"sha512-MqWpf68DrIcDVkme8NROnPqjpS9V4kFMECxnYXVKDXmHy0tIte40RpiUzdTG78CNCdLjjOYmvk542iVnSEtS4g==","signatures":[{"sig":"MEUCICzRyHSdE0U66QgGCGxLZXG++fMSh4A3j/s6P/R/dUyaAiEA7r2u/kvlVTjC39KObPgGRobNh8XEuAEQ/+wZcNqCNZk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19848},"main":"dist/index.js","types":"dist/index.d.ts","gitHead":"a36b3207f9e79b526a6bd22a15d7ed831f5eb5da","scripts":{"test":"jest","build":"tsc"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:179bf9a9-0df8-4ab2-979c-64a2eab5ca48"}},"overrides":{"nanoid@<3.3.17":"^3.3.18","brace-expansion":"^5.0.9","js-yaml@<=4.3.1":"^4.3.2","postcss@<=8.5.22":"^8.5.25","browserslist@<=4.28.6":"^4.28.7"},"repository":{"url":"git+https://github.com/RealMaxPower/payment-processing.git","type":"git","directory":"sdk/vue"},"_npmVersion":"11.19.1","description":"Vue composable + button for paying x402-gated APIs (viem signer)","directories":{},"_nodeVersion":"20.20.2","dependencies":{"vue":"^3.0.0","@billmyagent/payments-core":"^3.0.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","ts-jest":"^29.2.5","typescript":"^5.7.3","@types/jest":"^29.5.14","@types/node":"^22.10.5"},"peerDependencies":{"vue":"^3.0.0"},"_npmOperationalInternal":{"tmp":"tmp/payments-vue_2.2.0_1789274417867_0.09383618417661066","host":"s3://npm-registry-packages-npm-production"}},"4.0.0":{"_id":"@billmyagent/payments-vue@4.0.0","bugs":{"url":"https://github.com/RealMaxPower/payment-processing/issues"},"dist":{"shasum":"6c9f4685e01868ec9c117574d8aaab0fceb08434","tarball":"https://registry.npmjs.org/@billmyagent/payments-vue/-/payments-vue-4.0.0.tgz","fileCount":14,"integrity":"sha512-QcZEarfpfY/sL6LXaotPNhG/zb/27j35SBd4SWurr1I0ztvxhkh95c/VarC3Rn3R6N96s4i58PGVyWexKhdknw==","signatures":[{"sig":"MEQCID4DTYlFAlxHgzaP6W7Upyv9/1TcBpmqXwRaReJZ8KsSAiBOui3qBsbjVG0sOh05W+XaapKQJK++1iMrkHnc2zxYHQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQC7Zp1/nq/8gh07FwdZFOd63X1pWgIh1hMjv3jvnBrtQwIhAI7YwDaBgT1Mv6ZWKIobt2h0TAXDmymU+baBGRamxeI4"}],"unpackedSize":19848},"main":"dist/index.js","name":"@billmyagent/payments-vue","types":"dist/index.d.ts","gitHead":"b8e62639f594cd3f9bf0363ea3ff5493a9e55af6","license":"Apache-2.0","scripts":{"test":"jest","build":"tsc"},"version":"4.0.0","_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:179bf9a9-0df8-4ab2-979c-64a2eab5ca48"}},"homepage":"https://developer.billmyagent.ai","overrides":{"nanoid@<3.3.17":"^3.3.18","brace-expansion":"^5.0.9","js-yaml@<=4.3.1":"^4.3.2","postcss@<=8.5.22":"^8.5.25","browserslist@<=4.28.6":"^4.28.7"},"repository":{"url":"git+https://github.com/RealMaxPower/payment-processing.git","type":"git","directory":"sdk/vue"},"_npmVersion":"11.20.0","description":"Vue composable + button for paying x402-gated APIs (viem signer)","directories":{},"maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"_nodeVersion":"20.20.2","dependencies":{"vue":"^3.0.0","@billmyagent/payments-core":"^4.0.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^29.7.0","ts-jest":"^29.2.5","typescript":"^5.7.3","@types/jest":"^29.5.14","@types/node":"^22.10.5"},"peerDependencies":{"vue":"^3.0.0"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/payments-vue_4.0.0_1790531307640_0.3259801826587092"}}},"time":{"created":"2026-06-29T15:18:45.152Z","modified":"2026-09-27T17:48:27.938Z","2.1.0":"2026-06-29T15:18:45.566Z","2.1.1":"2026-06-29T15:58:46.249Z","2.1.2":"2026-06-29T19:00:49.187Z","2.2.0":"2026-09-13T04:40:17.999Z","4.0.0":"2026-09-27T17:48:27.732Z"},"bugs":{"url":"https://github.com/RealMaxPower/payment-processing/issues"},"license":"Apache-2.0","homepage":"https://developer.billmyagent.ai","repository":{"url":"git+https://github.com/RealMaxPower/payment-processing.git","type":"git","directory":"sdk/vue"},"description":"Vue composable + button for paying x402-gated APIs (viem signer)","maintainers":[{"name":"realmaxpower","email":"contactme@marshallcahill.com"},{"name":"billmyagentadmin","email":"admin@billmyagent.ai"}],"readme":"# @billmyagent/payments-vue\n\nVue 3 composable and component for the [x402 payment protocol](https://www.x402.org).\n\nA thin wrapper around [@billmyagent/payments-core](../core) that lets Vue apps\ncall **x402-gated URLs** and automatically pay the HTTP 402 challenge when one is\nreturned (the core client signs an EIP-3009 `transferWithAuthorization` and the\nfacilitator settles it on-chain):\n\n- `<PaymentButton>` — drop-in button that calls a URL and pays the 402, with built-in loading and error states\n- `usePayment()` — composable for calling an x402-gated URL imperatively and tracking the request lifecycle\n\n## Install\n\n```bash\nnpm install @billmyagent/payments-vue @billmyagent/payments-core\n```\n\nPeer dependency: Vue `>=3.0.0`.\n\n## Quick start\n\nBuild a `PaymentClient` with a `signer`. In a browser, pass a viem wallet client\nbacked by the user's wallet; on a server/agent, build one from a private key with\n`createSigner` (never ship a real key to a browser).\n\n### Drop-in button\n\n```vue\n<script setup lang=\"ts\">\nimport { PaymentButton, PaymentClient, createSigner } from '@billmyagent/payments-vue';\n\nconst signer = await createSigner('base', import.meta.env.VITE_PRIVATE_KEY);\nconst client = new PaymentClient({ signer });\n</script>\n\n<template>\n  <PaymentButton\n    :client=\"client\"\n    url=\"https://api.example.com/premium-article\"\n    label=\"Read article\"\n    :onSuccess=\"(data) => console.log('unlocked:', data)\"\n    :onError=\"(err) => console.error(err)\"\n  />\n</template>\n```\n\n### Imperative composable\n\n```vue\n<script setup lang=\"ts\">\nimport { usePayment } from '@billmyagent/payments-vue';\n\nconst { pay, data, loading, error, paid } = usePayment(client);\n</script>\n\n<template>\n  <button :disabled=\"loading\" @click=\"pay('https://api.example.com/premium')\">\n    {{ loading ? 'Loading…' : 'Load premium' }}\n  </button>\n  <p v-if=\"error\">Error: {{ error.message }}</p>\n  <p v-else-if=\"data\">Loaded{{ paid ? ' (paid)' : '' }}: {{ data }}</p>\n</template>\n```\n\n## API\n\n### `<PaymentButton>` props\n\n| prop | type | required | notes |\n|---|---|---|---|\n| `client` | `PaymentClient` | yes | instance created with a `signer` |\n| `url` | `string` | yes | the x402-gated URL to call (and pay, if challenged) |\n| `requestConfig` | `AxiosRequestConfig` | no | method, headers, body, params |\n| `label` | `string` | no | button label; defaults to `\"Pay\"` |\n| `onSuccess` | `(data: unknown) => void` | no | |\n| `onError` | `(error: Error) => void` | no | |\n\n### `usePayment(client)`\n\nReturns `{ data, loading, error, paid, pay, reset }` as refs/functions:\n\n- `pay(url, config?)` — call an x402-gated URL; if it responds 402 and the client\n  has a signer, the payment is made and the request retried. Resolves with the body.\n- `paid` — `true` when the most recent call required and completed a payment.\n- `reset()` — clear `data`, `error`, and `paid`.\n\nFor merchant account operations and the payment REST API, use the `PaymentClient`\nmethods directly — see [@billmyagent/payments-core](../core).\n\n## Supported networks\n\nEVM only, `exact` scheme: **Base** (and **Base Sepolia** for testing). Ethereum L1 and Polygon appear in the types for historic rows and are not settled.\n\n## Development\n\n```bash\n# from sdk/vue/\nnpm install\nnpm test\nnpm run build\n```\n\n## License\n\nApache 2.0 — see [LICENSE](../../LICENSE).\n</content>\n","readmeFilename":"README.md"}