@contact-admin/js

Vanilla JS / TypeScript SDK for contact-admin.

Install

npm install @contact-admin/js

Usage

Programmatic API

import { ContactAdminClient } from '@contact-admin/js';

const client = new ContactAdminClient({
  apiKey: 'your-api-key',
  siteId: 'your-site-id',         // optional, can be passed per submit
  baseUrl: 'https://api.contact-admin.io', // optional, default shown
});

const result = await client.submit({
  name: 'Jan Kowalski',
  email: '[email protected]',
  message: 'Hello!',
  sourceUrl: window.location.href, // optional
  customFields: { phone: '123456789' }, // optional
});

Auto-init (data attributes)

Add data-reachly-form to your form — the SDK wires it up automatically:

<script
  src="https://github.com/codelite-house/contact-admin-sdk/releases/latest/download/contact-admin.min.js"
  data-reachly-api-key="your-api-key"
  data-reachly-site-id="your-site-id"
></script>

<form data-reachly-form>
  <input data-reachly-field="name" type="text" placeholder="Name" />
  <input data-reachly-field="email" type="email" placeholder="Email" />
  <textarea data-reachly-field="message" placeholder="Message"></textarea>
  <button type="submit">Send</button>

  <p data-reachly-success hidden>Message sent!</p>
  <p data-reachly-error hidden>Something went wrong.</p>
</form>

Manual init

import { initForms } from '@contact-admin/js';

initForms(document.querySelector('#contact-section'));

CDN (no bundler)

<script
  src="https://github.com/codelite-house/contact-admin-sdk/releases/latest/download/contact-admin.min.js"
  data-reachly-api-key="your-api-key"
></script>

Global: window.ContactAdmin — ContactAdmin.ContactAdminClient, ContactAdmin.initForms.

Data attributes reference

| Attribute | Element | Description | |-----------|---------|-------------| | data-reachly-form | <form> | Marks a form for auto-init | | data-reachly-api-key | <form> or <script> | API key (form takes precedence) | | data-reachly-site-id | <form> or <script> | Site ID | | data-reachly-base-url | <form> or <script> | Custom API base URL | | data-reachly-field="name" | input/textarea | Maps field to sender name | | data-reachly-field="email" | input/textarea | Maps field to sender email | | data-reachly-field="message" | textarea | Maps field to message body | | data-reachly-field="<key>" | any input | Any other key → customFields | | data-reachly-success | any element | Shown on success (hidden otherwise) | | data-reachly-error | any element | Shown on error (hidden otherwise) | | data-reachly-submit-text | <form> | Button label after submit resets | | data-reachly-loading-text | <form> | Button label while submitting |

Events

form.addEventListener('reachly:success', (e) => console.log(e.detail)); // SubmitResult
form.addEventListener('reachly:error', (e) => console.error(e.detail));  // Error