Documentation

Everything you need to add an AI command bar to your website.

# Quick Start

1. Install the package

# npm
npm install jigbell

# or yarn
yarn add jigbell

2. Initialize your config

npx jigbell init
# Scans your site and generates jigbell.config.js

3. Add to your app

import { Jigbell } from "jigbell"
import config from "./jigbell.config.js"

function App() {
  return (
    <>
      <YourApp />
      <Jigbell config={config} />
    </>
  )
}

# Configuration

// jigbell.config.js
export default {
  apiKey: "jb_your_api_key",

  widget: {
    triggerKey: "/",
    primaryColor: "#10B981",
    greeting: "How can I help?",
    modes: [
      { id: 'chat', label: 'Chat' },
      { id: 'support', label: 'Support' },
      { id: 'docs', label: 'Docs' },
    ]
  },

  api: {
    provider: "jigbell" // or "anthropic", "openai"
  }
}

Option	Type	Default	Description
triggerKey	string	"/"	Key to open command bar
primaryColor	string	"#10B981"	Brand color (hex)
greeting	string	-	Initial welcome message
modes	array	[]	Available chat modes
api.provider	string	"jigbell"	"jigbell", "anthropic", or "openai"

# Modes

Jigbell supports multiple modes to handle different types of interactions:

/chatGeneral conversation and Q&A

/supportTechnical help and troubleshooting

/docsAI-powered documentation search

/onboardingGuided user onboarding flows

/shopProduct discovery for eCommerce

/researchDeep dive on features and capabilities

# Script Tag (Non-React)

For non-React sites (WordPress, vanilla JS, etc.), use the script tag:

<!-- Add before </body> -->
<script src="https://cdn.jigbell.com/v1.js"></script>
<script>
  Jigbell.init({
    apiKey: "jb_your_api_key"
  })
</script>

Ready to get started?

Join the beta and add Jigbell to your site in minutes.

Join Beta