Skip to content
Merged
Show file tree
Hide file tree
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
4 changes: 2 additions & 2 deletions blazor-toc.html

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion blazor/ai-assistview/ai-integrations/gemini-integration.md
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ Nuget\Install-Package Markdig

## Gemini AI with AI AssistView

Modify the Razor file to integrate the Gemini AI with the AI AssistView component.
Modify the razor file to integrate the Gemini AI with the AI AssistView component.

* update your Gemini API key securely in the configuration:

Expand Down
4 changes: 2 additions & 2 deletions blazor/ai-coding-assistants/mcp-server.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ documentation: ug

## Overview

The [SyncfusionBlazorAssistant](https://www.npmjs.com/package/@syncfusion/blazor-assistant) is a specialized [Model Context Protocol (MCP)](https://modelcontextprotocol.io/introduction) server that provides intelligent assistance for developers using Syncfusion's Blazor component libraries. This tool seamlessly integrates with compatible [MCP clients](https://modelcontextprotocol.io/clients) to enhance your development workflow when building Blazor applications with Syncfusion<sup style="font-size:70%">&reg;</sup> components.
The [SyncfusionBlazorAssistant](https://www.npmjs.com/package/@syncfusion/blazor-assistant) is a specialized [Model Context Protocol (MCP)](https://modelcontextprotocol.io/docs/getting-started/intro) server that provides intelligent assistance for developers using Syncfusion's Blazor component libraries. This tool seamlessly integrates with compatible [MCP clients](https://modelcontextprotocol.io/clients) to enhance your development workflow when building Blazor applications with Syncfusion<sup style="font-size:70%">&reg;</sup> components.

### Key Benefits

Expand Down Expand Up @@ -149,7 +149,7 @@ To configure an MCP server for a specific workspace, you can create a .cursor/mc

> For more detailed information about configuring MCP servers in various clients, refer to the official documentations.
* [VS Code](https://code.visualstudio.com/docs/copilot/chat/mcp-servers#_add-an-mcp-server)
* [Cursor](https://docs.cursor.com/en/context/mcp#using-mcp-json)
* [Cursor](https://cursor.com/docs/context/mcp#using-mcp-json)
* [JetBrains](https://www.jetbrains.com/help/ai-assistant/mcp.html#connect-to-an-mcp-server)
* [Windsurf](https://docs.windsurf.com/windsurf/cascade/mcp#mcp-config-json)

Expand Down
4 changes: 2 additions & 2 deletions blazor/ai-coding-assistants/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ platform: Blazor
documentation: ug
---

# Syncfusion<sup style="font-size:70%">&reg;</sup> AI Coding Assistants Overview
# Syncfusion® AI Coding Assistants Overview

The **Syncfusion<sup style="font-size:70%">&reg;</sup> AI Coding Assistants** are designed to streamline your development workflow when building Blazor applications with Syncfusion<sup style="font-size:70%">&reg;</sup> components. It uses contextual knowledge of the Syncfusion<sup style="font-size:70%">&reg;</sup> component library to generate accurate code snippets, configuration examples, and guided explanations—minimizing documentation searches and maximizing productivity.

Expand Down Expand Up @@ -69,4 +69,4 @@ The Syncfusion<sup style="font-size:70%">&reg;</sup> AI Coding Assistants is des

* Add the [SyncfusionBlazor MCP Server](./mcp-server.md) to an MCP-enabled client
* Install the [SyncfusionBlazor GitHub Copilot Extension](./copilot-extension.md)
* [Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Documentation](https://blazor.syncfusion.com/documentation)
* [Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Documentation](https://blazor.syncfusion.com/documentation)
4 changes: 2 additions & 2 deletions blazor/check-box/getting-started-with-web-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -234,6 +234,6 @@ N> [View sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-

## See also

1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli)
1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app)
2. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-visual-studio)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app)
4 changes: 2 additions & 2 deletions blazor/datepicker/getting-started-with-web-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -251,6 +251,6 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-

## See also

1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli)
1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app)
2. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-visual-studio)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app)
4 changes: 3 additions & 1 deletion blazor/diagram/getting-started-with-maui-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,9 @@ documentation: ug

This guide walks through the step-by-step process of integrating the Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Diagram component into a Blazor MAUI application using either Visual Studio or Visual Studio Code.

A complete working example is available in the [GitHub repository](https://github.com/SyncfusionExamples/Blazor-Getting-Started-Examples/tree/main/DiagramComponent/BlazorMAUIApp/DiagramSample).
> **Ready to streamline your Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor development?** <br/>Discover the full potential of Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components with Syncfusion<sup style="font-size:70%">&reg;</sup> AI Coding Assistants. Effortlessly integrate, configure, and enhance your projects with intelligent, context-aware code suggestions, streamlined setups, and real-time insights—all seamlessly integrated into your preferred AI-powered IDEs like VS Code, Cursor, Syncfusion<sup style="font-size:70%">&reg;</sup> CodeStudio and more. [Explore Syncfusion<sup style="font-size:70%">&reg;</sup> AI Coding Assistants](https://blazor.syncfusion.com/documentation/ai-coding-assistants/overview)

Additionally, you can find a fully functional example project on our [GitHub repository](https://github.com/SyncfusionExamples/Blazor-Getting-Started-Examples/tree/main/DiagramComponent/BlazorMAUIApp/DiagramSample).

{% tabcontents %}

Expand Down
4 changes: 2 additions & 2 deletions blazor/diagram/getting-started-with-wasm-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -231,7 +231,7 @@ dotnet --version

## Step 1: Create a Blazor WebAssembly App using .NET CLI

Run the `dotnet new blazorwasm` command to create a new Blazor WebAssembly application in a command prompt (Windows), terminal (macOS), or command shell (Linux).
Run the `dotnet new blazorwasm` command to create a new Blazor WebAssembly App in a command prompt (Windows) or terminal (macOS) or command shell (Linux).

{% tabs %}
{% highlight c# tabtitle=".NET CLI" %}
Expand All @@ -242,7 +242,7 @@ cd BlazorApp
{% endhighlight %}
{% endtabs %}

This command creates a new Blazor WebAssembly app project and places it in a new directory called `BlazorApp` inside the current location. See [Create Blazor app topic](https://dotnet.microsoft.com/en-us/learn/aspnet/blazor-tutorial/create) and the [dotnet new CLI command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-new) topics for more details.
This command creates new Blazor WebAssembly App and places it in a new directory called `BlazorApp` inside your current location. See [Create Blazor app topic](https://dotnet.microsoft.com/en-us/learn/aspnet/blazor-tutorial/create) and [dotnet new CLI command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-new) topics for more details.

## Step 2: Install Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Diagram and Themes NuGet in the App

Expand Down
4 changes: 2 additions & 2 deletions blazor/diagram/getting-started-with-web-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -681,7 +681,7 @@ A built-in automatic layout algorithm is designed specifically for organizationa

## See also

1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli)
1. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-app)
2. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for client-side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-visual-studio)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli)
3. [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for server-side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-web-app)

4 changes: 1 addition & 3 deletions blazor/gantt-chart/getting-started-with-server-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -118,8 +118,6 @@ cd BlazorApp

This command creates new Blazor Server App and places it in a new directory called `BlazorApp` inside your current location. See [Create Blazor app topic](https://dotnet.microsoft.com/en-us/learn/aspnet/blazor-tutorial/create) and [dotnet new CLI command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-new) topics for more details.

N> If you have installed multiple SDK versions and need any specific framework version (net6.0/net7.0) project, then add `-f` flag along with `dotnet new blazorserver` comment. Refer [here](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-new) for the available options.

## Install Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Gantt and Themes NuGet in the App

Here's an example of how to add **Blazor Gantt Chart** component in the application using the following command in the command prompt (Windows) or terminal (Linux and macOS) to install a [Syncfusion.Blazor.Gantt](https://www.nuget.org/packages/Syncfusion.Blazor.Gantt/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet package. See [Install and manage packages using the dotnet CLI](https://learn.microsoft.com/en-us/nuget/consume-packages/install-use-packages-dotnet-cli) topics for more details.
Expand Down Expand Up @@ -626,4 +624,4 @@ N> [View Sample in GitHub](https://github.com/SyncfusionExamples/Blazor-Getting-

* [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for Client-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-webassembly-dotnet-cli)
* [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for Server-Side in Visual Studio](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-visual-studio)
* [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli)
* [Getting Started with Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor for Server-Side in .NET Core CLI](https://blazor.syncfusion.com/documentation/getting-started/blazor-server-side-dotnet-cli)
16 changes: 7 additions & 9 deletions blazor/getting-started/blazor-webassembly-app.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ documentation: ug

# Getting Started with Blazor WebAssembly Standalone App

This article provides a step-by-step instructions for building Blazor WebAssembly App with `Blazor Calendar` component using [Visual Studio](https://visualstudio.microsoft.com/vs/), Visual Studio Code and .NET CLI.
This article provides a step-by-step instructions for building Blazor WebAssembly App with `Blazor Calendar` component using [Visual Studio](https://visualstudio.microsoft.com/vs/), [Visual Studio Code](https://code.visualstudio.com/) and [.NET CLI](https://learn.microsoft.com/en-us/dotnet/core/tools/).

## Using Playground

Expand Down Expand Up @@ -101,9 +101,9 @@ N> Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components are availa

{% tabcontent .NET CLI %}

## Prerequisites
### Prerequisites

Latest version of the [.NET Core SDK](https://dotnet.microsoft.com/en-us/download). If you previously installed the SDK, you can determine the installed version by executing the following command in a command prompt (Windows) or terminal (macOS) or command shell (Linux).
Install latest version of the [.NET SDK](https://dotnet.microsoft.com/en-us/download). If you previously installed the .NET SDK, you can determine the installed version by executing the following command in a command prompt (Windows) or terminal (macOS) or command shell (Linux).

{% tabs %}
{% highlight c# tabtitle=".NET CLI" %}
Expand All @@ -113,7 +113,7 @@ dotnet --version
{% endhighlight %}
{% endtabs %}

## Create a Blazor WebAssembly App using .NET CLI
### Create a Blazor WebAssembly App using .NET CLI

Run the `dotnet new blazorwasm` command to create a new Blazor WebAssembly App in a command prompt (Windows) or terminal (macOS) or command shell (Linux).

Expand All @@ -128,9 +128,9 @@ cd BlazorApp

This command creates new Blazor WebAssembly App and places it in a new directory called `BlazorApp` inside your current location. See [Create Blazor app topic](https://dotnet.microsoft.com/en-us/learn/aspnet/blazor-tutorial/create) and [dotnet new CLI command](https://learn.microsoft.com/en-us/dotnet/core/tools/dotnet-new) topics for more details.

## Install Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Calendars and Themes NuGet in the App
### Install Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Calendars and Themes NuGet in the App

Here's an example of how to add **Blazor Calendar** component in the application using the following command in the command prompt (Windows) or terminal (Linux and macOS) to install a [Syncfusion.Blazor.Calendars](https://www.nuget.org/packages/Syncfusion.Blazor.Calendars/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet package. See [Install and manage packages using the dotnet CLI](https://learn.microsoft.com/en-us/nuget/consume-packages/install-use-packages-dotnet-cli) topics for more details.
Here's an example of how to add **Blazor Calendar** component in the application using the following command in the command prompt (Windows) or command shell (Linux) or terminal (macOS) to install a [Syncfusion.Blazor.Calendars](https://www.nuget.org/packages/Syncfusion.Blazor.Calendars/) and [Syncfusion.Blazor.Themes](https://www.nuget.org/packages/Syncfusion.Blazor.Themes/) NuGet package. See [Install and manage packages using the dotnet CLI](https://learn.microsoft.com/en-us/nuget/consume-packages/install-use-packages-dotnet-cli) topics for more details.

{% tabs %}
{% highlight c# tabtitle=".NET CLI" %}
Expand Down Expand Up @@ -211,6 +211,4 @@ Add the Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Calendar compone

* Press <kbd>Ctrl</kbd>+<kbd>F5</kbd> (Windows) or <kbd>⌘</kbd>+<kbd>F5</kbd> (macOS) to launch the application. This will render the Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Calendar component in your default web browser.

{% previewsample "https://blazorplayground.syncfusion.com/embed/LDBgirsJBGDheWFi?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}

![Blazor Calendar Component](images/output-calendar-using-blazor-webassembly.png)
{% previewsample "https://blazorplayground.syncfusion.com/embed/LDBgirsJBGDheWFi?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" backgroundimage "[Blazor Calendar Component](images/output-calendar-using-blazor-webassembly.png)" %}
4 changes: 2 additions & 2 deletions blazor/ribbon/keytip.md
Original file line number Diff line number Diff line change
Expand Up @@ -654,7 +654,7 @@ The `HideKeyTipsAsync` method removes all visible keytips from the Ribbon dynami
{% endhighlight %}
{% endtabs %}

![Ribbon show and hide keytips](./images/keytip/show-hide-keytip.png)
![Ribbon Show Hide keytips](./images/keytip/show-hide-keytip.png)

## Guidelines for adding keytips

Expand All @@ -666,4 +666,4 @@ Before adding keytips to Ribbon items, follow these best practices:

* Do not use the same first letter for single- and multi-character keytips on different items.

> When using multi-character keytips (for example, `F`, `FP`, and `FPF`) for different items, pressing `F` activates only the first-level keytip (`F`), and `FP` and `FPF` are ignored.
> When using multi-character keytips (for example, `F`, `FP`, and `FPF`) for different items, pressing `F` activates only the first-level keytip (`F`), and `FP` and `FPF` are ignored.
6 changes: 4 additions & 2 deletions blazor/smart-ai-solutions/ai/azure-openai.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ Install-Package Azure.AI.OpenAI

{% endhighlight %}
{% endtabs %}

- An [Azure OpenAI Service resource and model](https://learn.microsoft.com/en-us/azure/ai-services/openai/how-to/create-resource) is deployed to obtain `apiKey`, `deploymentName`, and `endpoint` values.
- The [Syncfusion Blazor system requirements](https://blazor.syncfusion.com/documentation/system-requirements) are met.
- Credentials are stored securely using Azure Key Vault or environment variables (see [Microsoft’s guide on secure storage](https://learn.microsoft.com/en-us/aspnet/core/security/app-secrets)).
Expand Down Expand Up @@ -76,6 +77,7 @@ Install-Package Azure.AI.OpenAI

{% endhighlight %}
{% endtabs %}

- Ensure the Blazor application meets the [Syncfusion Blazor system requirements](https://blazor.syncfusion.com/documentation/system-requirements).
- Add the following to `App.razor` for Syncfusion themes and scripts:

Expand All @@ -91,7 +93,7 @@ Install-Package Azure.AI.OpenAI
</body>
```

### Register Syncfusion Blazor Service
### Register Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Service

Register the Syncfusion Blazor service in the `~/Program.cs` file based on the interactive render mode.

Expand Down Expand Up @@ -373,4 +375,4 @@ This example illustrates how the Syncfusion Blazor AI library integrates with Az

## See Also
- [Syncfusion Blazor QueryBuilder Documentation](https://blazor.syncfusion.com/documentation/query-builder/getting-started-webapp)
- [Syncfusion Blazor Grid Documentation](https://blazor.syncfusion.com/documentation/datagrid/getting-started-with-web-app)
- [Syncfusion Blazor Grid Documentation](https://blazor.syncfusion.com/documentation/datagrid/getting-started-with-web-app)
4 changes: 3 additions & 1 deletion blazor/smart-ai-solutions/ai/custom-ai-service.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,15 @@ The [Syncfusion Blazor AI](https://www.nuget.org/packages/Syncfusion.Blazor.AI)

To integrate a custom AI service with a Blazor application, ensure the following:
- The following NuGet package is installed:

{% tabs %}
{% highlight C# tabtitle="Package Manager" %}

Install-Package Syncfusion.Blazor.AI -Version {{ site.releaseversion }}

{% endhighlight %}
{% endtabs %}

- An API key is obtained from the chosen AI provider (e.g., DeepSeek via the [DeepSeek API documentation](https://platform.deepseek.com)).
- The [Syncfusion Blazor system requirements](https://blazor.syncfusion.com/documentation/system-requirements) are met.
- Familiarity with HTTP client usage and JSON serialization in .NET applications.
Expand Down Expand Up @@ -105,4 +107,4 @@ This example illustrates how the Syncfusion Blazor AI library integrates with a
## Error Handling
- **Invalid API Key**: Ensure the API key is valid and stored securely in environment variables or a configuration service.
- **Rate Limits**: Check the custom AI provider’s documentation (e.g., [DeepSeek API docs](https://platform.deepseek.com)) for rate limit details.
- **Network or Parsing Errors**: Handle HTTP or JSON errors gracefully, as shown in the `DeepSeekAIService` implementation.
- **Network or Parsing Errors**: Handle HTTP or JSON errors gracefully, as shown in the `DeepSeekAIService` implementation.
Loading