API der Komponente Chat

Import

import-chat.ts

import { NuiChat, NuiChatSession, nuiEventStream } from '@needless-ui/angular/chat';

NuiChat

Die Unterhaltung und das Eingabefeld in einem.

Selektor: nui-chat

NuiChat: Eigenschaften
Name	Typ	Standardwert	Beschreibung
`session`Input	`NuiChatSession`		Die anzuzeigende Unterhaltung.
`assistant`Input	`string`	`'Assistant'`	Der Name des Assistenten in den Überschriften, die Screenreader ansagen.
`headingLevel`Input	`number`	`3`	Die Ebene der Überschrift jeder Nachricht, die nur Screenreader wahrnehmen. Überschriften in Antworten liegen eine Ebene tiefer.
`announce`Input	`'reply' \| 'notice' \| 'off'`	`'reply'`	Was Screenreader ansagen, wenn eine Antwort vollständig ist: alles, einen kurzen Hinweis oder nichts.
`images`Input	`boolean`	`false`	Zeigt Bilder in Antworten. Sonst verlinkt ihr Text auf das Bild.
`value`Two-Way	`string`	`''`	Der Text, der gerade geschrieben wird.
`placeholder`Input	`string`		Der Hinweis im leeren Feld.
`suggestions`Input	`string[]`	`[]`	Prompts, die per Klick gesendet werden, bis zur ersten Nachricht.
`sendOn`Input	`'enter' \| 'mod+enter'`	`'enter'`	Ob Enter sendet oder Ctrl bzw. ⌘ + Enter.
`disabled`Input	`boolean`	`false`	Verhindert das Senden aus dem Eingabefeld.
`attach`Input	`boolean`	`false`	Nimmt Dateien an: ausgewählt, eingefügt oder hineingezogen.
`accept`Input	`string`	`''`	Die erlaubten Dateitypen, wie bei `<input type="file">`.
`maxFiles`Input	`number`	`10`	Wie viele Dateien eine Nachricht enthalten kann.
`maxSize`Input	`number`	`20_000_000`	Die maximale Dateigröße in Byte.
`labels`Input	`NuiChatLabelsInput`		Alle Texte, die der Chat anzeigt oder ansagt, zum Übersetzen.
`rated`Output	`{ message, rating }`		Emittiert eine vom Nutzer bewertete Antwort samt Bewertung oder `null`, wenn er sie zurücknimmt.
`focus`Methode	`() => void`		Fokussiert das Textfeld.
`scrollToEnd`Methode	`(behavior?) => void`		Scrollt zur neuesten Nachricht und folgt ihr.

NuiChatSession

Die Unterhaltung, ganz ohne DOM. Erstelle sie in einer Komponente mit den Optionen respond, messages und id.

NuiChatSession: Eigenschaften
Name	Typ	Beschreibung
`respond`Eigenschaft	`(request) => NuiChatReply`	Deine Funktion: schreibt die Antwort auf `request.messages` und stoppt, sobald `request.signal` abbricht.
`messages`Eigenschaft	`Signal<NuiChatMessage[]>`	Die angezeigte Unterhaltung.
`all`Eigenschaft	`Signal<NuiChatMessage[]>`	Alle Nachrichten aller Versionen, zum Speichern und späteren Übergeben als `messages`.
`busy`Eigenschaft	`Signal<boolean>`	Ob gerade eine Antwort unterwegs ist.
`send`Methode	`(text, files?) => Promise<void>`	Sendet eine Nachricht und fordert eine Antwort an.
`stop`Methode	`() => void`	Stoppt die Antwort und behält, was sie schon geschrieben hat.
`retry`Methode	`(message?) => Promise<void>`	Fragt erneut. Die neue Antwort ist eine Version neben der alten.
`edit`Methode	`(message, text) => Promise<void>`	Sendet eine neue Version einer Nachricht des Nutzers.
`versions`Methode	`(message) => NuiChatMessage[]`	Alle Versionen einer Nachricht, die älteste zuerst.
`show`Methode	`(message) => void`	Schaltet die Unterhaltung auf diese Version um.
`rate`Methode	`(message, 'up' \| 'down' \| null) => void`	Speichert die Bewertung einer Antwort durch den Nutzer.
`remove, load, clear`Methode	`(…) => void`	Entfernt eine Nachricht samt allem danach, ersetzt die Unterhaltung oder beginnt von vorn.

NuiChatMessage

Eine Nachricht. Nachrichten mit demselben parent sind Versionen voneinander.

NuiChatMessage: Eigenschaften
Name	Typ	Beschreibung
`id, parent`Eigenschaft	`string, string \| null`	Der Schlüssel der Nachricht und der Nachricht, auf die sie folgt.
`role`Eigenschaft	`'user' \| 'assistant'`	Wer sie geschrieben hat.
`text`Eigenschaft	`string`	Markdown vom Assistenten, reiner Text vom Nutzer.
`status`Eigenschaft	`'pending' \| 'streaming' \| 'done' \| 'stopped' \| 'error'`	Wo eine Antwort steht, von wartend bis fertig.
`reasoning`Eigenschaft	`string`	Was das Modell vor der Antwort überlegt hat.
`tools`Eigenschaft	`NuiChatTool[]`	Die aufgerufenen Tools mit Status, Ein- und Ausgabe.
`sources`Eigenschaft	`{ url, title? }[]`	Die genutzten Seiten.
`attachments`Eigenschaft	`NuiChatAttachment[]`	Die mitgesendeten Dateien.
`rating`Eigenschaft	`'up' \| 'down' \| null`	Die Bewertung des Nutzers.
`data`Eigenschaft	`unknown`	Alles Weitere, das dazugehört, etwa der Name des Modells.

NuiChatToolTemplate

Zeichnet einen Tool-Aufruf, etwa eine Karte fürs Wetter. Der Kontext enthält den Aufruf und seine Nachricht.

Selektor: ng-template[nuiChatTool]

NuiChatToolTemplate: Eigenschaften
Name	Typ	Standardwert	Beschreibung
`nuiChatTool`Input	`string`		Der Name des Tools. Ohne Namen zeichnet es jeden Aufruf, den kein anderes Template benennt.

NuiChatThread

Die Unterhaltung für sich, für dein eigenes Layout. Sie nimmt die Inputs von nui-chat an, die die Unterhaltung betreffen.

Selektor: nui-chat-thread

NuiChatComposer

Das Eingabefeld für sich. Es nimmt die Inputs von nui-chat an, die das Schreiben betreffen.

Selektor: nui-chat-composer

NuiServerEvent

Was nuiEventStream für jedes Event liefert. nuiTextStream liest reinen Text und nuiJsonStream JSON-Zeilen; alle drei nehmen eine fetch-Response entgegen.

NuiServerEvent: Eigenschaften
Name	Typ	Standardwert	Beschreibung
`event`Eigenschaft	`string`	`'message'`	Der Name des Events.
`data`Eigenschaft	`string`		Seine Datenzeilen, zusammengefügt.
`id`Eigenschaft	`string`		Die letzte ID, die der Stream gesendet hat.

NuiChatError

Wirf ihn in respond, um seine Meldung anzuzeigen. Jeder andere Fehler zeigt eine allgemeine Meldung, damit nichts Internes nach außen dringt.