➡️➡️➡️ AI Chat Pro — a finished GPT live chat you drop on a page 💬✨
Stop rebuilding the same chat. This is the whole thing, done: answers that stream in word by word, Markdown that renders as it arrives, conversation history you can save to your database, and an agent mode that runs your Bubble workflows mid-answer.

Drag it onto a page, paste an API key, and you have a working assistant. Every colour, label and behaviour is a field — no CSS, no HTML, no custom code.

✅ Streams word by word — the answer appears as it is written, like ChatGPT
✅ Markdown live — bold, italics, lists, links, inline code and code blocks
✅ Light & dark — automatic, or force one, with 16 appearance fields
✅ Conversations that survive a refresh — save to your database, restore in one action
✅ Agent mode — the assistant asks, your workflow answers, the reply continues
✅ 3 providers, one dropdown — OpenAI (ChatGPT / GPT-4o), Anthropic Claude, Google Gemini
✅ Cost per answer — tokens in, tokens out, dollars spent, ready to show or log
✅ 24 states, 7 events, 6 actions — everything is reachable from your workflows

────────────────────────────────
CHECK IT
────────────────────────────────

Live demo: https://plugins-testing-46093.bubbleapps.io/version-test/ai_chat

Editor (see how it is set up):https://bubble.io/page?id=plugins-testing-46093&test_plugin=1787860308712x603062507126128600_current&tab=Design&name=ai_chat&type=page&elements=bTHoM

────────────────────────────────
FEATURES
────────────────────────────────

💬 A chat that is already finished
Message bubbles, a growing input box, a Send button that turns into Stop while the answer arrives, suggested prompts on an empty chat, and an empty state you write yourself. The scroll follows the newest message — unless the reader has scrolled up to re-read something, in which case it leaves them alone. That last detail is the one most chat builds get wrong.

🎨 Customize it to match your brand.
Sixteen appearance fields: accent, background, text, four bubble colours, three separate borders, input background, font, font size, and two corner radii. Leave them empty and it uses a palette that already works and follows the visitor's light/dark setting on its own.

⚡ Real streaming
The answer is painted as it arrives, token by token. Only the last bubble repaints while text streams in, so a long conversation does not drop frames on a mid-range phone.

🤖 Turn it into an agent with one field
Write your tools in plain text — one per line, parameters indented — and the same element becomes an agent. When it needs something, it fires an event with the tool name and arguments, your workflow does the work, you hand back the result, and the answer carries on. Check stock, look up an order, book an appointment, write to your database, call another API. It stops at a step limit you control, and it never invents a tool you did not declare.

🧠 Structured output
Ask for fields instead of prose — "title: text", "priority: number", "urgent: yes/no" — and get back a validated object in the json state, ready for Get data from JSON.

💾 Conversations that persist
The whole conversation is published as JSON in one state. Save it to a Bubble field on every answer, restore it when the page loads, and your users pick up where they left off — on any device.

💵 See the costs
Input tokens, output tokens, total, and an estimated cost in dollars, formatted and ready to drop into a text. Per answer, live.

────────────────────────────────
WHAT YOU CAN BUILD WITH IT
────────────────────────────────

🛍️ A support agent that actually does things — it checks the order status in your database, cancels a subscription, or opens a ticket, then explains what it did in plain language.

🧑‍💼 Your own ChatGPT — a sidebar of past conversations, one per user, each saved as a Bubble thing. The documentation walks through this build step by step.

📚 An assistant that knows your business — put your policies, prices and rules in the system prompt and it answers from them instead of guessing.

🎯 A lead qualifier — it interviews the visitor, then hands you a validated object with budget, timeline and use case, ready to write to your CRM.

🏫 A tutor, a coach, a concierge — the personality is one text field, and you can change it per user, per page, or per plan.

────────────────────────────────
WHY AI CHAT PRO
────────────────────────────────

It is finished, not a starting point. Stop button, Regenerate, suggested prompts, saved conversations, error messages written to be read by a human — the parts you would otherwise spend a week adding after the demo works.

Changing AI provider is a dropdown. Same fields, same states, same events across OpenAI, Claude and Gemini. Try a cheaper model  without touching a workflow.

It fails in a way you can act on. Every error arrives as a plain sentence that names the field or the setting that is wrong, plus a code you can branch on. No stack traces, no silent blank bubbles.

It does not bill you by surprise. The history sent each turn is capped by a field you control, the agent loop has a step limit, and the cost of every answer is on screen if you want it there.

Nothing else to install. No external service, no account beyond your AI provider, no server actions to configure. One HTML header, one element, done.

────────────────────────────────

Full documentation, with a worked example for every field and a complete agent walkthrough, is linked on the instruction page.