Browse docs

API

Provider & Scopes

ReactVanilla

The three components: the provider that holds the instance, the scope that injects agreement params, and the fallback that covers boot.

StiftProvider

<StiftProvider stift={stift} boot={() => stift.initialize({ locale })} onBootError={report}>

Provides the stift instance and locale context to everything below it.

stift prop

  • Type: Stift
  • Required. The instance from createStift or createStiftApp. Note the lowercase — it is the object, not the type.

boot prop

  • Type: () => Promise<void>
  • Optional. The "load every non-excluded namespace for the resolved locale" operation that <BootFallback> suspends on — typically () => stift.initialize({ locale }). Started once, lazily. Omit it (and <BootFallback>) when booting imperatively in the client entry, as the examples do.

onBootError prop

  • Type: (error: unknown) => void
  • Optional — default: console.error. Where a rejected boot promise reports. The boot gate releases either way: <BootFallback> renders children on reject too.

LocaleScope

<LocaleScope context={{ gender: user.gender }}>

context prop

  • Type: Record<string, unknown>
  • Required. Params merged into every t() call in the subtree. Lexically scoped: a nested <LocaleScope> overrides only for its own subtree, and an explicit param at a call site always wins.

Read it back with useLocale().context. There is no setter — set it declaratively here, or imperatively per key with setParam.

BootFallback

<BootFallback fallback={<FullPageLoader />}>
  <App />
</BootFallback>

fallback prop

  • Type: ReactNode
  • Required. Renders until the provider's boot promise settles (resolve or reject), then children — so components never mount against a pending locale switch. The fallback must not require translation. Without boot, passes through.

Examples

render(
  <StiftProvider stift={stift} boot={() => boot()}>
    <BootFallback fallback={<FullPageLoader />}>
      <LocaleScope context={{ gender: user.gender }}>
        <App />
      </LocaleScope>
    </BootFallback>
  </StiftProvider>,
)

Next