BeLocal Docs
SdkReact

@belocal/react

@belocal/react

React SDK for Belocal. Components and hooks built on @belocal/js-sdk.

Installation

npm install @belocal/react

Usage

  1. Wrap your app with BelocalProvider:
import { BelocalProvider } from '@belocal/react';

<BelocalProvider apiKey="your-api-key" defaultLang="en">
  <YourApp />
</BelocalProvider>
  1. Translate — wrapper around engine.translate():

Minimal

import { Translate } from '@belocal/react';

<Translate text="Hello!" lang="es" />

All params

<Translate
  text="crane"
  lang="ru"             // target language
  sourceLang="en"       // source language
  context="website dedicated to animals"
  managed={true}        // use managed translation
  ctx={{ user_type: 'product', entity_key: 'birds', entity_id: 'crane-001', translation_style: 'formal' }}
  onSuccess={(t) => {}} // callback on success
  onError={(e) => {}}   // callback on error
  dots={true}           // animated dots while loading
/>

Ctx Properties

PropertyDescription
user_typeTranslation profile: product (e-commerce prompts) or chat (lighter model + chat history)
user_ctxFree-form user instruction appended to the system prompt
cache_typeCache mode: temporary (default), managed (persistent), no-cache (skip cache)
entity_keyEntity type key for context enrichment (e.g. product, category)
entity_idEntity instance ID (used together with entity_key)
translation_styleOverrides the project-level translation style. Values: auto (no effect), formal, informal, technical, marketing, literary
markupMarkup preservation mode: html, xml, custom

On this page