@assistant-ui/react
Version:
TypeScript/React library for AI Chat
118 lines • 4.59 kB
TypeScript
import { MessageRuntime } from "../runtime/MessageRuntime";
/**
* Hook to access the MessageRuntime from the current context.
*
* The MessageRuntime provides access to message-level state and actions,
* including message content, status, editing capabilities, and branching.
*
* @param options Configuration options
* @param options.optional Whether the hook should return null if no context is found
* @returns The MessageRuntime instance, or null if optional is true and no context exists
*
* @example
* ```tsx
* function MessageActions() {
* const runtime = useMessageRuntime();
*
* const handleReload = () => {
* runtime.reload();
* };
*
* const handleEdit = () => {
* runtime.startEdit();
* };
*
* return (
* <div>
* <button onClick={handleReload}>Reload</button>
* <button onClick={handleEdit}>Edit</button>
* </div>
* );
* }
* ```
*/
export declare function useMessageRuntime(options?: {
optional?: false | undefined;
}): MessageRuntime;
export declare function useMessageRuntime(options?: {
optional?: boolean | undefined;
}): MessageRuntime | null;
/**
* Hook to access the current message state.
*
* This hook provides reactive access to the message's state, including content,
* role, status, and other message-level properties.
*
* @param selector Optional selector function to pick specific state properties
* @returns The selected message state or the entire message state if no selector provided
*
* @example
* ```tsx
* function MessageContent() {
* const role = useMessage((state) => state.role);
* const content = useMessage((state) => state.content);
* const isLoading = useMessage((state) => state.status.type === "running");
*
* return (
* <div className={`message-${role}`}>
* {isLoading ? "Loading..." : content.map(part => part.text).join("")}
* </div>
* );
* }
* ```
*/
export declare const useMessage: {
(): import("../runtime").MessageState;
<TSelected>(selector: (state: import("../runtime").MessageState) => TSelected): TSelected;
<TSelected>(selector: ((state: import("../runtime").MessageState) => TSelected) | undefined): import("../runtime").MessageState | TSelected;
(options: {
optional?: false | undefined;
}): import("../runtime").MessageState;
(options: {
optional?: boolean | undefined;
}): import("../runtime").MessageState | null;
<TSelected>(options: {
optional?: false | undefined;
selector: (state: import("../runtime").MessageState) => TSelected;
}): TSelected;
<TSelected>(options: {
optional?: false | undefined;
selector: ((state: import("../runtime").MessageState) => TSelected) | undefined;
}): import("../runtime").MessageState | TSelected;
<TSelected>(options: {
optional?: boolean | undefined;
selector: (state: import("../runtime").MessageState) => TSelected;
}): TSelected | null;
<TSelected>(options: {
optional?: boolean | undefined;
selector: ((state: import("../runtime").MessageState) => TSelected) | undefined;
}): import("../runtime").MessageState | TSelected | null;
};
export declare const useEditComposer: {
(): import("../runtime").EditComposerState;
<TSelected>(selector: (state: import("../runtime").EditComposerState) => TSelected): TSelected;
<TSelected>(selector: ((state: import("../runtime").EditComposerState) => TSelected) | undefined): import("../runtime").EditComposerState | TSelected;
(options: {
optional?: false | undefined;
}): import("../runtime").EditComposerState;
(options: {
optional?: boolean | undefined;
}): import("../runtime").EditComposerState | null;
<TSelected>(options: {
optional?: false | undefined;
selector: (state: import("../runtime").EditComposerState) => TSelected;
}): TSelected;
<TSelected>(options: {
optional?: false | undefined;
selector: ((state: import("../runtime").EditComposerState) => TSelected) | undefined;
}): import("../runtime").EditComposerState | TSelected;
<TSelected>(options: {
optional?: boolean | undefined;
selector: (state: import("../runtime").EditComposerState) => TSelected;
}): TSelected | null;
<TSelected>(options: {
optional?: boolean | undefined;
selector: ((state: import("../runtime").EditComposerState) => TSelected) | undefined;
}): import("../runtime").EditComposerState | TSelected | null;
};
//# sourceMappingURL=MessageContext.d.ts.map