What stack is used to create chat boxes in conversational model cards?

Hello!

I was wondering if the frontend components used in conversational model cards on the HF website are open-sourced or not.

Take e.g. microsoft/DialoGPT-small · Hugging Face page (shown below) it looks great! It’d be nice to reuse it to show chatbot prototypes, as it doesn’t include distracting entities (e.g. the name of the sender, timestamp, sent/delivered/read marks, etc.).

Streamlit doesn’t have a dialog component AFAIK and I was wondering if the underlying code could be adapted to create custom components a la Create a Component - Streamlit Docs, e.g. to power chatbots on HF Spaces. I have seen bots implementations in streamlit, but the ones I saw are way less polished than this.

Not being a frontend developer myself, I’d have a hard time creating a chat box component from scratch, so it’d be cool to reuse yours somehow!

Thanks!

Hi,

Yes the code for the widgets is open-source (and part of the huggingface_hub library), you can view the code of the conversational widget here: huggingface_hub/ConversationalWidget.svelte at main · huggingface/huggingface_hub · GitHub

2 Likes

Btw, you can already implement basic chatbots with gradio as seen here and here.

Even then, I think the whole community would benefit from a nice streamlit component for conversations.

1 Like

I implemented a Rasa chatbot myself some day, and for that I leveraged this widget.

it’s quite simple to include in a Flask app, for instance.

1 Like

Haha related to this: GitHub - huggingface/chat-ui: Open source codebase powering the HuggingChat app :smiley: thanks!