{"_id":"@arto-pay/js-sdk","_rev":"7-74bdc028bbeb1b00875004c5f14ada07","name":"@arto-pay/js-sdk","dist-tags":{"dev":"1.0.1-dev.15.0","latest":"1.0.4"},"versions":{"1.0.0":{"name":"@arto-pay/js-sdk","version":"1.0.0","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.0","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"4b2e14258deb0c59cbb52510b66c35db3daab4c0","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.0.tgz","fileCount":12,"integrity":"sha512-0QvTnPvfW+Nrg3v7cNSOpVFtnCwYqobR+uHiCvaa+XJ+cavuBt6DpeAer3zJWrjopycl77Naa6mFIS6R6GaNNQ==","signatures":[{"sig":"MEUCICLcqiV7lcbftRTq93KzCLz2XlTOL+drvoPVNnF0CqzdAiEAmLITzVQCjtyqAyaoy4geUoCMFraMtXI+yVc8vBEq5ng=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":70716},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"078e563314ac61ddddc59ec3eef06d6474211158","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.6.2","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"25.2.1","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.0_1776849068341_0.5375815649223847","host":"s3://npm-registry-packages-npm-production"}},"1.0.1-dev.12.0.0":{"name":"@arto-pay/js-sdk","version":"1.0.1-dev.12.0.0","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.1-dev.12.0.0","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"43054c48c093c6025ff629883917367b24197304","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.1-dev.12.0.0.tgz","fileCount":12,"integrity":"sha512-90fwFnxjqi63OblEOhPOHsfknjTn5Ppahb8s80MeRTDYxxt0v9QatkDiOTI92r5F9LWC+XxRxn2bAbRa4fbR4g==","signatures":[{"sig":"MEUCIQDCIAqhZDs+/KKqKh+Atsnspqr0uKEmdlKuKFlby+/KYgIgDh1HYtEEbfnu3I3Uuq8N1QwR//eqmcofQsfhlH7KsVw=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":70712},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"078e563314ac61ddddc59ec3eef06d6474211158","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.6.2","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"25.2.1","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.1-dev.12.0.0_1776849399447_0.7747717489746235","host":"s3://npm-registry-packages-npm-production"}},"1.0.1-dev.15.0":{"name":"@arto-pay/js-sdk","version":"1.0.1-dev.15.0","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.1-dev.15.0","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"f8f9f76b31f20bbb8ab8a540354ab6c4523f0720","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.1-dev.15.0.tgz","fileCount":12,"integrity":"sha512-0zzG1IaNp8OBxacrSvVMiMsS4EQm+UVy5V7rTivRv0UA1+kR2fSrIxP+3CRmMVNH32SnbS6ShXvMRAfrTCxkYw==","signatures":[{"sig":"MEYCIQCgHCmjNvIuTVNPfRTxBuUjEkHxWNxX3LCix/MXwQ15kwIhAMG35FbIdd9J1j3eZS5qIIvFLMhPHiUpClvUQigTIRtE","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":71068},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"a48d6dec3221a27eeaff01344d0d9283248d361e","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.12.1","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"24.15.0","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.1-dev.15.0_1777887416627_0.9058373584161461","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@arto-pay/js-sdk","version":"1.0.1","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.1","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"651ec4c30335e852db48cd0c41db9e39cfb69d7f","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.1.tgz","fileCount":12,"integrity":"sha512-SZLdVllW4d/wDc/YdHvl3I8NQV8nZoEx6PYYxUWE8vwlvmw9cdsGF+hZCf5u6HFP/skR+V2dJF08sIlsjpVL2g==","signatures":[{"sig":"MEUCIQCP7C8yFUneoM0IqQXFT6Qcnuo6iz5pw74sq7mSjKxX4QIgYcRU+kMwiOi3g0jfF8Kz78S3qQYgjZbL3Wu/D+cGHWA=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":71423},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"24500ee5066f0a671b9a5991de380d3fb7d9c3f3","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5da44641-0a6c-4393-b54b-a7fb054a66b9"}},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.12.1","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"24.15.0","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.1_1779285412280_0.6940024219510366","host":"s3://npm-registry-packages-npm-production"}},"1.0.2":{"name":"@arto-pay/js-sdk","version":"1.0.2","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.2","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"8451f79eed922be40ab19ce758deb2c3610b4604","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.2.tgz","fileCount":13,"integrity":"sha512-kuIo4gpBZbehWHWhzBBcIkx2aswkMxwq+fvTxdgJevI9SniDjBtojj7aNxUqAQiZWFrJBwVGKZPafFcHkTu0+A==","signatures":[{"sig":"MEYCIQCbRkz4Zw9u1MqI+NZPDpQhC/UVDX+pYSwPTT7dq2yzfQIhALuoKao5D//4JcZsjOUw3ky5spYmUPzUmNGN818tBkXF","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":73626},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"bf06266c8f32d062346f9cc8041fb1c1543042b1","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"GitHub Actions","email":"npm-oidc-no-reply@github.com","trustedPublisher":{"id":"github","oidcConfigId":"oidc:5da44641-0a6c-4393-b54b-a7fb054a66b9"}},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.13.0","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"24.16.0","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.2_1781575329514_0.7310531855233633","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@arto-pay/js-sdk","version":"1.0.3","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"author":{"name":"Ojire"},"license":"MIT","_id":"@arto-pay/js-sdk@1.0.3","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"dist":{"shasum":"6f49bb0d337e7bd9f06c939cd9e846f94719c03a","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.3.tgz","fileCount":13,"integrity":"sha512-Dd3RROFdXlMulNPZZZTIz5qyPqlpIY0gluFjhaowObDB+QIGD3ha+67JZrt3wY9jgFY/v7vEZcRqcr22kPEZfQ==","signatures":[{"sig":"MEYCIQCXdefMV4lgqJRwk5iYchmYWJ6BSU6wOZcTou1jaNiyQQIhAMSFMZfQzL6H0i6/JpCFOuY9gqjmHYWcRNqMIRjvP6oK","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":82938},"main":"dist/arto-pay-sdk.umd.js","type":"module","types":"dist/index.d.ts","module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"1e6e99659538563ffc60a571703619d042898261","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"_npmUser":{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"},"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.6.2","description":"Arto Pay JavaScript SDK","directories":{},"_nodeVersion":"25.2.1","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"tmp":"tmp/js-sdk_1.0.3_1785996693098_0.4085905207224052","host":"s3://npm-registry-packages-npm-production"}},"1.0.4":{"_id":"@arto-pay/js-sdk@1.0.4","dist":{"shasum":"27d624c9315412bc79487ec183e4903060b872f4","tarball":"https://registry.npmjs.org/@arto-pay/js-sdk/-/js-sdk-1.0.4.tgz","fileCount":13,"integrity":"sha512-mL7bzyIbbkeF0QM8oE5oS6sjTfVnh2caS3GAip/xBN2a7tfRrzBxm3iJXOXUoR2C7Bz8s4JRXn/uy69W36rvfQ==","signatures":[{"sig":"MEUCIQCcRbK4L92FmtN6z9fiJHFre/BepdQ0095R0YSAtfyXKQIgMDgSBKwB9soJW/LZBGgkClikDQ9i0WuClWyFFtRHIgo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"},{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCQm9ptlvwmD4apdSFSUzPutsdryVuMmzwXYLLq+crrtgIgd7b3ZBU4W6QdDCNCyXm1cgSWKAzFrsRvc/nUm0HkhBU="}],"unpackedSize":74016},"main":"dist/arto-pay-sdk.umd.js","name":"@arto-pay/js-sdk","type":"module","types":"dist/index.d.ts","author":{"name":"Ojire"},"module":"dist/arto-pay-sdk.esm.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/arto-pay-sdk.esm.js","require":"./dist/arto-pay-sdk.umd.js"}},"gitHead":"c09948125ad59247cf07d742e7a8d81b7fb037fd","license":"MIT","scripts":{"dev":"rollup -c -w","build":"rollup -c","clean":"rm -rf dist","start":"node server.js","build:types":"tsc --emitDeclarationOnly","prepublishOnly":"npm run clean && npm run build && npm run build:types"},"version":"1.0.4","_npmUser":{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"},"keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"_npmVersion":"11.6.2","description":"Arto Pay JavaScript SDK","directories":{},"maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"_nodeVersion":"25.2.1","browserslist":["> 1%","last 2 versions","not dead"],"_hasShrinkwrap":false,"devDependencies":{"tslib":"^2.6.2","dotenv":"^17.2.3","rollup":"^4.9.6","typescript":"^5.3.3","@rollup/plugin-terser":"^0.4.4","@rollup/plugin-replace":"^6.0.3","@rollup/plugin-typescript":"^11.1.6"},"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/js-sdk_1.0.4_1789439713815_0.7928086335239608"}}},"time":{"created":"2026-04-22T09:11:08.180Z","modified":"2026-09-15T02:35:14.187Z","1.0.0":"2026-04-22T09:11:08.539Z","1.0.1-dev.12.0.0":"2026-04-22T09:16:39.675Z","1.0.1-dev.15.0":"2026-05-04T09:36:56.771Z","1.0.1":"2026-05-20T13:56:52.435Z","1.0.2":"2026-06-16T02:02:09.645Z","1.0.3":"2026-08-06T06:11:33.240Z","1.0.4":"2026-09-15T02:35:13.978Z"},"author":{"name":"Ojire"},"license":"MIT","keywords":["payment","gateway","ojire","arto-pay","opg","qris","virtual-account","credit-card"],"repository":{"url":"github.com/ojire-tech/opg-sdk","type":"git"},"description":"Arto Pay JavaScript SDK","maintainers":[{"name":"ojire-sdk","email":"muhammad.septian@ojire.technology"}],"readme":"# @arto-pay/js-sdk\n\nA lightweight JavaScript SDK for integrating Ojire Payment Gateway into your web applications. This SDK provides a simple modal-based payment flow that works with any JavaScript framework or vanilla JS.\n\n## Features\n\n- Modal-based payment UI\n- Support for multiple payment methods (QRIS, Virtual Account, Credit Card)\n- Sandbox and Production environments\n- TypeScript support\n- Framework agnostic (works with React, Vue, Angular, or vanilla JS)\n- Lightweight (~5KB gzipped)\n\n## Installation\n\n### NPM\n\n```bash\nnpm install @arto-pay/js-sdk\n```\n\n### Yarn\n\n```bash\nyarn add @arto-pay/js-sdk\n```\n\n### CDN (Script Tag)\n\n```html\n<script \n  src=\"https://cdn.jsdelivr.net/npm/@arto-pay/js-sdk@latest/dist/arto-pay-sdk.umd.js\" \n  data-client-key=\"pk_your_public_key_here\"\n  data-sandbox=\"true\"\n></script>\n```\n\n## Quick Start\n\n### 1. Get Your API Keys\n\nObtain your API keys from the Ojire Dashboard:\n- **Public Key** (`pk_...`): Used in frontend to identify your merchant\n- **Secret Key** (`sk_...`): Used in backend to create payment intents (never expose this in frontend!)\n\n### 2. Create Payment Intent (Backend)\n\nFirst, create a payment intent from your backend server:\n\n```javascript\n// Backend (Node.js example)\nconst response = await fetch('/v1.1/payment-intents', {\n  method: 'POST',\n  headers: {\n    'Content-Type': 'application/json',\n    'X-Secret-Key': 'sk_your_secret_key'\n  },\n  body: JSON.stringify({\n    amount: \"3850000\",\n    currency: \"IDR\",\n    customerId: \"customer_123\",\n    description: \"Order from Brutal Aquatics\",\n    metadata: {\n      \"orderId\": \"order_1778833554484\",\n      \"items\": [\n        \"HALFMOON BETTA [BLOOD RED]\",\n        \"GALAXY KOI PLAKAT\",\n        \"BLACK SAMURAI FIGHTER\"\n      ]\n    }\n  })\n});\n\nconst paymentIntent = await response.json();\n// Returns: { id, clientSecret, customerToken, ... }\n```\n\nResponse\n\n```\n{\n  \"amount\": \"3850000.00\",\n  \"secret\": \"pi_97c367e7-ac2e-472e-bc56-XXXXXXXXXXXX\",\n  \"createdAt\": \"2026-05-15T08:25:54.701513Z\",\n  \"currency\": \"IDR\",\n  \"customerToken\": \"ct_feb48b9e-20dd-406f-a1da-XXXXXXXXXXX\",\n  \"id\": \"feb48b9e-xxxx-xxxxx-xxxx-fc41f0025ad2\",\n  \"metadata\": {\n    \"items\": [\n      \"HALFMOON BETTA [BLOOD RED]\",\n      \"GALAXY KOI PLAKAT\",\n      \"BLACK SAMURAI FIGHTER\"\n    ],\n    \"orderId\": \"order_1778833554484\"\n  },\n  \"status\": \"created\"\n}\n```\n\n### 3. Open Payment Modal (Frontend)\n\n#### Using Script Tag (Vanilla JS)\n\n```html\n<!DOCTYPE html>\n<html>\n<head>\n  <title>Checkout</title>\n</head>\n<body>\n  <button id=\"pay-button\">Pay Now</button>\n\n  <script \n    src=\"https://cdn.jsdelivr.net/npm/@arto-pay/js-sdk@latest/dist/arto-pay-sdk.umd.js\" \n    data-client-key=\"pk_your_public_key\"\n    data-sandbox=\"true\"\n  ></script>\n  \n  <script>\n    document.getElementById('pay-button').addEventListener('click', function() {\n      // paymentIntent should come from your backend\n      ArtoPay.openPayment({\n        token: paymentIntent.customerToken,\n        clientSecret: paymentIntent.secret,\n        paymentId: paymentIntent.id,\n        orderId: 'order_12345',\n        \n        onSuccess: function(result) {\n          console.log('Payment successful!', result);\n          // Redirect to success page or update UI\n        },\n        \n        onPending: function(result) {\n          console.log('Payment pending', result);\n          // Show pending message\n        },\n        \n        onError: function(result) {\n          console.log('Payment failed', result);\n          // Show error message\n        }\n      });\n    });\n  </script>\n</body>\n</html>\n```\n\n#### Using ES Modules\n\n```javascript\nimport ArtoPay from '@arto-pay/js-sdk';\n\n// Configure SDK\nArtoPay.configure({\n  sandbox: true // Set to false for production\n});\n\n// Open payment modal\nArtoPay.openPayment({\n  token: paymentIntent.customerToken,\n  clientSecret: paymentIntent.secret,\n  paymentId: paymentIntent.id,\n  orderId: 'order_12345',\n  \n  onSuccess: (result) => {\n    console.log('Payment successful!', result);\n  },\n  \n  onPending: (result) => {\n    console.log('Payment pending', result);\n  },\n  \n  onError: (result) => {\n    console.log('Payment failed', result);\n  }\n});\n```\n\n## API Reference\n\n### ArtoPay.openPayment(options)\n\nOpens the payment modal.\n\n#### Options\n\n| Parameter | Type | Required | Description |\n|-----------|------|----------|-------------|\n| `token` | `string` | No | Customer token from payment intent |\n| `secret` | `string` | Yes | Client secret from payment intent |\n| `paymentId` | `string` | Yes | Payment intent ID |\n| `orderId` | `string` | Yes | Order ID for tracking |\n| `sandbox` | `boolean` | No | Override sandbox mode for this payment |\n| `onSuccess` | `function` | No | Callback when payment succeeds |\n| `onPending` | `function` | No | Callback when payment is pending |\n| `onError` | `function` | No | Callback when payment fails |\n\n#### Example\n\n```javascript\nArtoPay.openPayment({\n  token: 'cust_token_xxx',\n  secret: 'pi_secret_xxx',\n  paymentId: 'pi_xxx',\n  orderId: 'order_12345',\n  sandbox: true,\n  \n  onSuccess: (result) => {\n    console.log('Transaction status:', result.transactionStatus);\n    console.log('Mapped status:', result.status);\n    console.log('Raw data:', result.rawData);\n  },\n  \n  onPending: (result) => {\n    // Handle pending payment (e.g., waiting for bank transfer)\n  },\n  \n  onError: (result) => {\n    // Handle failed payment\n  }\n});\n```\n\n### ArtoPay.closePayment()\n\nProgrammatically closes the payment modal.\n\n```javascript\nArtoPay.closePayment();\n```\n\n### ArtoPay.isPaymentOpen()\n\nReturns `true` if the payment modal is currently open.\n\n```javascript\nif (ArtoPay.isPaymentOpen()) {\n  console.log('Modal is open');\n}\n```\n\n### ArtoPay.configure(config)\n\nConfigures SDK settings.\n\n```javascript\nArtoPay.configure({\n  sandbox: false // Set to true for sandbox, false for production\n});\n```\n\n### ArtoPay.isSandbox()\n\nReturns `true` if SDK is in sandbox mode.\n\n```javascript\nif (ArtoPay.isSandbox()) {\n  console.log('Running in sandbox mode');\n}\n```\n\n## Callback Result Object\n\nAll callbacks receive a `PaymentResult` object:\n\n```typescript\ninterface PaymentResult {\n  transactionStatus: TransactionStatus;\n  status: 'success' | 'pending' | 'error';\n  rawData: Record<string, unknown>;\n}\n```\n\n### Transaction Status Values\n\n| Status | Mapped To | Description |\n|--------|-----------|-------------|\n| `settlement` | `success` | Payment completed |\n| `capture` | `success` | Payment captured |\n| `pending` | `pending` | Waiting for payment |\n| `challenge` | `pending` | Needs verification |\n| `deny` | `error` | Payment denied |\n| `cancel` | `error` | Payment cancelled |\n| `expire` | `error` | Payment expired |\n| `failure` | `error` | Payment failed |\n\n## React Integration\n\n```tsx\nimport React, { useState } from 'react';\nimport ArtoPay from '@arto-pay/js-sdk';\nimport type { PaymentResult } from '@arto-pay/js-sdk';\n\nfunction CheckoutButton() {\n  const [loading, setLoading] = useState(false);\n  const [status, setStatus] = useState<string>('');\n\n  const handlePayment = async () => {\n    setLoading(true);\n    \n    try {\n      // Get payment intent from your backend\n      const response = await fetch('/v1.1/payment-intents', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ amount: 100000 })\n      });\n      const paymentIntent = await response.json();\n      \n      ArtoPay.openPayment({\n        token: paymentIntent.customerToken,\n        clientSecret: paymentIntent.clientSecret,\n        paymentId: paymentIntent.id,\n        orderId: 'order_12345',\n        \n        onSuccess: (result: PaymentResult) => {\n          setLoading(false);\n          setStatus('Payment successful!');\n          // Redirect or update UI\n        },\n        \n        onPending: (result: PaymentResult) => {\n          setLoading(false);\n          setStatus('Payment pending. Please complete the payment.');\n        },\n        \n        onError: (result: PaymentResult) => {\n          setLoading(false);\n          setStatus(`Payment failed: ${result.transactionStatus}`);\n        }\n      });\n    } catch (error) {\n      setLoading(false);\n      setStatus('Failed to initialize payment');\n    }\n  };\n\n  return (\n    <div>\n      <button onClick={handlePayment} disabled={loading}>\n        {loading ? 'Processing...' : 'Pay Now'}\n      </button>\n      {status && <p>{status}</p>}\n    </div>\n  );\n}\n\nexport default CheckoutButton;\n```\n\n## Vue Integration\n\n```vue\n<template>\n  <div>\n    <button @click=\"handlePayment\" :disabled=\"loading\">\n      {{ loading ? 'Processing...' : 'Pay Now' }}\n    </button>\n    <p v-if=\"status\">{{ status }}</p>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport ArtoPay from '@arto-pay/js-sdk';\nimport type { PaymentResult } from '@arto-pay/js-sdk';\n\nconst loading = ref(false);\nconst status = ref('');\n\nconst handlePayment = async () => {\n  loading.value = true;\n  \n  try {\n    const response = await fetch('/v1.1/payment-intents', {\n      method: 'POST',\n      headers: { 'Content-Type': 'application/json' },\n      body: JSON.stringify({ amount: 100000 })\n    });\n    const paymentIntent = await response.json();\n    \n    ArtoPay.openPayment({\n      token: paymentIntent.customerToken,\n      clientSecret: paymentIntent.clientSecret,\n      paymentId: paymentIntent.id,\n      orderId: 'order_12345',\n      \n      onSuccess: (result: PaymentResult) => {\n        loading.value = false;\n        status.value = 'Payment successful!';\n      },\n      \n      onPending: (result: PaymentResult) => {\n        loading.value = false;\n        status.value = 'Payment pending';\n      },\n      \n      onError: (result: PaymentResult) => {\n        loading.value = false;\n        status.value = `Payment failed: ${result.transactionStatus}`;\n      }\n    });\n  } catch (error) {\n    loading.value = false;\n    status.value = 'Failed to initialize payment';\n  }\n};\n</script>\n```\n\n## Configuration\n\n### Script Tag Attributes\n\nWhen using the CDN version, configure via data attributes:\n\n```html\n<script \n  src=\"https://cdn.jsdelivr.net/npm/@arto-pay/js-sdk@latest/dist/arto-pay-sdk.umd.js\" \n  data-client-key=\"pk_your_public_key\"\n  data-sandbox=\"true\"\n></script>\n```\n\n| Attribute | Description |\n|-----------|-------------|\n| `data-client-key` | Your public key (required) |\n| `data-sandbox` | Set to `\"true\"` for sandbox, `\"false\"` for production |\n\n### Programmatic Configuration\n\n```javascript\nimport ArtoPay from '@arto-pay/js-sdk';\n\nArtoPay.configure({\n  sandbox: process.env.NODE_ENV !== 'production'\n});\n```\n\n## Environments\n\n| Environment | API URL |\n|-------------|---------|\n| Sandbox | `https://api-sandbox.arto-pay.com` |\n| Production | `https://api.arto-pay.com` |\n\n## TypeScript Support\n\nThe SDK includes TypeScript definitions. Import types as needed:\n\n```typescript\nimport ArtoPay, { \n  PaymentResult, \n  PaymentCallbacks, \n  OpenPaymentOptions,\n  TransactionStatus,\n  PaymentResultStatus \n} from '@arto-pay/js-sdk';\n```\n\n## Error Handling\n\n```javascript\ntry {\n  ArtoPay.openPayment({\n    token: paymentIntent.customerToken,\n    clientSecret: paymentIntent.secret,\n    paymentId: paymentIntent.id,\n    orderId: 'order_12345',\n    \n    onError: (result) => {\n      switch (result.transactionStatus) {\n        case 'expire':\n          alert('Payment expired. Please try again.');\n          break;\n        case 'cancel':\n          alert('Payment was cancelled.');\n          break;\n        case 'deny':\n          alert('Payment was denied. Please use a different payment method.');\n          break;\n        default:\n          alert('Payment failed. Please try again.');\n      }\n    }\n  });\n} catch (error) {\n  // Handle SDK initialization errors\n  console.error('SDK Error:', error.message);\n}\n```\n\n## Security Best Practices\n\n1. **Never expose your Secret Key** in frontend code\n2. **Always create payment intents on your backend**\n3. **Validate payment status on your backend** after receiving callbacks\n4. **Use HTTPS** in production\n5. **Verify webhook signatures** for server-to-server notifications\n\n## Browser Support\n\n- Chrome (latest)\n- Firefox (latest)\n- Safari (latest)\n- Edge (latest)\n- Mobile browsers (iOS Safari, Chrome for Android)\n\n## Changelog\n\n### v1.0.0\n- Initial release\n- Modal-based payment flow\n- Support for QRIS, Virtual Account, and Credit Card\n- Sandbox and Production environments\n- TypeScript definitions\n\n### v1.0.1\n- Fixing README.md documentation\n\n## Support\n\n- Documentation: [https://docs.arto-pay.com](https://docs.arto-pay.com)\n\n## License\n\nMIT License - see [LICENSE](LICENSE) for details.\n","readmeFilename":"README.md"}