Quickstart

Illustrative: your host supplies the authorized ParakeetSession and a browser bundler that handles CSS. This component owns its query cache and clears it on unmount. It does not create an Agent, sign in or grant tools.

quickstart.tsx

import { useEffect, useState } from "react";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { Parakeet, type ParakeetSession } from "@fungi.computer/parakeet";
import "@fungi.computer/parakeet/styles.css";

export function Conversation({ session }: { session: ParakeetSession }) {
  const [queryClient] = useState(() => new QueryClient());
  useEffect(() => () => queryClient.clear(), [queryClient]);
  return (
    <QueryClientProvider client={queryClient}>
      <Parakeet session={session} />
    </QueryClientProvider>
  );
}

Parakeet never reads a message’s host metadata itself. To show who wrote a line, pass authorOf: your reading of that metadata into a ParakeetAuthor ({ id, name }). A Fungi app passes messageAuthor from @fungi.computer/hub-client/message-meta; without it, lines show no author.

The view presents the Session’s observed history, live work, composer and errors. Screen readers receive the same Session status as the composer footer through a hidden polite live region; streamed transcript tokens are outside that region. The Session transport stays owned by the caller. Releasing observation does not cancel accepted work or close a borrowed Agent. When replacing a Session, provide its new handle rather than copying a snapshot into another writable store.

On touch-primary devices, Enter inserts a newline and the Send button submits the draft. On desktop, Enter submits and Shift+Enter inserts a newline.

The standalone composer tests exercise the provider, query cache, observations and prompt admission with typed fixtures. The browser contract uses the real component with a fixture Session. A fake Session checks the component, not hosted authentication or a model provider.