Using the standalone component is simple. Similar to how you would use the C1Chat component (as explained in the Getting Started from Scratch guide), you can import C1Component. The props required to use the component are:

​
c1Response
string

The response received through the C1 API that needs to be rendered.

​
isStreaming
boolean

Boolean indicating whether the c1Response is currently being streamed.

​
updateMessage
(message: string) => void
optional

A function that enables C1Component to update the c1Response state.

​
onAction
(action: Action) => void | undefined
optional

The callback triggered when the user performs an action such as clicking on a button or submitting a form.

For example, when the user submits a form by clicking on “Submit” button on the generated UI, “Submit” may be the humanFriendlyMessage and the form data may be the llmFriendlyMessage. Thus, you would likely want to use the llmFriendlyMessage in your API call to the backend so that the LLM can use the form data to generate a response.