Integrations
The library provides four focused integration surfaces. Each one has useful options today and a clear path for adding your own adapter.
Capture, selection, transport and conversation state without depending on a UI framework.
The Web Component already works in modern frontend frameworks. A dedicated connector can add framework-native inputs, events and lifecycle handling without changing the assistant protocol or UI behavior.
Portable handlers built on web standards, with streaming and application-owned authentication.
The portable request, response and stream contracts stay stable. A backend connector only needs to translate its framework’s route and request objects, so it can be added without changing the browser client.
One structured answer contract, independently of the model or inference runtime.
OpenAI, Anthropic, Mistral, Google and Ollama adapters are included. Another provider or local inference runtime can implement the same generator contract while the UI, documents and validated answer format remain unchanged.
Map trusted application knowledge into a small source contract and refresh it at runtime.
A source-specific adapter can load and refresh content from a wiki, CMS, storage service or internal API. It maps that content to the same document contract while the host application keeps control of access and privacy rules.
End-to-end quick start
The complete minimal path brings frontend and backend together. Switch steps to see where each part belongs.
Contracts arrive transitively. Provider packages are already included by the server package.
$ npm install \
@123toto/ai-app-assistant-server \
@123toto/ai-app-assistant-clientThe host keeps provider keys, documents, identity and authorization.
import { createAiAppAssistantServer }
from "@123toto/ai-app-assistant-server";
const assistant = createAiAppAssistantServer({
model: process.env.AI_APP_ASSISTANT_MODEL
?? "mistral:mistral-small-latest",
documents: [
{ id: "guide", title: "Product guide", content: guide },
{ id: "openapi", title: "API", content: openApi }
],
http: {
resolveContext: request => auth.currentUser(request),
authorize: user => permissions.requireAssistant(user)
}
});
export const POST = (request: Request) =>
assistant.fetch.handle(request);The same element works in plain HTML and inside React, Vue, Svelte or Angular.
// app.ts
import "@123toto/ai-app-assistant-client/web-component";
<!-- app.html -->
<ai-app-assistant
endpoint="/api/ai-assistant/ask"
stream-endpoint="/api/ai-assistant/ask/stream"
assistant-name="Application guide"
></ai-app-assistant>A custom model does not change the browser client, transport or answer format.
import type { AnswerGenerator }
from "@123toto/ai-app-assistant-server";
export const generator: AnswerGenerator = {
modelId: "internal:assistant-model",
async generate(bundle, signal) {
return internalInference.generateStructuredAnswer(
bundle,
signal
);
}
};Missing a focused connector?