@landedso/sdk

Headless TypeScript client and React hooks for integrating Landed feedback collection into your own UI.

Install

npm install @landedso/sdk

Headless client

import { LandedClient } from "@landedso/sdk";

const landed = LandedClient.create({
  publishableKey: "wk_pub_...",
});

await landed.identify({
  id: "user_123",
  email: "[email protected]",
});

const config = await landed.getConfig();
const upload = await landed.upload(file);

await landed.submit({
  text: "Love the new dashboard",
  storageRefIds: [upload.storageRefId],
  context: {
    pageUrl: window.location.href,
  },
});

const releases = await landed.listChangelogReleases({
  limit: 5,
  sort: "publishedAt",
  order: "desc",
});

const release = await landed.getChangelogRelease(releases.data[0].id);

React hooks

import {
  LandedProvider,
  useLandedConfig,
  useIdentify,
  useSubmitFeedback,
} from "@landedso/sdk/react";

export function FeedbackForm() {
  const { config, isLoading } = useLandedConfig();
  const identify = useIdentify();
  const { submit, isSubmitting } = useSubmitFeedback();

  if (isLoading || !config) return null;

  return (
    <form
      onSubmit={async (event) => {
        event.preventDefault();
        await submit({ text: "Great product!" });
      }}
    >
      <button type="submit" disabled={isSubmitting}>
        {config.widget.copy.submitLabel}
      </button>
    </form>
  );
}

export function App() {
  return (
    <LandedProvider publishableKey="wk_pub_...">
      <FeedbackForm />
    </LandedProvider>
  );
}

Submission shape

submit() accepts the fields required to create a raw request for Landed processing:

• text — feedback body
• storageRefIds — attachment IDs returned from upload()
• context — optional page URL, user agent, or custom metadata
• newUser — guest email/name when identify() was not called

Call identify() to attach a signed-in user. Anonymous submissions require the workspace widget config to allow anonymous feedback.