Nooxit
AI Components

Chat

A complete assistant window built from the AI components.

Assistant
Online

Hi, I am your procurement assistant. I can check orders, explain invoice holds and chase suppliers. What are you working on?

Summarize this week’s order confirmations in three bullets.
  • 42 confirmed without changes and booked automatically.
  • 5 moved delivery dates; two land after the need date.
  • 1 changed a unit price and waits for your decision.

The ai-05 block from blocks.so, rebuilt on Nooxit. It shows how the parts fit together: Conversation holds the Messages, and the footer pairs Suggestions with a Prompt Input. Replies are scripted. To wire it to a model, replace handleSend with your useChat call and stream the text into MessageResponse.

What changed from the block

  • The window is a Card: a 1px border and no shadow, instead of the block's layered shadows and 24px radius. The title and the "Online" line are CardTitle and CardDescription, and the buttons sit in CardAction.
  • The online dot uses success instead of a stock green.
  • Quick prompts are Suggestions, not hand-styled buttons.
  • Bubbles and the input keep their system look. The block's overrides for a rounded primary user bubble and a tinted input are gone.
  • Phosphor icons replace Tabler.
  • The copy is about procurement. All orders, invoices and suppliers are fictional.

Source — components/demos/ai-chat-demo.tsx

On this page