Clasp components are plug-and-play UIs delivered as secure, magic-link URLs. You create the company/employee via API → request a component URL → iframe it in your app (or open it as a standalone page). That’s it.
Prerequisites
| What | Why |
|---|
| Clasp API key | Used as a Bearer token from your backend to call the API and mint component links. |
| Employer & Member IDs | Returned from the API when you create each record. |
Never expose your long‑lived API key in the browser.
All API calls that use the Bearer key should originate server‑side.
1. Employer Component
POST /components/employer
Authorization: Bearer $CLASP_API_KEY
Content-Type: application/json
Response
{ "url": "https://benefits.withclasp.com/?otp_token=•••" }
2. Employee (Member) Component
POST /components/member
Authorization: Bearer $CLASP_API_KEY
Content-Type: application/json
Response
{ "url": "https://benefits.withclasp.com/?otp_token=•••" }
Each URL is already scoped to that employer or member via the one‑time token (otp_token).
Embedding the Component
<iframe
src={iframeUrl} // the `url` returned above
style={{
border: 0,
width: "100%",
height: "900px"
}}
/>
- ✅ Works in any framework that supports iframes (React, Vue, plain HTML, etc.).
- ✅ Can also be opened as a standalone magic link (handy for email‑based flows).
Need help? Ping us at support@withclasp.com or your dedicated solutions engineer.