Skip to content
Widget SDK

Type Reference

TypeScript interfaces for ChatboxConfig, BubbleConfig, VisitorDetails, VisitorTokenAnswer, and instances.

Type Reference#

TypeScript
interface ChatboxConfig {
  apiKey: string;
  container?: HTMLElement;
}

interface BubbleConfig {
  apiKey: string;
  position?: 'bottom-right' | 'bottom-left';
  bubbleColor?: string;
  bubbleSize?: number;
  bubbleIcon?: string;
  bubbleIconSize?: number;
  offset?: {
    bottom?: number;
    right?: number;
    left?: number;
  };
}

/** Unverified details; only the fields you carry change, null clears one. */
interface VisitorDetails {
  name?: string | null;
  email?: string | null;
  phone?: string | null;
  company?: string | null;
  location?: { latitude: number; longitude: number; name?: string } | null;
}

/** The visitor's token: one string, or one per https origin (at most 8). */
type VisitorTokenValue = string | Record<string, string>;

/** What the endpoint returns and the provider resolves to. null = a guest. */
interface VisitorTokenAnswer {
  visitorToken: VisitorTokenValue | null;
  expiresIn?: number; // seconds; a JWT's own exp wins
}

type VisitorTokenProvider = () =>
  | Promise<VisitorTokenAnswer | null>
  | VisitorTokenAnswer
  | null; // throw when the token cannot be fetched

interface GydrAPI {
  chatbox(config: ChatboxConfig): ChatboxInstance;
  bubble(config: BubbleConfig): BubbleInstance;
  setVisitorDetails(details: VisitorDetails): void;
  setVisitorTokenProvider(provider: VisitorTokenProvider | null): void;
  refreshVisitorToken(): void;
  setCart(cart: { shopifyCartId: string | null }): void;
  reset(): void;
}

interface ChatboxInstance {
  destroy(): void;
}

interface BubbleInstance {
  open(): void;
  close(): void;
  toggle(): void;
  destroy(): void;
  readonly isOpen: boolean;
}