AskAIProvider
Provider that supplies AskAI context without rendering a preset surface
Overview
AskAIProvider supplies the AskAI context so you can render AskAI surfaces or call useAskAI anywhere in your tree without needing a preset surface wrapper.
This is useful when you want global access to chat actions (open, send, clear) while keeping the UI surfaces in a fixed place, such as a layout footer or floating panel.
Usage
import { AskAIProvider, AskAI, useAskAI } from 'peam/client';
function AskAICTA() {
const { sendMessage } = useAskAI();
return (
<button
type="button"
onClick={() => {
sendMessage({ text: 'How can I install Peam?' });
}}
>
Ask how to install Peam
</button>
);
}
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body>
<AskAIProvider>
{children}
<AskAI />
<AskAICTA />
</AskAIProvider>
</body>
</html>
);
}Context reuse
By default, AskAI will reuse an existing provider when one is present. If you need a local, isolated chat state, set reuseContext={false} on a nested AskAI.
import { AskAIProvider, AskAI } from 'peam/client';
export default function Page() {
return (
<AskAIProvider>
<AskAI />
<AskAI reuseContext={false} />
</AskAIProvider>
);
}Props
AskAIProvider accepts the same props as AskAI, including endpoint, chatTransport, and persistence.