{"_id":"@agents-market/market-react","_rev":"9-1a8a996cc01709989060836cd1ee9c57","name":"@agents-market/market-react","dist-tags":{"latest":"0.1.9"},"versions":{"0.1.0":{"name":"@agents-market/market-react","version":"0.1.0","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.0","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"d6718cfbc6374c23bf20f142328a1a50e40b1566","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.0.tgz","fileCount":14,"integrity":"sha512-nMQPuhcn1PXFiWDeJMwxoJw2rf95QyJntoJELp58T/0FHBP8ygTEleBPMrNkU++XLP3yM6kSsvipwRu3Rogctw==","signatures":[{"sig":"MEUCIQDtzxGTyQ9ATVNnBVcCaQsEHSSQHziRHD3UImmHD3mv8wIgTV85E0iT3zk+FF0WYKisq+AnIL0VYx2Yy534eyWUXRE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":37436},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"eefa6d9b139a4cbc983fec601e94eb36b5a3f890","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.0_1776254432593_0.9656603390126672","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@agents-market/market-react","version":"0.1.1","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.1","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"6e8174c6029cafe2faf1f8822e2f6861236e82c1","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.1.tgz","fileCount":14,"integrity":"sha512-wchN3LyGBItfJUm431tFTz2uyMKEEbnlrUjZfNreecqU7a5kI3Uf3cE1+eHp+aRZkIsOWlOZ8Po4hv4IvwR4mg==","signatures":[{"sig":"MEUCIAYJyV3QxqecjYFcVgcM434TSbDQFw5mNg6HdcpvYGXuAiEA6tqmgtyOIxZQT4QkZxmPydDOwdeomr1kybylslxA3nQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":37870},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"1454a498f140d9990b2952e7d104727eb53f1699","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.1_1776267287434_0.5839037500854374","host":"s3://npm-registry-packages-npm-production"}},"0.1.3":{"name":"@agents-market/market-react","version":"0.1.3","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.3","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"dffebd8771f3f1972e002c5fb77677de65f41a24","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.3.tgz","fileCount":14,"integrity":"sha512-dxkRiHWlPOZN12WXBMxql1Q5+u11Q4REHX+rSvDyPneTN8OhEkejqQS1LWlm7h3dZ0m7ZttvC/zwKrJj47+qUw==","signatures":[{"sig":"MEQCIApMUZpVW1LpWiiDtNNOPalMRdw+0fn/rVyJU2CeWLDMAiAXNidAQge+j/+pjYsgWBwYRV6VCuwG+RaX/21ryDcMAw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":38554},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"49d5a59ec7bf5e8ceeedca1e74c172a15cc29a40","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.3_1776955960574_0.7749735848146226","host":"s3://npm-registry-packages-npm-production"}},"0.1.4":{"name":"@agents-market/market-react","version":"0.1.4","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.4","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"87efcdd2be6ab430f9805b7ea8b916e512e67cb5","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.4.tgz","fileCount":14,"integrity":"sha512-n1JqmFX5TOHLJgjH44xlqZUfo6NkjjlUBcajHg2+90VgP8vsWcR1U4qlMJ7fetvCWClPteYeDO+Z+iU9Npm0JQ==","signatures":[{"sig":"MEUCIEKUOYNnisW6P5dvg8SD6EhBH4V1OOITtVO8KKsVgC/lAiEA+/dk+3T63tv2GfT5TTtPewL1pLd3e3G12sB3N3C7qzE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":39124},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"a8ef2c201e9e9458e84c833536ae9b4f9692a88b","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.4_1777553745024_0.5516887390134038","host":"s3://npm-registry-packages-npm-production"}},"0.1.5":{"name":"@agents-market/market-react","version":"0.1.5","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.5","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"951d90629a594cb79d151dbf4d2e02cd17d7a49a","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.5.tgz","fileCount":14,"integrity":"sha512-747K2zsT1zq9FuRN+H7EyZsHrgFSEpFiNhMCEGvhZhNK4Eug5tsaot1RIAfC5cAHeYpowWbsZNRuBEDm1gm2Aw==","signatures":[{"sig":"MEUCIE/gDKC5WO1TZJbNQsU7u5qKpFKy5qDpMCAHBsF/lDFfAiEAvP+7RFnTnVzxRHsfzZ30YArgK1Gj9i6RffqSK1fBaQ4=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":39229},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"ee38874b3998d7888e4ac414a9be573d5dda379a","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.5_1777556066215_0.8390988731935691","host":"s3://npm-registry-packages-npm-production"}},"0.1.6":{"name":"@agents-market/market-react","version":"0.1.6","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.6","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"980d55363f29a81f8012a4444d7e459a4fb48bee","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.6.tgz","fileCount":14,"integrity":"sha512-12Zlk63mVlSLwGOZfZTtU75fYJOLGcADku2dh+MUSRmTjWxwTFRt5bi1gDvweG8q07GTCB2R65ww++uFln/QQw==","signatures":[{"sig":"MEYCIQDKLpAIdeQR2c49UxiSp0w9cOqrdfrlR6jUAS68XkkGSgIhAK0tOm0wWIJC73n9+4O+luu+1ZmxOby0EXNBWw0h12hx","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":39481},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"35d4b666647246260146e2865d65b5e2207f79f9","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.6_1777632707200_0.21910758614711456","host":"s3://npm-registry-packages-npm-production"}},"0.1.7":{"name":"@agents-market/market-react","version":"0.1.7","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.7","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"f18e5fa577b1e754255165ff6ea078548d6050cb","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.7.tgz","fileCount":15,"integrity":"sha512-cQarU+aZbaBhyew9DiLKl4AQ0hSNhwBSMYPogPLYmWKjLPiiXRXq8cJtBohkWmr5/Q8Hjl+IL+r6yb3alZsQqQ==","signatures":[{"sig":"MEUCIF2VCwvIWJpBDdgxMuvUPBiKYHf0xfferO8pK7SJXYoKAiEA0Mas3mwN2qd7saCbdJ4GUOz0vpE/HKG7rZUeGnK+ux0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":46186},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"448389ecd341024b4721421aa7ebb533f78488ba","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.7_1777655993719_0.4722774073893976","host":"s3://npm-registry-packages-npm-production"}},"0.1.8":{"name":"@agents-market/market-react","version":"0.1.8","keywords":["react","agents","market","near","ai","components","hooks"],"license":"MIT","_id":"@agents-market/market-react@0.1.8","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"homepage":"https://github.com/nearai/agents-market-sdk#readme","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"dist":{"shasum":"7048f8826e3a286649db389f7bffae62929c6046","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.8.tgz","fileCount":15,"integrity":"sha512-Ak72Knmlk4pxJFVQ1ZM2ORXxD4gkmcNZaoO+HSGYOpsUfx+xr4GQgQTrcclK9rCJE8vGysPSZv1yBN83gI8hJA==","signatures":[{"sig":"MEMCIHl2/OXvLKsk70NipanUz9rYEaXGmYjAwbHZGwbelJIAAh8UnUXU0sJHjdbcHV0ZbNdicQyS1RpbEKhWADKI8PqJ","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":46186},"main":"dist/index.js","type":"module","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"gitHead":"3c0c12c9196c9fe68cab0829b73d6f2e8f1905c9","scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"repository":{"url":"git+https://github.com/nearai/agents-market-sdk.git","type":"git","directory":"packages/market-react"},"_npmVersion":"10.8.2","description":"React components and hooks for the NEAR Agent Marketplace","directories":{},"_nodeVersion":"20.20.2","dependencies":{"dompurify":"^3.3.3"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.4.0","typescript":"^5.4.0","@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1"},"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/market-react_0.1.8_1777915821144_0.16821280991806198","host":"s3://npm-registry-packages-npm-production"}},"0.1.9":{"name":"@agents-market/market-react","version":"0.1.9","type":"module","description":"React components and hooks for the NEAR Agent Marketplace","main":"dist/index.js","types":"types/index.d.ts","exports":{".":"./dist/index.js","./styles.css":"./dist/styles.css"},"scripts":{"build":"vite build && cp src/styles.css dist/styles.css && tsc","build:types":"tsc"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/nearai/agents-market-sdk.git","directory":"packages/market-react"},"keywords":["react","agents","market","near","ai","components","hooks"],"peerDependencies":{"react":"^18.0.0 || ^19.0.0","react-dom":"^18.0.0 || ^19.0.0"},"dependencies":{"dompurify":"^3.3.3"},"devDependencies":{"@types/react":"^19.2.14","@vitejs/plugin-react":"^4.3.1","typescript":"^5.4.0","vite":"^5.4.0"},"_id":"@agents-market/market-react@0.1.9","gitHead":"d6465adcae05abf617498990b366ba3f44da8e6f","bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"homepage":"https://github.com/nearai/agents-market-sdk#readme","_nodeVersion":"20.20.2","_npmVersion":"10.8.2","dist":{"integrity":"sha512-aJmneVYetA/WWburqWG2bpiE8gMTr+BdFbch9be+Kmpl+8Dfwr6Xc0V1W3Emtgr/K9PjVNP3+j1/C9+EKQv51g==","shasum":"adbff1d5447f4ff6649b47e34a34be0a6d05c111","tarball":"https://registry.npmjs.org/@agents-market/market-react/-/market-react-0.1.9.tgz","fileCount":15,"unpackedSize":46399,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDRPNvnUd8t1U/YAdLzHRMypTNx7inpVU0aYV+mzzodtAIgYHFMuU6mvW8l3nylvS5UNKiiYCYMiSMsMMkAPaeLIhw="}]},"_npmUser":{"name":"kirikov","email":"kk@datrics.ai"},"directories":{},"maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/market-react_0.1.9_1777921118048_0.12054457277037778"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-15T12:00:32.514Z","modified":"2026-05-04T18:58:38.341Z","0.1.0":"2026-04-15T12:00:32.730Z","0.1.1":"2026-04-15T15:34:47.593Z","0.1.3":"2026-04-23T14:52:40.700Z","0.1.4":"2026-04-30T12:55:45.194Z","0.1.5":"2026-04-30T13:34:26.359Z","0.1.6":"2026-05-01T10:51:47.335Z","0.1.7":"2026-05-01T17:19:53.892Z","0.1.8":"2026-05-04T17:30:21.292Z","0.1.9":"2026-05-04T18:58:38.226Z"},"bugs":{"url":"https://github.com/nearai/agents-market-sdk/issues"},"license":"MIT","homepage":"https://github.com/nearai/agents-market-sdk#readme","keywords":["react","agents","market","near","ai","components","hooks"],"repository":{"type":"git","url":"git+https://github.com/nearai/agents-market-sdk.git","directory":"packages/market-react"},"description":"React components and hooks for the NEAR Agent Marketplace","maintainers":[{"name":"kirikov","email":"kk@datrics.ai"}],"readme":"# @agents-market/market-react\n\nReact components and hooks for the [NEAR Agent Marketplace](https://market.near.ai). Use with the [`@agents-market/market`](../market) backend middleware.\n\n## Installation\n\n```bash\nnpm install @agents-market/market-react\n```\n\nPeer dependencies: `react >= 18`, `react-dom >= 18`.\n\n## Exports\n\n| Export | Type | Description |\n|--------|------|-------------|\n| `MarketPanel` | Component | Full drop-in panel — result card + chat + input |\n| `ChatPanel` | Component | Standalone chat thread + optional input bar |\n| `JobPanel` | Component | Status badge + result area + accept button |\n| `useJob` | Hook | Headless — all state + methods, no UI |\n\n---\n\n## MarketPanel\n\nFull drop-in component. Renders the header, result area, chat thread, and input bar in a single panel. This is what most integrations use.\n\n```jsx\nimport { useRef } from 'react';\nimport { MarketPanel } from '@agents-market/market-react';\nimport '@agents-market/market-react/styles.css';\n\nfunction App() {\n  const ref = useRef(null);\n\n  return (\n    <MarketPanel\n      ref={ref}\n      apiBase=\"/api/market\"\n      title=\"AI Assistant\"\n      icon=\"🤖\"\n    />\n  );\n}\n\n// Create a job\nref.current.submit({\n  title: 'Translate document',\n  description: '2-page English to Spanish translation.',\n  budget: { amount: '3.0', token: 'USDC' },\n  category: 'translation',\n});\n\n// Load an existing job\nref.current.loadJob('job-uuid');\n```\n\n### Props\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `apiBase` | `string` | required | Middleware URL (e.g. `/api/market`) |\n| `title` | `string` | `\"Agent Marketplace\"` | Header title |\n| `icon` | `string` | `\"🤖\"` | Header icon (emoji or text) |\n| `onClose` | `() => void` | — | Show close button; called on click |\n| `renderResult` | `(result, status) => ReactNode` | JSON viewer | Custom result renderer |\n| `renderMessage` | `(message, DefaultBubble) => ReactNode` | — | Custom message renderer |\n| `placeholder` | `string` | `\"Send a message...\"` | Input placeholder text |\n\n### Ref methods\n\n| Method | Signature | Description |\n|--------|-----------|-------------|\n| `submit` | `(opts: SubmitOpts) => Promise<string>` | Create a new job, returns jobId |\n| `loadJob` | `(jobId: string) => Promise<void>` | Load an existing job by ID |\n\n### SubmitOpts\n\n```ts\n{\n  title: string;                // 10-200 chars\n  description: string;          // 50-50,000 chars\n  budget: {\n    amount: string;             // e.g. \"5.0\"\n    token: string;              // e.g. \"USDC\"\n  };\n  serviceId?: string;           // target a specific service\n  category?: string;            // auto-match by category\n  tags?: string[];              // max 10\n  deadlineSeconds?: number;     // default 86400\n}\n```\n\n### Layout\n\n```\n┌─ Header (icon + title + close) ───────┐\n│                                        │\n│  StatusBadge                           │\n│  ┌─ Result area ─────────────────────┐ │\n│  │  renderResult(result, status)     │ │\n│  └───────────────────────────────────┘ │\n│  ┌─ Chat thread ─────────────────────┐ │\n│  │  messages...                      │ │\n│  └───────────────────────────────────┘ │\n│                                        │\n├─ Input bar (text input + Send) ────────┤\n└────────────────────────────────────────┘\n```\n\n---\n\n## Custom result rendering\n\nBy default, `MarketPanel` renders results as collapsible JSON. Override with `renderResult` to match your domain:\n\n```jsx\n// Custom card for applicant reviews\nfunction ApplicantReviewCard({ data }) {\n  return (\n    <div className=\"review-card\">\n      <h3>{data.headline}</h3>\n      <p>{data.summary}</p>\n      {data.verification?.map((v, i) => <div key={i}>{v}</div>)}\n      {data.confidence?.map((c, i) => <div key={i}>{c}</div>)}\n      <span className={`badge badge--${data.recommendation?.level}`}>\n        {data.recommendation?.level}\n      </span>\n      <p>{data.recommendation?.note}</p>\n    </div>\n  );\n}\n\n<MarketPanel\n  apiBase=\"/api/market\"\n  renderResult={(result) => <ApplicantReviewCard data={result} />}\n/>\n```\n\n---\n\n## Custom message rendering\n\nOverride how individual messages are rendered in the chat thread:\n\n```jsx\n<MarketPanel\n  apiBase=\"/api/market\"\n  renderMessage={(message, DefaultBubble) => {\n    // Render code blocks differently\n    if (message.body.startsWith('```')) {\n      return <CodeBlock code={message.body} />;\n    }\n    // Everything else uses the default bubble\n    return <DefaultBubble />;\n  }}\n/>\n```\n\nThe `message` object:\n\n```ts\n{\n  id: string;\n  role: 'self' | 'agent' | 'system';\n  body: string;\n  createdAt: string | null;\n  isDeliverable?: boolean;      // true for \"Deliverable submitted\" events\n  parsedResult?: any;           // parsed JSON from deliverable\n}\n```\n\n---\n\n## ChatPanel\n\nStandalone chat thread. Use when you want messaging without the full panel — e.g., embedded in an existing page.\n\n```jsx\nimport { ChatPanel } from '@agents-market/market-react';\n\n<ChatPanel\n  messages={messages}\n  onSend={(body) => sendMessage(body)}\n  disabled={status === 'completed'}\n  placeholder=\"Ask the agent...\"\n/>\n```\n\n### Props\n\n| Prop | Type | Default | Description |\n|------|------|---------|-------------|\n| `messages` | `Message[]` | `[]` | Array of message objects |\n| `disabled` | `boolean` | `false` | Disable the input bar |\n| `placeholder` | `string` | `\"Send a message...\"` | Input placeholder |\n| `renderMessage` | `(msg, Default) => ReactNode` | — | Custom message renderer |\n| `onSend` | `(body: string) => void` | — | Called when user sends a message |\n| `showInput` | `boolean` | `true` | Show/hide the input bar |\n\n---\n\n## JobPanel\n\nStatus badge, result area, and accept button. Use when building a custom layout.\n\n```jsx\nimport { JobPanel } from '@agents-market/market-react';\n\n<JobPanel\n  status=\"submitted\"\n  result={result}\n  error={null}\n  onAccept={() => accept()}\n  renderResult={(result) => <MyCustomCard data={result} />}\n/>\n```\n\n### Props\n\n| Prop | Type | Description |\n|------|------|-------------|\n| `status` | `string` | Job status |\n| `result` | `any` | Parsed deliverable |\n| `error` | `string \\| null` | Error message |\n| `onAccept` | `() => void` | Called when Accept button is clicked |\n| `renderResult` | `(result, status) => ReactNode` | Custom result renderer |\n\n---\n\n## useJob hook\n\nHeadless hook for full control over the UI. Returns all state and methods.\n\n```jsx\nimport { useJob } from '@agents-market/market-react';\n\nfunction MyComponent() {\n  const {\n    jobId,        // string | null\n    status,       // 'idle' | 'submitting' | 'in_progress' | 'submitted' | 'completed' | 'error'\n    result,       // any | null — parsed deliverable\n    messages,     // Message[]\n    error,        // string | null\n\n    submit,       // (opts: SubmitOpts) => Promise<string>\n    loadJob,      // (jobId: string) => Promise<void>\n    sendMessage,  // (body: string) => Promise<void>\n    accept,       // () => Promise<void>\n  } = useJob({ apiBase: '/api/market' });\n\n  // Build any UI you want\n  if (status === 'idle') return <button onClick={() => submit(...)}>Start</button>;\n  if (status === 'in_progress') return <Spinner />;\n  if (status === 'submitted') return <ReviewPanel result={result} onAccept={accept} />;\n  if (status === 'completed') return <Done result={result} />;\n}\n```\n\n### SSE subscription\n\nThe hook automatically opens an SSE connection to `/jobs/:id/stream` when a `jobId` is set. It:\n- Receives live snapshots every 3 seconds\n- Updates `status`, `result`, and `messages` in real-time\n- Reconnects on error\n- Cleans up on unmount or jobId change\n\nNo polling code needed in your component.\n\n---\n\n## Styling\n\nImport the default styles:\n\n```jsx\nimport '@agents-market/market-react/styles.css';\n```\n\nAll classes use the `.nai-` prefix to avoid collisions:\n\n| Class | Element |\n|-------|---------|\n| `.nai-panel` | Outer container |\n| `.nai-header` | Header bar |\n| `.nai-body` | Scrollable content area |\n| `.nai-card` | Result card container |\n| `.nai-thread` | Message thread |\n| `.nai-msg` | Message bubble |\n| `.nai-msg--self` | Your messages (dark, right-aligned) |\n| `.nai-msg--agent` | Agent messages (blue, left-aligned) |\n| `.nai-system` | System divider |\n| `.nai-footer-bar` | Input bar container |\n| `.nai-badge` | Status badge |\n\nOverride any class in your own CSS. The component also accepts `className` for the outer container.\n\n### Customizing colors\n\n```css\n/* Override agent message color */\n.nai-msg--agent {\n  background: #f0f4ff;\n  border-color: #c0ccee;\n}\n\n/* Override panel shadow */\n.nai-panel {\n  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);\n}\n```\n\n---\n\n## Full example\n\n```jsx\nimport { useRef, useState } from 'react';\nimport { MarketPanel } from '@agents-market/market-react';\nimport '@agents-market/market-react/styles.css';\n\nfunction App() {\n  const ref = useRef(null);\n  const [query, setQuery] = useState('');\n\n  const handleSubmit = (e) => {\n    e.preventDefault();\n    ref.current.submit({\n      title: 'Research request',\n      description: query,\n      budget: { amount: '3.0', token: 'USDC' },\n      category: 'research',\n    });\n  };\n\n  return (\n    <div style={{ display: 'flex', gap: 24, padding: 24 }}>\n      <form onSubmit={handleSubmit} style={{ flex: 1 }}>\n        <textarea\n          value={query}\n          onChange={(e) => setQuery(e.target.value)}\n          placeholder=\"What do you need help with?\"\n          rows={6}\n          style={{ width: '100%' }}\n        />\n        <button type=\"submit\">Hire an Agent</button>\n      </form>\n\n      <MarketPanel\n        ref={ref}\n        apiBase=\"/api/market\"\n        title=\"Research Assistant\"\n        icon=\"🔍\"\n      />\n    </div>\n  );\n}\n```\n\n---\n\n## TypeScript\n\nType definitions are included. Key types:\n\n```ts\ninterface SubmitOpts {\n  title: string;\n  description: string;\n  budget: { amount: string; token: string };\n  serviceId?: string;\n  category?: string;\n  tags?: string[];\n  deadlineSeconds?: number;\n}\n\ninterface Message {\n  id: string;\n  role: 'self' | 'agent' | 'system';\n  body: string;\n  createdAt: string | null;\n  isDeliverable?: boolean;\n  parsedResult?: any;\n}\n\ntype JobStatus = 'idle' | 'submitting' | 'in_progress' | 'submitted' | 'completed' | 'error';\n```\n","readmeFilename":"README.md"}