docs: add ai component docs and update ai quickstart

[ugur-vaadin]

This PR

• adds AI components documentation
• updates the "Building apps" AI section and the quick start guide

[rolfsmeds]

Mostly LGTM. However, I can't help but feel that Components is a weird place for this.
An AI subsection in the Flow Reference top-level section would seem more logical. Does @peholmst have opinions?

[rolfsmeds]

I would write these section titles like we do component names, i.e. "AI Input", "AI Message List", etc.

[ugur-vaadin]

Updated the AI component interface section headers.

[rolfsmeds]

It remains unclear here where chatModel and chatClient are coming from

[ugur-vaadin]

Added brief clarification and short pseudo examples on how to create them

[rolfsmeds]

The code snippet here could be expanded by default, as the render alone doesn't provide much use

[rolfsmeds]

Actually I'd argue that goes for all code snippets on this page.

[ugur-vaadin]

Expanded the code snippets in the examples.

[ugur-vaadin]

Mostly LGTM. However, I can't help but feel that Components is a weird place for this. An AI subsection in the Flow Reference top-level section would seem more logical. Does @peholmst have opinions?

Moved the docs under Flow Reference. It is currently between "Deploying to Production" and "Component Internals"

[peholmst]

Putting this article in the Flow reference seems right. Let's do that. We can change it later if it turns out not to work.

[rolfsmeds]

LGTM, although I wonder if we should call this "AI Components" – does "components" give too much "UI components" vibes? I mean, these features are in a package called com.vaadin.flow.component.ai, but would there be a better umbrella term for these features? Something like AI Helpers or something?

[ugur-vaadin]

LGTM, although I wonder if we should call this "AI Components" – does "components" give too much "UI components" vibes? I mean, these features are in a package called com.vaadin.flow.component.ai, but would there be a better umbrella term for these features? Something like AI Helpers or something?

Continuing the AI components discussion from the internal DS team discussion; some of the options we have are:
Nav name: “AI & LLMs” (same with “Building Apps”) vs “AI” vs “AI Integration”
Page name: “AI in Vaadin Applications” (same with “Building Apps”) vs “Integrating AI into Vaadin Applications”
Location: Under “Integrations” vs “Flow Reference” vs “Building Apps”

@yuriy-fix suggested “Building Apps” -> “AI & LLMs” -> “AI in Vaadin Applications”; also changing the existing page in “Building Apps” entirely

[peholmst]

I have now looked at the articles. Here are my two cents.

First, I noticed the AI Components page under Flow is very long. I think splitting it up into smaller sub-pages would be beneficial. The location for this is correct, because this is reference-style material.

Second, the "AI Components" title feels a bit misleading. Maybe "AI Support" or "AI Integration" or "AI Enabled Apps" would be better. I don't think it should be under Integrations because that's not where I would look for it. Its current level and position in the nav tree is fine.

[ugur-vaadin]

Updated the PR:

• The page name is now "AI Support"

• Still under "Flow Reference"

• Split the page into smaller sections:

  • Overview
  • Component Interfaces
  • LLM Providers
  • File Attachments
  • Tool Calling & Programmatic Prompts
  • Conversation History & Session Persistence

[rolfsmeds]

LGTM. Just a couple of things I think we should add:

• Add a link to this section from components/message-list#usage-for-ai-chats
• Replace the term "AI Components" in the quick start guide with something like AI support features
• Replace the term "AI Components" in the preview admonitions to something like that too
• On the Component Interfaces page
  • Link from the mentions of MessageList and MessageInput to those component pages
  • Link from the mentions of Upload / UploadManager to the Upload component page.

[ugur-vaadin]

LGTM. Just a couple of things I think we should add:

• Add a link to this section from components/message-list#usage-for-ai-chats

• Replace the term "AI Components" in the quick start guide with something like AI support features

• Replace the term "AI Components" in the preview admonitions to something like that too

• On the Component Interfaces page

  • Link from the mentions of MessageList and MessageInput to those component pages
  • Link from the mentions of Upload / UploadManager to the Upload component page.

Updated the naming and added the links.