DTC-169 standardize Blazor AI components intro

aicomponents.md

@@ -9,17 +9,20 @@ tag: updated
 
 # Telerik UI for Blazor AI Components & Features
 
-Explore the powerful AI-enhanced components and features in Telerik UI for Blazor designed to transform your web applications with intelligent functionality. These cutting-edge tools integrate seamlessly with modern AI services to provide smart data operations, conversational interfaces, and automated assistance that enhance user productivity.
+Telerik UI for Blazor provides components and Grid features for building AI-assisted application workflows. Use them to add conversational interfaces, AI-assisted data discovery and operations, AI-assisted editing, and natural-language-driven UI actions to your Blazor application.
+
+The available tools fit into four categories:
+
+1. [Conversational UI](#conversational-ui)—Chat, PromptBox, Inline AI Prompt, and AI Prompt for conversational and prompt-driven interfaces.
+2. [Smart Grid Features](#smart-grid-features)—Semantic Search, AI Data Operations, AI Data Highlight, AI Column Assistant, and AI Chat Integration for AI-assisted Telerik UI for Blazor Grid workflows.
+3. [Editor AI Integration](#editor-ai-integration)—AI-assisted writing and content operations in the Telerik UI for Blazor Editor.
+4. [Utility Components](#utility-components)—SmartPaste for mapping clipboard content to form inputs, and WebMCP Support for enabling natural-language control of application UI through MCP.
+
+## Conversational UI
+
+Build prompt-driven and chat-based interfaces with components designed for conversational workflows.
 
 <article-card-container>
-    <article-card
-        href="/ai/web-mcp/overview"
-        src="./images/aicomponents/WebMCP_Light.svg"
-        title="WebMCP Support"
-        subTitle="UI Component Feature"
-        darkSrc="./images/aicomponents/WebMCP_Dark.svg"
-        description="Perform operations like data sorting, data filtering, navigation, value changes, and more through natural language user prompts.">
-    </article-card>
     <article-card
         href="/components/chat/overview"
         src="./images/aicomponents/Chat_Light_Large.svg"
@@ -28,6 +31,45 @@ Explore the powerful AI-enhanced components and features in Telerik UI for Blazo
         darkSrc="./images/aicomponents/Chat_Dark_Large.svg"
         description="Create interactive AI chatbots using the Telerik UI for Blazor Chat component with messaging, notifications, and smart replies.">
     </article-card>
+    <article-card
+        href="/components/promptbox/overview"
+        src="./images/aicomponents/PromptBox_Light_Large.svg"
+        title="PromptBox"
+        subTitle="UI Component"
+        darkSrc="./images/aicomponents/PromptBox_Dark_Large.svg"
+        description="Improve AI prompting with the Telerik UI for Blazor PromptBox component - smart input for conversational apps.">
+    </article-card>
+    <article-card
+        href="/components/inlineaiprompt/overview"
+        src="./images/aicomponents/InlineAIPrompt_Light_Large.svg"
+        title="Inline AI Prompt"
+        subTitle="UI Component"
+        darkSrc="./images/aicomponents/InlineAIPrompt_Dark_Large.svg"
+        description="Boost efficiency using the Blazor Inline AIPrompt with smart contextual hints and AI-powered content recommendations.">
+    </article-card>
+    <article-card
+        href="/components/aiprompt/overview"
+        src="./images/aicomponents/AIPrompt_Light_Large.svg"
+        title="AI Prompt"
+        subTitle="UI Component"
+        darkSrc="./images/aicomponents/AIPrompt_Dark_Large.svg"
+        description="Enhance user input with the Blazor AIPrompt component featuring intelligent suggestions and workflow optimization.">
+    </article-card>
+    <article-card
+        href="/components/llmkit/overview"
+        src="./images/aicomponents/LLM Kit_Light_Large.svg"
+        title="LLM Kit"
+        subTitle="AI Component Collection"
+        darkSrc="./images/aicomponents/LLM Kit_Dark_Large.svg"
+        description="Build transparent AI agent experiences with the Telerik UI for Blazor LLM Kit components for reasoning, tool calls, citations, and checkpoints.">
+    </article-card>
+</article-card-container>
+
+## Smart Grid Features
+
+Add AI-assisted data discovery, operations, highlighting, column configuration, and chat workflows to the Telerik UI for Blazor Grid.
+
+<article-card-container>
     <article-card
         href="/components/grid/smart-ai-features/ai-semantic-search"
         src="./images/aicomponents/Semantic_Search_Light_Large.svg"
@@ -36,14 +78,6 @@ Explore the powerful AI-enhanced components and features in Telerik UI for Blazo
         darkSrc="./images/aicomponents/Semantic_Search_Dark_Large.svg"
         description="Enhance data discovery using the Telerik UI for Blazor Grid Semantic Search - intelligent meaning-based search capabilities.">
     </article-card>
-    <article-card
-        href="/components/smartpastebutton/overview"
-        src="./images/aicomponents/SmartPaste_Light_Large.svg"
-        title="SmartPaste"
-        subTitle="UI Component"
-        darkSrc="./images/aicomponents/SmartPaste_Dark_Large.svg"
-        description="Streamline data entry with the Telerik UI for Blazor SmartPaste component - map and insert clipboard content into input fields with a single click.">
-    </article-card>
     <article-card
         href="/components/grid/smart-ai-features/overview"
         src="./images/aicomponents/AI_Data_Operations_Light_Large.svg"
@@ -68,14 +102,6 @@ Explore the powerful AI-enhanced components and features in Telerik UI for Blazo
         darkSrc="./images/aicomponents/AI_Column_Assistant_Dark_Large.svg"
         description="Enhance Grid efficiency using the Telerik UI for Blazor Grid AI Column Assistant—intelligent configuration and management.">
     </article-card>
-    <article-card
-        href="/components/promptbox/overview"
-        src="./images/aicomponents/PromptBox_Light_Large.svg"
-        title="PromptBox"
-        subTitle="UI Component"
-        darkSrc="./images/aicomponents/PromptBox_Dark_Large.svg"
-        description="Improve AI prompting with the Telerik UI for Blazor PromptBox component - smart input for conversational apps.">
-    </article-card>
     <article-card
         href="/components/grid/smart-ai-features/ai-chat-assistant"
         src="./images/aicomponents/Grid_AI_Chat_Integration_Light_Large.svg"
@@ -84,6 +110,13 @@ Explore the powerful AI-enhanced components and features in Telerik UI for Blazo
         darkSrc="./images/aicomponents/Grid_AI_Chat_Integration_Dark_Large.svg"
         description="Transform Grid workflows using the Telerik UI for Blazor Grid AI Chat Integration - contextual assistance and advanced AI experience.">
     </article-card>
+</article-card-container>
+
+## Editor AI Integration
+
+Use AI-assisted writing and content operations built into the Telerik UI for Blazor Editor component.
+
+<article-card-container>
     <article-card
         href="/components/editor/ai-integration/overview"
         src="./images/aicomponents/Editor_AI_Integration_Light_Large.svg"
@@ -92,20 +125,27 @@ Explore the powerful AI-enhanced components and features in Telerik UI for Blazo
         darkSrc="./images/aicomponents/Editor_AI_Integration_Dark_Large.svg"
         description="Transform content development with Telerik UI for Blazor Editor AI Integration - AI-powered writing and optimization.">
     </article-card>
+</article-card-container>
+
+## Utility Components
+
+Use SmartPaste to map clipboard content to form inputs and WebMCP Support to enable natural-language control of application UI through MCP.
+
+<article-card-container>
     <article-card
-        href="/components/inlineaiprompt/overview"
-        src="./images/aicomponents/InlineAIPrompt_Light_Large.svg"
-        title="Inline AI Prompt"
+        href="/components/smartpastebutton/overview"
+        src="./images/aicomponents/SmartPaste_Light_Large.svg"
+        title="SmartPaste"
         subTitle="UI Component"
-        darkSrc="./images/aicomponents/InlineAIPrompt_Dark_Large.svg"
-        description="Boost efficiency using the Blazor Inline AIPrompt with smart contextual hints and AI-powered content recommendations.">
+        darkSrc="./images/aicomponents/SmartPaste_Dark_Large.svg"
+        description="Streamline data entry with the Telerik UI for Blazor SmartPaste component - map and insert clipboard content into input fields with a single click.">
     </article-card>
     <article-card
-        href="/components/aiprompt/overview"
-        src="./images/aicomponents/AIPrompt_Light_Large.svg"
-        title="AI Prompt"
-        subTitle="UI Component"
-        darkSrc="./images/aicomponents/AIPrompt_Dark_Large.svg"
-        description="Enhance user input with the Blazor AIPrompt component featuring intelligent suggestions and workflow optimization.">
+        href="/ai/web-mcp/overview"
+        src="./images/aicomponents/WebMCP_Light.svg"
+        title="WebMCP Support"
+        subTitle="UI Component Feature"
+        darkSrc="./images/aicomponents/WebMCP_Dark.svg"
+        description="Perform operations like data sorting, data filtering, navigation, value changes, and more through natural language user prompts.">
     </article-card>
 </article-card-container>