Client Library

Versions: 1.x | 2.x

The StaticKit client library provides an API client for communicating with the StaticKit backend.

npm install @statickit/core

Source on GitHub | npm package

Creating a client

Use the createClient factory to build a new client instance:

import { createClient } from '@statickit/core';
const client = createClient({ site: '{your-site-id}' });

API

invokeFunction(name, args, opts = {})

Invokes a StaticKit function.

KeyTypeDefaultDescription
name *stringThe function name (from your statickit.json config)
args *objectAn object of function arguments
optsobject{}Miscellanous options

Return Value

This function returns a Promise that resolves to an object with a status field and varied response fields (depending on the particular function type).

submitForm(key, data, opts = {})

Submits a StaticKit form.

KeyTypeDefaultDescription
key *stringThe form key (from your statickit.json config)
data *object | FormData{}The form data to send to the server
optsobject{}Miscellanous options

Return Value

This function returns a Promise that resolves to an object containing a body field and a response field:

let { body, response } = await client.submitForm('contactForm', formData);
switch (response.status) {
case 200:
// Submission succeeded
case 422:
// Validation errors occurred
// Use `body.errors` to display errors
default:
// Something unexpected happened
}

When the submission succeeds, the body will include a submission id and data:

{
id: "3ac1fb5d-259a-4af5-aac5-2ce53215b6c5",
data: {
}
}

If there are validation errors, the body will include an array of errors:

{
errors: [{
code: "REQUIRED",
field: "email",
message: "is required",
properties: {}
}]
}

Here's an example of submitting the data from a <form> node to StaticKit and awaiting the response:

import { createClient } from '@statickit/core';
const client = createClient({ site: '{your-site-id}' });
client.startBrowserSession();
async function handleSubmit(event) {
event.preventDefault();
const formData = new FormData(event.target);
const { body, response } = await client.submitForm('contactForm', formData);
// ...
}

teardown()

This method cleans up resources used by the client.