Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 68 additions & 36 deletions aicomponents.md
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider adding the LLM Kit to the Conversational UI category: https://www.telerik.com/blazor-ui/documentation/components/llmkit/overview

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"
Expand All @@ -28,6 +31,37 @@ 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-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"
Expand All @@ -36,14 +70,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"
Expand All @@ -68,14 +94,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"
Expand All @@ -84,6 +102,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"
Expand All @@ -92,20 +117,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>