taello-react

React component for the Taello AI shopping assistant. Add a fully working AI chat widget to any React app in two lines.

Install

npm install taello-react

taello-core is installed automatically as a dependency. React 17+ is required as a peer dependency.

Usage

import { TaelloChat } from 'taello-react'

export default function App() {
  return (
    <>
      <YourApp />

      <TaelloChat
        apiKey="pk_live_YOUR_KEY"
        apiUrl="https://api.taello.ai/api"
        primaryColor="#F04438"
        storeName="My Store"
      />
    </>
  )
}

The component renders nothing to the DOM itself — the widget is mounted directly by the SDK and cleaned up automatically when the component unmounts.

Props

type TaelloChatProps = {
  apiKey: string                              // required
  apiUrl?: string
  primaryColor?: string                       // default: #F04438
  storeName?: string
  logoUrl?: string
  welcomeMessage?: string
  placeholder?: string
  mode?: 'overlay' | 'sidebar' | 'fullpage'  // default: overlay
  position?: 'bottom-right' | 'bottom-left'  // default: bottom-right
  sidebarWidth?: number
  autoOpen?: boolean
  onAddToCart?: (product: Product, quantity: number) => void
  onViewProduct?: (product: Product) => void
  onCheckout?: (cart: CartItem[]) => void
}

Handle cart and checkout events

<TaelloChat
  apiKey="pk_live_YOUR_KEY"
  apiUrl="https://api.taello.ai/api"
  onAddToCart={(product, quantity) => {
    myCartStore.add(product, quantity)
  }}
  onCheckout={(cartItems) => {
    router.push('/checkout')
  }}
/>

Display modes

// Floating popup (default)
<TaelloChat mode="overlay" ... />

// Slides in from the side, pushes page content
<TaelloChat mode="sidebar" sidebarWidth={450} ... />

// Full screen takeover — good for dedicated chat pages
<TaelloChat mode="fullpage" autoOpen ... />

Getting your API key

1. Sign up at taello.ai
2. Create a store and upload your product catalog
3. Go to API Keys in the sidebar and copy your publishable key

React Native

Use taello-react-native for mobile apps.

License

MIT