SealRoute Docs
  • Getting Started
  • API Reference
  • SDKs
  • Guides
  • VIDA
  • Embedding
  • Webhooks
Form Builder JavaScriptForm Builder ReactForm Builder VueForm Builder AngularSigning Form JavaScriptSigning Form ReactSigning Form VueSigning Form Angular
powered by Zudoku
Embedding

Form Builder JavaScript

Embed the SealRoute template builder with the <sealroute-builder> web component.

Requires an active license. Cross-origin parent pages must be listed in EMBED_ALLOWED_ORIGINS.

Mint a JWT (HS256) with the user's API key as the secret. Required claim: user_email. Optional: template_id, external_id, name, folder_name, document_urls, exp.

Example Code

Code
<script src="https://your.domain/js/builder.js"></script> <sealroute-builder data-token="YOUR_JWT" data-host="https://your.domain" data-height="800"> </sealroute-builder> <script> document.querySelector('sealroute-builder').addEventListener('save', (e) => { console.log(e.detail) }) </script>

Mint a JWT

Code
# Ruby require 'jwt' token = JWT.encode( { user_email: 'admin@example.com', template_id: 1, exp: 1.hour.from_now.to_i }, 'YOUR_API_KEY', 'HS256' )
Code
// Node.js const jwt = require('jsonwebtoken') const token = jwt.sign( { user_email: 'admin@example.com', template_id: 1 }, 'YOUR_API_KEY', { expiresIn: '1h' } )

Or locally: rake embed:builder_token[email,template_id].

Attributes

AttributeRequiredDescription
data-tokenYesBuilder JWT
data-hostNoSealRoute origin (defaults from the script URL)
data-heightNoInitial iframe min-height in px (default 800)
data-with-titleNoShow builder title UI
data-with-upload-buttonNoShow upload control
data-with-fields-detectionNoEnable field detection
data-localeNoUI locale

Events

EventDescription
loadBuilder loaded with template payload
saveTemplate saved
changeTemplate changed
uploadDocument uploaded

Events are also available as postMessage types with the sealroute: prefix.

Last modified on November 7, 2026
Form Builder React
Javascript