> ## Documentation Index
> Fetch the complete documentation index at: https://docs.westyx.cloud/llms.txt
> Use this file to discover all available pages before exploring further.

# OpenFeature provider

> OpenFeature bridge for @westyx-nexus/sdk-react - use standard OpenFeature hooks alongside the Nexus React SDK.

The `@westyx-nexus/openfeature-provider-react` package bridges the Nexus React SDK into the [OpenFeature Web SDK](https://openfeature.dev/docs/reference/technologies/client/web/). It wraps an existing `NexusClient` and emits `ConfigurationChanged` on every cache update so OpenFeature clients re-evaluate flags automatically.

## Installation

```sh theme={null}
npm install @westyx-nexus/sdk-react @westyx-nexus/openfeature-provider-react @openfeature/react-sdk
```

Configure the npm registry for the Westyx Nexus scope - see [Installation](installation).

## Quick start

```tsx theme={null}
import { OpenFeature, useBooleanFlagValue } from '@openfeature/react-sdk';
import { NexusClient } from '@westyx-nexus/sdk-react';
import { createOpenFeatureProvider } from '@westyx-nexus/openfeature-provider-react';

// Bootstrap - call once before rendering your React tree.
const client = await NexusClient.create({
  baseUrl: 'https://blue-ocean-a5rx7.westyx.dev',
  apiKey:  'wxp_...',
});
await OpenFeature.setProviderAndWait(createOpenFeatureProvider(client));

// In a component - standard OpenFeature hooks.
function Checkout() {
  const showBanner = useBooleanFlagValue('banner.enabled', false);
  return (
    <div>
      {showBanner && <Banner />}
      <CheckoutForm />
    </div>
  );
}
```

## Evaluation mapping

| OpenFeature method         | Nexus source                   | Error codes                                                              |
| -------------------------- | ------------------------------ | ------------------------------------------------------------------------ |
| `resolveBooleanEvaluation` | `client.getFlag(key, default)` | None - `getFlag` always returns a value                                  |
| `resolveStringEvaluation`  | `client.getConfig(key)`        | `FLAG_NOT_FOUND` if absent; `TYPE_MISMATCH` if not a string              |
| `resolveNumberEvaluation`  | `client.getConfig(key)`        | `FLAG_NOT_FOUND` if absent; `TYPE_MISMATCH` if not coercible to a number |
| `resolveObjectEvaluation`  | `client.getConfig(key)`        | `FLAG_NOT_FOUND` if absent; `TYPE_MISMATCH` if not an object or array    |

All evaluations use the `STATIC` resolution reason. The provider does not perform per-user targeting - use `client.evaluateAB()` directly for that.

## Live updates

The provider subscribes to the Nexus client on `initialize()`. Each time the client's cache refreshes - via SSE push or TTL poll - the provider emits `ProviderEvents.ConfigurationChanged`. OpenFeature's React bindings pick this up and trigger re-renders in components that consume the changed flags.

## API reference

### `NexusReactProvider`

```ts theme={null}
class NexusReactProvider implements Provider {
  constructor(client: NexusClient);
  readonly runsOn: 'client';
  initialize(context?: EvaluationContext): Promise<void>;
  onClose(): Promise<void>;
  resolveBooleanEvaluation(flagKey: string, defaultValue: boolean, ...): ResolutionDetails<boolean>;
  resolveStringEvaluation(flagKey: string, defaultValue: string, ...): ResolutionDetails<string>;
  resolveNumberEvaluation(flagKey: string, defaultValue: number, ...): ResolutionDetails<number>;
  resolveObjectEvaluation<T extends JsonValue>(flagKey: string, defaultValue: T, ...): ResolutionDetails<T>;
}
```

### `createOpenFeatureProvider`

```ts theme={null}
function createOpenFeatureProvider(client: NexusClient): NexusReactProvider;
```

Convenience factory equivalent to `new NexusReactProvider(client)`.

<Warning>
  Browser SDKs must use a `wxp_...` (public) key. Never embed secret keys (`wxs_...`) in browser code.
</Warning>