Components / Chat
Chat
Conversation over a field to write in, with examples and cards to act on.
Example
The component itself, running in WebAssembly, beside its code in a playground. Try it.
Code
use ravenrs::prelude::*;
fn chat() -> impl View {
/// Keeps the messages, here while the page rebuilds. A real app keeps them in its state.
struct Conversation;
impl View for Conversation {
fn build(&self, cx: &mut BuildCx<'_>) -> NodeId {
let messages = cx.use_state(Vec::<ChatMessage>::new);
let answers = messages.clone();
let chat = Chat::new(messages.binding())
.placeholder("Ask something")
.intro("It does not know who answers: yours adds to the messages, now or later.")
.examples(["How do I start?", "Where are my files?"])
.on_send(move |text| {
// Marks, links and a file in the bubble are asked for message by message.
let reply = ChatMessage::assistant(format!("*You asked:* {text}"))
.formatted()
.media(ChatMedia::document("answer.pdf").size(48_000).on_open(|| {}))
.card(|| Box::new(Button::new("Open it").size(ButtonSize::Small)));
answers.update(|all| all.push(reply));
});
cx.child(&VStack::new((chat,)).height(380.0).width(420.0))
}
}
Conversation
}