# React Hooks URL: /api-reference/react-hooks The `@tambo-ai/react` npm package provides hooks that expose state values and functions to make building AI apps with Tambo simple. Here you'll find a description of each state value and function, organized by hook. ### useTamboRegistry This hook provides helpers for component and tool registration. #### registerComponent `const { registerComponent } = useTamboRegistry()` This function is used to register components with Tambo, allowing them to be potentially used in Tambo's responses. #### registerTool `const { registerTool } = useTamboRegistry()` This function is used to register tools with Tambo. #### registerTools `const { registerTools } = useTamboRegistry()` This function allows registering multiple tools at once. #### addToolAssociation `const { addToolAssociation } = useTamboRegistry()` This function creates an association between components and tools. #### componentList `const { componentList } = useTamboRegistry()` This value provides access to the list of registered components. #### toolRegistry `const { toolRegistry } = useTamboRegistry()` This value provides access to the registry of all registered tools. #### componentToolAssociations `const { componentToolAssociations } = useTamboRegistry()` This value provides access to the associations between components and tools. ### useTamboThread This hook provides access to the current thread and functions for managing thread interactions. #### thread `const { thread } = useTamboThread()` The current thread object containing messages and metadata. Messages can be accessed via `thread.messages`. This value is kept up-to-date automatically by Tambo when messages are sent or received. #### sendThreadMessage `const { sendThreadMessage } = useTamboThread()` Function to send a user message to Tambo and receive a response. A call to this function will update the provided `thread` state value. To have the response streamed, use `sendThreadMessage(message, {streamResponse: true})`. #### generationStage `const { generationStage } = useTamboThread()` Current stage of message generation. Possible values are: * `IDLE`: The thread is not currently generating any response (Initial stage) * `CHOOSING_COMPONENT`: Tambo is determining which component to use for the response * `FETCHING_CONTEXT`: Gathering necessary context for the response by calling a registered tool * `HYDRATING_COMPONENT`: Generating the props for a chosen component * `STREAMING_RESPONSE`: Actively streaming the response * `COMPLETE`: Generation process has finished successfully * `ERROR`: An error occurred during the generation process #### inputValue `const { inputValue } = useTamboThread()` Current value of the thread input field. #### generationStatusMessage `const { generationStatusMessage } = useTamboThread()` Status message describing the current generation state, as generated by Tambo. #### isIdle `const { isIdle } = useTamboThread()` Boolean indicating whether the thread is in an idle state (`generationStage` is `IDLE`, `COMPLETE`, or `ERROR`). #### switchCurrentThread `const { switchCurrentThread } = useTamboThread()` Function to change the active thread by id. This will update the `thread` state value to the fetched thread. #### addThreadMessage `const { addThreadMessage } = useTamboThread()` Function to append a new message to the thread. #### updateThreadMessage `const { updateThreadMessage } = useTamboThread()` Function to modify an existing thread message. #### setLastThreadStatus `const { setLastThreadStatus } = useTamboThread()` Function to update the status of the most recent thread message. #### setInputValue `const { setInputValue } = useTamboThread()` Function to update the input field value. ### useTamboThreadList This hook provides access to the list of all threads for a project and their loading states. #### data `const { data } = useTamboThreadList()` Array of threads or null if not yet loaded. #### isPending `const { isPending } = useTamboThreadList()` Boolean indicating if threads are currently being fetched. #### isSuccess `const { isSuccess } = useTamboThreadList()` Boolean indicating if threads were successfully fetched. #### isError `const { isError } = useTamboThreadList()` Boolean indicating if an error occurred while fetching threads. #### error `const { error } = useTamboThreadList()` Error object containing details if the fetch failed. ### useTamboThreadInput This hook provides utilities for building an input interface that sends messages to Tambo. #### value `const { value } = useTamboThreadInput()` Current value of the input field. #### setValue `const { setValue } = useTamboThreadInput()` Function to update the input field value. #### submit `const { submit } = useTamboThreadInput()` Function to submit the current input value, with optional context and streaming configuration. #### isPending `const { isPending } = useTamboThreadInput()` Boolean indicating if a submission is in progress. #### isSuccess `const { isSuccess } = useTamboThreadInput()` Boolean indicating if the last submission was successful. #### isError `const { isError } = useTamboThreadInput()` Boolean indicating if the last submission failed. #### error `const { error } = useTamboThreadInput()` Error object containing details if the submission failed. ### useTamboSuggestions This hook provides utilities for managing AI-generated message suggestions. #### suggestions `const { suggestions } = useTamboSuggestions()` List of available AI-generated suggestions for the next message. #### selectedSuggestionId `const { selectedSuggestionId } = useTamboSuggestions()` ID of the currently selected suggestion. #### accept `const { accept } = useTamboSuggestions()` Function to accept and apply a suggestion, with an option for automatic submission. #### acceptResult `const { acceptResult } = useTamboSuggestions()` Detailed mutation result for accepting a suggestion. #### generateResult `const { generateResult } = useTamboSuggestions()` Detailed mutation result for generating new suggestions. #### isPending `const { isPending } = useTamboSuggestions()` Boolean indicating if a suggestion operation is in progress. #### isSuccess `const { isSuccess } = useTamboSuggestions()` Boolean indicating if the last operation was successful. #### isError `const { isError } = useTamboSuggestions()` Boolean indicating if the last operation resulted in an error. #### error `const { error } = useTamboSuggestions()` Error object containing details if the operation failed. ### useTamboClient This hook provides direct access to the Tambo client instance. #### client `const { client } = useTamboClient()` The Tambo client instance for direct API access. ### useTamboComponentState This hook is similar to React's `useState`, but allows Tambo to see the state values to help respond to later messages. `const [myValue, setMyValue] = useTamboComponentState()` #### value and setValue `const { value } = useTamboComponentState()` Current state value stored in the thread message for the given key. #### setValue `const { setValue } = useTamboComponentState()` Function to update the state value, synchronizing both local state and server state. ### useTamboContextHelpers This hook provides dynamic control over context helpers. #### getContextHelpers `const { getContextHelpers } = useTamboContextHelpers()` Returns the current map of registered helper functions keyed by name. #### addContextHelper `const { addContextHelper } = useTamboContextHelpers()` Adds or replaces a helper at the given key. #### removeContextHelper `const { removeContextHelper } = useTamboContextHelpers()` Removes a helper by key so it is no longer included in outgoing messages. ### useTamboContextAttachment This hook provides utilities for managing context attachments and custom suggestions. #### attachments `const { attachments } = useTamboContextAttachment()` Array of active context attachments currently displayed as badges above the message input. #### addContextAttachment `const { addContextAttachment } = useTamboContextAttachment()` Function to add a new context attachment. Accepts an object with `name`, optional `icon`, and optional `metadata`. The `id` is automatically generated. #### removeContextAttachment `const { removeContextAttachment } = useTamboContextAttachment()` Function to remove a specific context attachment by its ID. #### clearContextAttachments `const { clearContextAttachments } = useTamboContextAttachment()` Function to remove all active context attachments at once. #### customSuggestions `const { customSuggestions } = useTamboContextAttachment()` Current custom suggestions that override auto-generated suggestions. Returns `null` if using auto-generated suggestions. #### setCustomSuggestions `const { setCustomSuggestions } = useTamboContextAttachment()` Function to set custom suggestions or clear them by passing `null`. ### useCurrentInteractablesSnapshot `const snapshot = useCurrentInteractablesSnapshot()` Returns a cloned snapshot of the current interactable components.