Skip to content

Commit 7aaca89

Browse files
committed
Merge branch 'development' of https://github.com/syncfusion-content/blazor-docs into 984330-AI-Prompt
2 parents a886951 + e7e6d06 commit 7aaca89

35 files changed

+1885
-1035
lines changed

blazor-toc.html

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -148,11 +148,10 @@
148148
</li>
149149
</ul>
150150
</li>
151-
<li>AI Coding Assistants
151+
<li>AI Coding Assistant
152152
<ul>
153153
<li><a href="/blazor/ai-coding-assistants/overview">Overview</a></li>
154154
<li><a href="/blazor/ai-coding-assistants/mcp-server">MCP Server</a></li>
155-
<li><a href="/blazor/ai-coding-assistants/copilot-extension">Copilot Extension</a></li>
156155
</ul>
157156
</li>
158157
<li>Smart (AI) Solutions
@@ -1524,6 +1523,7 @@
15241523
<li><a href="/blazor/chat-ui/header">Header</a></li>
15251524
<li><a href="/blazor/chat-ui/footer">Footer</a></li>
15261525
<li><a href="/blazor/chat-ui/templates">Templates</a></li>
1526+
<li><a href="/blazor/chat-ui/speech-to-text">Speech to Text</a></li>
15271527
<li><a href="/blazor/chat-ui/appearance">Appearance</a></li>
15281528
<li><a href="/blazor/chat-ui/globalization">Globalization</a></li>
15291529
<li><a href="/blazor/chat-ui/accessibility">Accessibility</a></li>
@@ -2983,8 +2983,8 @@
29832983
<li> <a href="/blazor/file-upload/file-source">File Source</a></li>
29842984
<li> <a href="/blazor/file-upload/template">Template</a></li>
29852985
<li> <a href="/blazor/file-upload/validation">Validation</a></li>
2986-
<li> <a href="/blazor/file-upload/style-appearance">Style and Appearance</a></li>
29872986
<li> <a href="/blazor/file-upload/form-integration">Form Integration</a></li>
2987+
<li> <a href="/blazor/file-upload/style-appearance">File Upload Customization</a></li>
29882988
<li> <a href="/blazor/file-upload/http-client">Http Client</a></li>
29892989
<li>How To
29902990
<ul>
@@ -3058,7 +3058,6 @@
30583058
<li><a href="/blazor/gantt-chart/column-template">Column Template</a></li>
30593059
<li><a href="/blazor/gantt-chart/column-menu">Column Menu</a></li>
30603060
<li><a href="/blazor/gantt-chart/column-chooser">Column Chooser</a></li>
3061-
<li><a href="/blazor/gantt-chart/responsive-columns">Responsive Column</a></li>
30623061
<li><a href="/blazor/gantt-chart/wbs-column">WBS Column</a></li>
30633062
</ul>
30643063
</li>
@@ -5006,4 +5005,4 @@
50065005
</li>
50075006
</ul>
50085007
</li>
5009-
</ul>
5008+
</ul>

blazor/ai-assistview/ai-integrations/gemini-integration.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ Nuget\Install-Package Markdig
6161

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

64-
* update your Gemini API key securely in the configuration:
64+
* Update your Gemini API key securely in the configuration:
6565

6666
```bash
6767

blazor/ai-assistview/speech/speech-to-text.md

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,18 @@ Before integrating `Speech-to-Text`, ensure the following:
2323

2424
## Configure Speech-to-Text
2525

26-
To enable Speech-to-Text functionality, modify the `Home.razor` file to incorporate the Web Speech API. The [SpeechToText](https://blazor.syncfusion.com/documentation/speech-to-text/getting-started-web-app) component listens for microphone input, transcribes spoken words, and updates the AI AssistView's editable footer with the transcribed text. The transcribed text is then sent as a prompt to the Azure OpenAI service via the AI AssistView component.
26+
To enable Speech-to-Text functionality in the Blazor AI AssistView component, update the `Home.razor` file to incorporate the Web Speech API.
27+
28+
The [SpeechToText](https://blazor.syncfusion.com/documentation/speech-to-text/getting-started-web-app) component listens to audio input from the device’s microphone, transcribes spoken words into text, and updates the AI AssistView’s editable footer using the [FooterTemplate](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.InteractiveChat.AssistView.html#Syncfusion_Blazor_InteractiveChat_AssistView_FooterTemplate) tag directive to display the transcribed text. The transcribed text is then sent as a prompt to the Azure OpenAI service via the AI AssistView component.
29+
30+
### Configuration Options
31+
32+
* **[`Language`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Inputs.SfSpeechToText.html#Syncfusion_Blazor_Inputs_SfSpeechToText_Language)**: Specifies the language for speech recognition. For example:
33+
34+
* `en-US` for American English
35+
* `fr-FR` for French
36+
37+
* **[`AllowInterimResults`](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Inputs.SfSpeechToText.html#Syncfusion_Blazor_Inputs_SfSpeechToText_AllowInterimResults)**: Set to `true` to receive real-time (interim) recognition results, or `false` to receive only final results.
2738

2839
The `speechtotext.js` file handles operations related to the content of the editable footer, such as checking for meaningful input, clearing existing text, and updating the content with the transcribed value. Meanwhile, the `speechtotext.css` file styles the AI AssistView layout and ensures the component remains responsive across different screen sizes and devices.
2940

@@ -268,6 +279,14 @@ function updateContentEditableDiv(element, value) {
268279

269280
![Integrating Speech-to-Text with AI AssistView](../images/assist-stt.png)
270281

282+
## Error Handling
283+
284+
The `SpeechToText` component provides events to handle errors that may occur during speech recognition. For more information, refer to the [Error Handling](https://blazor.syncfusion.com/documentation/speech-to-text/speech-recognition#error-handling) section in the documentation.
285+
286+
## Browser Compatibility
287+
288+
The `SpeechToText` component relies on the [Speech Recognition API](https://developer.mozilla.org/en-US/docs/Web/API/SpeechRecognition), which has limited browser support. Refer to the [Browser Compatibility](https://blazor.syncfusion.com/documentation/speech-to-text/speech-recognition#browser-support) section for detailed information.
289+
271290
## See Also
272291

273292
* [Text-to-Speech](./text-to-speech.md)
Lines changed: 99 additions & 99 deletions
Original file line numberDiff line numberDiff line change
@@ -1,99 +1,99 @@
1-
---
2-
layout: post
3-
title: SyncfusionBlazor GitHub Copilot Extension | Syncfusion
4-
description: Learn how the SyncfusionBlazor GitHub Copilot extension enhances your Blazor development with intelligent code suggestions, best practices, contextual guidance.
5-
control: Getting started with SyncfusionBlazor copilot extension
6-
platform: Blazor
7-
documentation: ug
8-
---
9-
10-
# SyncfusionBlazor GitHub Copilot Extension
11-
12-
## Overview
13-
14-
The [SyncfusionBlazor GitHub Copilot Extension](https://github.com/apps/syncfusionblazor) provides intelligent assistance for developers using Syncfusion's Blazor component libraries. This extension seamlessly integrates with GitHub Copilot to enhance your development workflow.
15-
16-
### What is a GitHub Copilot Extension?
17-
18-
A GitHub Copilot extension enhances Copilot's capabilities by integrating specialized, third-party tools and knowledge directly into the chat interface. It allows Copilot to access specific data, APIs, and services—such as a component vendor's official documentation—to provide more accurate, context-aware, and relevant assistance for a developer's specific technology stack.
19-
20-
### Key Benefits
21-
22-
* Smart code suggestions for Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components.
23-
* Best practice guidance for component usage and configuration.
24-
* Context-aware troubleshooting for complex scenarios.
25-
26-
## Prerequisites
27-
28-
Before using this extension, ensure you have:
29-
30-
* [Github copilot](https://github.com/copilot/)
31-
* An active Syncfusion<sup style="font-size:70%">&reg;</sup> license (any of the following):
32-
- [Commercial License](https://www.syncfusion.com/sales/unlimitedlicense)
33-
- [Free Community License](https://www.syncfusion.com/products/communitylicense)
34-
- [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials)
35-
* An active [API KEY](https://syncfusion.com/account/api-key)
36-
37-
## Unlimited Access
38-
39-
Syncfusion<sup style="font-size:70%">&reg;</sup> offers unlimited access to this copilot extension. There are no restrictions on:
40-
41-
* Number of requests
42-
* Components usage
43-
* Query types
44-
* Usage duration
45-
46-
This ensures users can fully leverage Syncfusion<sup style="font-size:70%">&reg;</sup> components to enhance their development experience without limitations.
47-
48-
## Installation
49-
50-
* Visit the [SyncfusionBlazor GitHub App](https://github.com/apps/syncfusionblazor) and click **Install**.
51-
* Grant the required read-access permissions to allow the extension to function with Copilot chat.
52-
* Click **Install & Authorize**.
53-
* Sign in with your Syncfusion<sup style="font-size:70%">&reg;</sup> account to authenticate and link the extension to your GitHub account. The API key is automatically retrieved upon successful authentication.
54-
* Restart your development environment (e.g., VS Code or GitHub Copilot) and start a new Copilot chat session to use the extension.
55-
56-
## Getting Started
57-
58-
* Open the chat panel in a supported environment like [GitHub Copilot](https://github.com/copilot) or VSCode Copilot.
59-
* Type `@` in the chat prompt and select the `SyncfusionBlazor` from the list of extensions.
60-
* Enter a query related to Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components (e.g., configuration, implementation, or troubleshooting).
61-
62-
### Mode availability in VS code
63-
64-
Syncfusion<sup style="font-size:70%">&reg;</sup> Copilot extension provide full access to all AI interaction modes — Ask, Edit, and Agent — when integrated with VS code.
65-
66-
### Best Practices for Effective Usage
67-
68-
1. `Be specific`: Mention both platform and component (e.g., "How do I create a Syncfusion Blazor Grid with paging and filtering?").
69-
2. `Provide context`: Include details about your use case for more targeted solutions.
70-
3. `Use descriptive queries`: Avoid vague questions that lack necessary context.
71-
4. `Start fresh for new topics`: Begin a new chat session when switching components or topics.
72-
73-
## Example Queries
74-
75-
Here are some examples of queries you can use with the Syncfusion<sup style="font-size:70%">&reg;</sup> Copilot extensions:
76-
77-
* "@SyncfusionBlazor Create a Syncfusion data grid with paging and sorting"
78-
* "@SyncfusionBlazor How do I implement a responsive Syncfusion chart with tooltips?"
79-
* "@SyncfusionBlazor Show me a Syncfusion Kanban board implementation with drag and drop"
80-
81-
## Uninstallation
82-
83-
To remove the extension from your account:
84-
85-
* Go to [GitHub App Installations](https://github.com/settings/installations/).
86-
* Locate the `SyncfusionBlazor` extension in the list.
87-
* Click `Configure`, then select `Uninstall`.
88-
89-
## Support
90-
91-
* [Support tickets](https://support.syncfusion.com/support/tickets/create) - Guaranteed Response in 24 hours \| Unlimited tickets \| Holiday support
92-
* [Community forum](https://www.syncfusion.com/forums/blazor-components)
93-
* [Request feature or report bug](https://www.syncfusion.com/feedback/blazor-components)
94-
* Live chat
95-
96-
## See also
97-
98-
* [Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Documentation](https://blazor.syncfusion.com/documentation)
99-
* [Github Copilot Documentation](https://docs.github.com/en/copilot)
1+
---
2+
layout: post
3+
title: SyncfusionBlazor GitHub Copilot Extension | Syncfusion
4+
description: Learn how the SyncfusionBlazor GitHub Copilot extension enhances your Blazor development with intelligent code suggestions, best practices, contextual guidance.
5+
control: Getting started with SyncfusionBlazor copilot extension
6+
platform: Blazor
7+
documentation: ug
8+
---
9+
10+
# SyncfusionBlazor GitHub Copilot Extension
11+
12+
## Overview
13+
14+
The [SyncfusionBlazor GitHub Copilot Extension](https://github.com/apps/syncfusionblazor) provides intelligent assistance for developers using Syncfusion's Blazor component libraries. This extension seamlessly integrates with GitHub Copilot to enhance your development workflow.
15+
16+
### What is a GitHub Copilot Extension?
17+
18+
A GitHub Copilot extension enhances Copilot's capabilities by integrating specialized, third-party tools and knowledge directly into the chat interface. It allows Copilot to access specific data, APIs, and services—such as a component vendor's official documentation—to provide more accurate, context-aware, and relevant assistance for a developer's specific technology stack.
19+
20+
### Key Benefits
21+
22+
* Smart code suggestions for Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components.
23+
* Best practice guidance for component usage and configuration.
24+
* Context-aware troubleshooting for complex scenarios.
25+
26+
## Prerequisites
27+
28+
Before using this extension, ensure you have:
29+
30+
* [Github copilot](https://github.com/copilot/)
31+
* An active Syncfusion<sup style="font-size:70%">&reg;</sup> license (any of the following):
32+
- [Commercial License](https://www.syncfusion.com/sales/unlimitedlicense)
33+
- [Free Community License](https://www.syncfusion.com/products/communitylicense)
34+
- [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials)
35+
* An active [API KEY](https://syncfusion.com/account/api-key)
36+
37+
## Unlimited Access
38+
39+
Syncfusion<sup style="font-size:70%">&reg;</sup> offers unlimited access to this copilot extension. There are no restrictions on:
40+
41+
* Number of requests
42+
* Components usage
43+
* Query types
44+
* Usage duration
45+
46+
This ensures users can fully leverage Syncfusion<sup style="font-size:70%">&reg;</sup> components to enhance their development experience without limitations.
47+
48+
## Installation
49+
50+
* Visit the [SyncfusionBlazor GitHub App](https://github.com/apps/syncfusionblazor) and click **Install**.
51+
* Grant the required read-access permissions to allow the extension to function with Copilot chat.
52+
* Click **Install & Authorize**.
53+
* Sign in with your Syncfusion<sup style="font-size:70%">&reg;</sup> account to authenticate and link the extension to your GitHub account. The API key is automatically retrieved upon successful authentication.
54+
* Restart your development environment (e.g., VS Code or GitHub Copilot) and start a new Copilot chat session to use the extension.
55+
56+
## Getting Started
57+
58+
* Open the chat panel in a supported environment like [GitHub Copilot](https://github.com/copilot) or VSCode Copilot.
59+
* Type `@` in the chat prompt and select the `SyncfusionBlazor` from the list of extensions.
60+
* Enter a query related to Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor components (e.g., configuration, implementation, or troubleshooting).
61+
62+
### Mode availability in VS code
63+
64+
Syncfusion<sup style="font-size:70%">&reg;</sup> Copilot extension provide full access to all AI interaction modes — Ask, Edit, and Agent — when integrated with VS code.
65+
66+
### Best Practices for Effective Usage
67+
68+
1. `Be specific`: Mention both platform and component (e.g., "How do I create a Syncfusion Blazor Grid with paging and filtering?").
69+
2. `Provide context`: Include details about your use case for more targeted solutions.
70+
3. `Use descriptive queries`: Avoid vague questions that lack necessary context.
71+
4. `Start fresh for new topics`: Begin a new chat session when switching components or topics.
72+
73+
## Example Queries
74+
75+
Here are some examples of queries you can use with the Syncfusion<sup style="font-size:70%">&reg;</sup> Copilot extensions:
76+
77+
* "@SyncfusionBlazor Create a Syncfusion data grid with paging and sorting"
78+
* "@SyncfusionBlazor How do I implement a responsive Syncfusion chart with tooltips?"
79+
* "@SyncfusionBlazor Show me a Syncfusion Kanban board implementation with drag and drop"
80+
81+
## Uninstallation
82+
83+
To remove the extension from your account:
84+
85+
* Go to [GitHub App Installations](https://github.com/settings/installations/).
86+
* Locate the `SyncfusionBlazor` extension in the list.
87+
* Click `Configure`, then select `Uninstall`.
88+
89+
## Support
90+
91+
* [Support tickets](https://support.syncfusion.com/support/tickets/create) - Guaranteed Response in 24 hours \| Unlimited tickets \| Holiday support
92+
* [Community forum](https://www.syncfusion.com/forums/blazor-components)
93+
* [Request feature or report bug](https://www.syncfusion.com/feedback/blazor-components)
94+
* Live chat
95+
96+
## See also
97+
98+
* [Syncfusion<sup style="font-size:70%">&reg;</sup> Blazor Documentation](https://blazor.syncfusion.com/documentation)
99+
* [Github Copilot Documentation](https://docs.github.com/en/copilot)

0 commit comments

Comments
 (0)