SDK Initialization

All SDK integrations - Embedded Checkout and every Embedded Component (Card, Split Card, Checkout, Apple Pay) - start by calling initTeyaBlocks() with a session token from your backend and an optional configuration object.

Signature

initTeyaBlocks(
  sessionToken: string,
  options?: InitOptions
): Promise<TeyaBlocks>

Parameters

Parameter Required Description
sessionToken Yes The session token returned by POST /v2/checkout/sessions. Single-use.
options No Configuration object. See below.

Options

Option Type Default Description
locale string 'en' UI language for hosted text and form labels.
appearance object - Theme and CSS variable overrides. See Customize for the full list.
developmentMode boolean false When true, the SDK routes all calls to Teya's staging APIs (api.teya.xyz). Omit (or set to false) to use production (api.teya.com).

developmentMode - staging vs production

developmentMode is the single switch that tells the SDK which environment to use. A staging session token will only work when developmentMode: true; a production session token will only work when it is omitted.

// Staging - testing with test cards
const teya = await initTeyaBlocks(sessionToken, {
  locale: 'en',
  appearance: { theme: 'flat' },
  // Routes SDK calls to Teya staging. Remove for production.
  developmentMode: true,
});

// Production - real payments
const teya = await initTeyaBlocks(sessionToken, {
  locale: 'en',
  appearance: { theme: 'flat' },
});
Never ship developmentMode to production
If developmentMode: true reaches your production bundle, the SDK will call Teya's staging infrastructure and your customers' payments will not be processed. Gate the flag on your own environment (for example, developmentMode: process.env.NODE_ENV !== 'production').

React

The same options apply in React - pass them to initTeyaBlocks() and hand the resulting promise to TeyaBlocksProvider:

import { useMemo } from 'react';
import { initTeyaBlocks } from '@teyaproduct/teya-blocks-js';
import { TeyaBlocksProvider } from '@teyaproduct/teya-blocks-react';

export default function App({ sessionToken }) {
  const teyaPromise = useMemo(
    () => initTeyaBlocks(sessionToken, {
      locale: 'en',
      appearance: { theme: 'flat' },
      // Routes SDK calls to Teya staging. Remove for production.
      developmentMode: true,
    }),
    [sessionToken]
  );

  return (
    <TeyaBlocksProvider teya={teyaPromise}>
      {/* your payment components */}
    </TeyaBlocksProvider>
  );
}