@chilipiper/conciergejs-fire

Chili Piper Concierge Fire - Advanced form integration and routing library for seamless meeting scheduling.

Installation

npm install @chilipiper/conciergejs-fire

or

yarn add @chilipiper/conciergejs-fire

Overview

@chilipiper/conciergejs-fire provides powerful form integration capabilities for scheduling meetings through Chili Piper. It automatically detects and integrates with popular marketing automation platforms and HTML forms, streamlining the lead-to-meeting conversion process.

Features

• Multi-Platform Support: Automatic integration with HubSpot, Marketo, Pardot, Typeform, Instapage, Gravity Forms, and standard HTML forms
• Deploy Function: Specialized router deployment for specific form type integrations
• Smart Routing: Route leads to the right sales representative based on custom rules
• Calendar Integration: Seamless calendar booking experience with popup modal
• Mobile Support: Optimized for mobile devices with responsive design
• TypeScript Support: Full TypeScript definitions included

Usage

Basic Integration

import '@chilipiper/conciergejs-fire';

// The library will automatically detect and integrate with supported forms

Deploy Router

Deploy a router with specific form type integrations:

ChiliPiper.deploy(domain, router, options);

The deploy function automatically handles different form platforms based on the formType option:

Supported Form Types:

• Hubspot - HubSpot iframe forms
• HubspotPopup - HubSpot popup forms
• Marketo - Marketo forms
• PardotFormHandler - Pardot form handler (thank you page)
• PardotIframeThankYouCode - Pardot iframe (thank you page)
• PardotIframeParentPage - Pardot iframe (parent page)
• PardotFormHandlerThankYouCode - Pardot form handler with iframe
• PardotLookAndFeel - Pardot look and feel
• GravityForms - Gravity Forms (thank you page)
• GravityFormsOnFormPage - Gravity Forms (form page)
• Typeform - Typeform integration
• Instapage - Instapage integration

Example:

ChiliPiper.deploy('your-domain', 'your-router', {
  formType: 'Marketo',
  lead: { email: '[email protected]' },
  onSuccess: (data) => console.log('Success:', data)
});

Custom Router Deployments

Submit form data and route to calendar booking:

ChiliPiper.submit(domain, router, options);

Parameters:

• domain (string): Your Chili Piper domain
• router (string): Router name configured in Chili Piper
• options (object): Configuration options

Configuration Options

Options Interface

{
  domain: string;              // Required: Your Chili Piper domain
  router: string;              // Required: Router name
  formId?: string;             // Form identifier
  lead?: object;               // Pre-fill lead data
  domElement?: HTMLElement;    // Target element for calendar popup
  debug?: boolean;             // Enable debug logging

  // Callbacks
  onSuccess?: (data) => void;  // Called on successful booking
  onError?: (data) => void;    // Called on error
  onClose?: (data) => void;    // Called when modal closes
  onRouting?: () => void;      // Called during routing
  onDisqualified?: () => void; // Called when lead is disqualified

  // Advanced options
  locale?: string;             // Localization (default: 'en_US')
  closeOnOutside?: boolean;    // Close modal on outside click

  // Form-specific
  formType?: string;           // Form platform type (Hubspot, Marketo, Pardot, etc.)
  enrichmentParentSelector?: string; // Parent selector for enrichment
}

Supported Form Platforms

• HubSpot Forms: Automatic detection via hbspt global and hsForm class (iframe and popup variants)
• Marketo Forms: Automatic detection via MktoForms2 global and mktoForm class
• Pardot Forms: Multiple integration methods including form handler, iframe, and look & feel
• Gravity Forms: WordPress forms integration (form page and thank you page)
• Typeform: Embedded Typeform integration
• Instapage: Landing page integration
• HTML Forms: Fallback for standard HTML forms

For specific forms, you should reach our support or build your own integration using ChiliPiper.submit

TypeScript

Full TypeScript support with type definitions included:

import type { Options } from '@chilipiper/conciergejs-fire';

const options: Options = {
  domain: 'your-domain',
  router: 'your-router',
  // ... other options
};

Development

# Install dependencies
yarn install

# Development server
yarn dev

# Build library
yarn build

# Run tests
yarn test

# Lint code
yarn lint

License

MIT

Support

For questions or any issues, please visit our Support page.