Complete reference for the Body2FitSDK class, instance methods, events, and type definitions.

Body2FitSDK

The main class exposed by the SDK script. Instantiate it with a configuration object.

new Body2FitSDK(config: Body2FitConfig)

Parameters

Name	Type	Description
`config`	`Body2FitConfig`	Configuration object. See Body2FitConfig for all properties.

Quick start

The typical initialization flow looks like this:

const widget = new Body2FitSDK(config);

widget.embed();                          // 1. Embed into DOM (hidden)
widget.on('ready', () => widget.open()); // 2. Open once ready
widget.on('add-to-cart', (data) => {    // 3. Handle size selection
  addToCart(data.product.sku, data.size);
});

Lifecycle order: embed() → on() → open() → close() (optional) → destroy()

For a full lifecycle breakdown with events, see Widget Lifecycle.

Static Methods

`getVersion()`

Returns the current SDK version string.

Body2FitSDK.getVersion(): string

Returns: string — the semantic version (e.g., "1.2.3").

`isProductSupported()`

Checks if a product is supported by the Body2Fit service.

Body2FitSDK.isProductSupported(config: Body2FitConfig): Promise<boolean>

Parameters

Name	Type	Description
`config`	`Body2FitConfig`	Configuration object including the `garmentSKU` to check.

Returns: Promise<boolean> — resolves to true if the product is supported.

Note: If you've already instantiated the widget, you can listen to the supported event instead of calling this method explicitly — it fires automatically once the support status is determined.

Instance Methods

Constraints:

Call embed() before open() — the widget must be in the DOM first.

Callbacks passed to on() must be named functions to be removable with off(). Anonymous functions cannot be removed.

Once destroy() is called, the instance cannot be reused. Create a new instance if needed.

`embed()`

Embeds the widget iframe into the page. The widget is hidden initially and can be shown with open().

widget.embed(): void

`open()`

Shows the widget. The widget slides in from the configured direction.

widget.open(): void

`close()`

Hides the widget. The widget can be reopened with open().

widget.close(): void

`destroy()`

Completely removes the widget from the page and cleans up all event listeners. The widget cannot be used after calling this method.

widget.destroy(): void

`on(event, callback)`

Registers an event listener for widget events. The callback is invoked whenever the event fires with the event-specific payload. Returns the widget instance for method chaining.

widget.on(event: WidgetEventName, callback: WidgetEventCallback): Body2FitSDK

Parameters

Name	Type	Description
`event`	`WidgetEventName`	Event name. See Events below.
`callback`	`WidgetEventCallback`	Function called when the event fires.

widget.on('ready', () => {
  widget.open();
});

widget.on('add-to-cart', (data) => {
  console.log('Size selected:', data.size);
});

Removes a previously registered event listener. The callback reference must be the same named function passed to on() — anonymous functions cannot be removed. Returns the widget instance for method chaining.

widget.off(event: WidgetEventName, callback: WidgetEventCallback): Body2FitSDK

function handleAddToCart(data) {
  console.log('Size selected:', data.size);
}

widget.on('add-to-cart', handleAddToCart);

// Later:
widget.off('add-to-cart', handleAddToCart);

Events

Subscribe to events using widget.on(event, callback).

`ready`

Fires when the widget is fully loaded and ready to use. This is the appropriate time to call open() or other methods.

widget.on('ready', () => {
  widget.open(); // Safe to open now
});

No payload.

`add-to-cart`

Fires when the user selects a size and adds it to cart.

widget.on('add-to-cart', (data) => {
  console.log('Size:', data.size);
  console.log('SKU:', data.product.sku);
  addToCart(data.product.sku, data.size);
});

Payload

Property	Type	Description
`size`	`string`	The selected size label (e.g., `"M"`, `"32"`).
`product.sku`	`string`	Product SKU.
`product.name`	`string`	Product name.

`close`

Fires when the widget is closed by the user. Use this to restore page state (e.g., scroll position, UI visibility).

widget.on('close', () => {
  // e.g., restore page scroll or UI state
});

No payload.

`error`

Fires when an error occurs in the widget.

widget.on('error', (error) => {
  if (error.code === 'PRODUCT_NOT_SUPPORTED') {
    hideSizeGuideButton();
  } else {
    console.error('Widget error:', error.message);
  }
});

Payload

Property	Type	Description
`message`	`string`	Human-readable error description.
`code`	`string` (optional)	Machine-readable error code.
`details`	`any` (optional)	Additional error context.

`supported`

Fires when the Body2Fit support status for the product is determined. Use this to show or hide the size guide button based on support availability.

widget.on('supported', (data) => {
  if (data.supported) {
    showSizeGuideButton();
  } else {
    hideSizeGuideButton();
  }
});

Payload

Property	Type	Description
`supported`	`boolean`	Whether the product is supported by Body2Fit.

Type Definitions

`Body2FitConfig`

interface Body2FitConfig {
  // Required
  clientKey: string;
  countryCode: string;
  languageCode: string;
  brandId: string;
  garmentSKU: string;
  preferredMeasurementSystem: "metric" | "imperial";

  // Optional
  priorityFlow?: "stats" | "upload" | "selfie" | "full-body";
  features?: string[];
  brandLogoURL?: string;
  garmentImageURL?: string;
  garmentName?: string;
  slideInDirection?: "left" | "right" | "top" | "bottom";
  preferredGender?: "male" | "female";
  theme?: Record<string, any>;
  additionalParams?: Record<string, string>;
  session?: {
    clientSessionId?: string;
  };
}

Properties

Property	Type	Required	Description
`clientKey`	`string`	Yes	Your API authentication key.
`countryCode`	`string`	Yes	ISO 3166-1 alpha-2 country code (e.g., `"US"`, `"JP"`).
`languageCode`	`string`	Yes	IETF language tag (e.g., `"en"`, `"ja"`).
`brandId`	`string`	Yes	Your brand identifier assigned by Bodygram.
`garmentSKU`	`string`	Yes	The product SKU to get a size recommendation for.
`preferredMeasurementSystem`	`"metric" \| "imperial"`	Yes	Unit system shown to the user.
`priorityFlow`	`"stats" \| "upload" \| "selfie" \| "full-body"`	No	Priority input flow for the widget. Defaults to `"stats"`.
`features`	`string[]`	No	Feature flags to enable.
`brandLogoURL`	`string`	No	URL of your brand logo shown in the widget.
`garmentImageURL`	`string`	No	URL of the product image shown in the widget.
`garmentName`	`string`	No	Display name of the product shown in the widget.
`slideInDirection`	`"left" \| "right" \| "top" \| "bottom"`	No	Direction the widget slides in from. Defaults to `"right"`.
`preferredGender`	`"male" \| "female"`	No	Pre-selects the gender in the widget flow.
`theme`	`Record<string, any>`	No	Custom theme overrides.
`additionalParams`	`Record<string, string>`	No	Extra parameters passed to the widget.
`session.clientSessionId`	`string`	No	Your own session ID to correlate with Body2Fit sessions.

Example

const config = {
  clientKey: 'YOUR_CLIENT_KEY',
  countryCode: 'US',
  languageCode: 'en',
  brandId: 'my-brand',
  garmentSKU: 'SHIRT-001',
  preferredMeasurementSystem: 'imperial',
  garmentName: 'Classic Oxford Shirt',
  garmentImageURL: 'https://example.com/images/shirt-001.jpg',
  slideInDirection: 'right',
};

`WidgetEventName`

type WidgetEventName =
  | "ready"
  | "add-to-cart"
  | "error"
  | "close"
  | "supported";

`WidgetEventCallback`

type WidgetEventCallback = (data: WidgetEventData) => void;

type WidgetEventData = {
  [key: string]: any;
};

API Reference

Body2FitSDK

Quick start

Static Methods

`getVersion()`

`isProductSupported()`

Instance Methods

`embed()`

`open()`

`close()`

`destroy()`

`on(event, callback)`

`off(event, callback)`

Events

`ready`

`add-to-cart`

`close`

`error`

`supported`

Type Definitions

`Body2FitConfig`

`WidgetEventName`

`WidgetEventCallback`

On this page