FindableProvider

Creates a FindableClient and provides it via React context. All Findable hooks and components must be rendered inside a provider.

Usage

import { FindableProvider, FindableChat } from '@findable-ai/react';
import '@findable-ai/react/styles.css';

// Recommended: use a session token (obtained server-side)
function App({ sessionToken }: { sessionToken: string }) {
  return (
    <FindableProvider token={sessionToken} buildingOwnerId="YOUR_OWNER_ID">
      <FindableChat buildingId="bld-789" />
    </FindableProvider>
  );
}

// Alternative: API key (only for internal tools / trusted environments)
function InternalApp() {
  return (
    <FindableProvider apiKey="YOUR_API_KEY" buildingOwnerId="YOUR_OWNER_ID"> {/* // pragma: allowlist secret */}
      <FindableChat buildingId="bld-789" />
    </FindableProvider>
  );
}

Props

Prop	Type	Default	Description
`apiKey`	`string`	—	Your Findable API key. Provide either apiKey or token.
`token`	`string`	—	A short-lived session token from createSession(). Recommended for browser use. Provide either apiKey or token.
`buildingOwnerId`*	`string`	—	The building owner (customer) ID
`baseUrl`	`string`	`'https://api.findable.ai'`	API base URL override for testing or custom environments
`children`*	`ReactNode`	—	Child components

Accessing the Client Directly

Use useFindableClient() to access the SDK client instance:

import { useFindableClient } from '@findable-ai/react';

function MyComponent() {
  const client = useFindableClient();

  const handleClick = async () => {
    const buildings = await client.listBuildings();
    console.log(buildings);
  };

  return <button onClick={handleClick}>Load buildings</button>;
}