Skip to content
2 changes: 1 addition & 1 deletion Document-Processing-toc.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
<li>
<a href="/document-processing/System-Requirements">System Requirements</a>
</li>
<li>AI Tools
<li><a href="/document-processing/ai-tools/ai-powered-development">AI Tools</a>
<ul>
<li>Skills
<ul>
Expand Down
64 changes: 64 additions & 0 deletions Document-Processing/ai-tools/ai-powered-development.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
---
layout: post
title: AI Powered Development | AI Tools | Syncfusion
description: Syncfusion Document SDK AI Tools simplify document processing, editing, and integration, helping you to build smarter applications easily.
platform: document-processing
control: AI Tools
documentation: ug
---

# AI-Powered Development with Syncfusion Document Processing Components

Syncfusion AI Tools accelerate development by generating accurate code, providing contextual guidance, automating document workflows, and creating production-ready UIs from natural-language prompts. By reducing research, coding, debugging, and manual effort, developers can build and deliver document-centric applications faster with greater efficiency.

## AI-Driven Solutions

The following AI tools are available to help you process documents efficiently.

- [Agent Skills](#agent-skills)
- [Agentic UI Builder](#agentic-ui-builder)
- [AI Agent Tools](#ai-agent-tools)
- [MCP Server](#mcp-server)

### Agent Skills

Enhance your AI assistant (GitHub Copilot, Cursor, Claude, and more) with real Syncfusion API knowledge-eliminating hallucinated methods. Install once using npx skills add syncfusion/document-sdk-skills and generate accurate, production-ready document code directly within your IDE.

Learn more about:

- [Document SDK Skills](https://help.syncfusion.com/document-processing/skills/document-sdk)
- [PDF Viewer SDK Skills](https://help.syncfusion.com/document-processing/skills/pdf-viewer-sdk/component-skills)
- [DOCX Editor SDK Skills](https://help.syncfusion.com/document-processing/skills/docx-editor-sdk/component-skills)
- [Spreadsheet Editor SDK Skills](https://help.syncfusion.com/document-processing/skills/spreadsheet-editor-sdk/component-skills)

### Agentic UI Builder

Transforms natural-language prompts into production-ready UIs using real Syncfusion<sup>&reg;</sup> components. Generates structured, responsive layouts with maintainable architecture. Integrates with AI-powered IDEs to produce accurate code following best practices, accessibility guidelines, and enterprise UI standards-helping developers move quickly from idea to fully functional interfaces within their workflow.

Learn more about:

- [PDF Viewer UI Builder](https://help.syncfusion.com/document-processing/skills/pdf-viewer-sdk/ui-builder-skills)
- [DOCX Editor UI Builder](https://help.syncfusion.com/document-processing/skills/docx-editor-sdk/ui-builder-skills)
- [Spreadsheet UI Builder](https://help.syncfusion.com/document-processing/skills/spreadsheet-editor-sdk/ui-builder-skills)

### AI Agent Tools

Enable AI agents to autonomously handle document tasks at runtime-such as creating reports, converting files, and extracting form data-without requiring you to write complex processing logic. Simply add the [Syncfusion.DocumentSDK.AI.AgentTools](https://www.nuget.org/packages/Syncfusion.DocumentSDK.AI.AgentTools) NuGet package and let your agent manage document workflows seamlessly.

[Learn more](https://help.syncfusion.com/document-processing/ai-agent-tools/overview).

### MCP Server

Integrates with Visual Studio, VS Code, and JetBrains Rider and more to accelerate development. Ask how to implement any feature and instantly receive documentation-backed, copy‑paste‑ready C# code tailored to Syncfusion APIs.

[Learn more](https://help.syncfusion.com/document-processing/mcp-server/ai-coding-assistant/overview).

## When to Use


| AI Tool | When to Choose / Best Scenario |
|--------|---------------------------------|
| Agent Skills | When you want accurate, IDE‑level code generation using Syncfusion APIs with minimal setup. |
| Agentic UI Builder | When you want to quickly generate production-ready UIs for document workflows from prompts. |
| AI Agent Tools | When building applications where AI agents must automate document workflows at runtime. |
| MCP Server | When you need instant, documentation-backed code guidance directly within your development environment. |
40 changes: 23 additions & 17 deletions Document-Processing/introduction.md
Original file line number Diff line number Diff line change
Expand Up @@ -77,39 +77,45 @@ The <a href="https://help.syncfusion.com/document-processing/excel/spreadsheet/o
</tr>

<tr>
<td>AI Agent Tools</td>
<td>Agent Skills</td>
<td>
Enables AI agents to autonomously execute document tasks at runtime - generate reports, convert files, and extract form data - without requiring manual processing logic. Integrate the <a href="https://www.nuget.org/packages/Syncfusion.DocumentSDK.AI.AgentTools">Syncfusion.DocumentSDK.AIAgentTools</a> NuGet package to extend your agent’s document processing capabilities.
<br><br>Learn more about <a href="https://help.syncfusion.com/document-processing/ai-agent-tools/overview">AI Agent Tools</a>.
Ground your AI coding assistant (GitHub Copilot, Cursor, Claude, and others) in verified Syncfusion APIs - eliminating hallucinated methods. Install one with pre-built document and code skills and generate production-ready document code without leaving your IDE. It also allows executing document operations directly via CSX scripts.
<br><br>Learn more about:<br><br>
<ul>
<li><a href="https://help.syncfusion.com/document-processing/skills/document-sdk">Document SDK Skills</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/pdf-viewer-sdk/component-skills">PDF Viewer SDK Skills</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/docx-editor-sdk/component-skills">DOCX Editor SDK Skills</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/spreadsheet-editor-sdk/component-skills">Spreadsheet Editor SDK Skills</a></li>
</ul>
</td>
</tr>

<tr>
<td>AI Coding Assistant</td>
<td>Agentic UI Builder </td>
<td>
Integrates with Visual Studio, VS Code, and JetBrains Rider through MCP Server. Describe your document processing requirement and receive documentation-backed, production-ready C# code instantly.
<br><br>Learn more about <a href="https://help.syncfusion.com/document-processing/mcp-server/ai-coding-assistant/overview">AI Coding Assistant</a>.
Transforms natural-language prompts into production-ready UIs using real Syncfusion<sup>&reg;</sup> components. Generates structured, responsive layouts with maintainable architecture by default. Integrates with AI-powered IDEs to produce accurate code while following best practices, accessibility guidelines, and enterprise UI standards. Helps developers quickly move from idea to fully functional interfaces within their workflow.
<br><br>Learn more about:<br><br>
<ul>
<li><a href="https://help.syncfusion.com/document-processing/skills/pdf-viewer-sdk/ui-builder-skills">PDF Viewer UI Builder</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/docx-editor-sdk/ui-builder-skills">DOCX Editor UI Builder</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/spreadsheet-editor-sdk/ui-builder-skills">Spreadsheet UI Builder</a></li>
</ul>
</td>
</tr>

<tr>
<td>Agent Skills</td>
<td>AI Agent Tools</td>
<td>
Ground your AI coding assistant (GitHub Copilot, Cursor, Claude, and others) in verified Syncfusion APIs - eliminating hallucinated methods. Install one with pre-built document and code skills and generate production-ready document code without leaving your IDE. It also allows executing document operations directly via CSX scripts.
<br><br>Learn more about <a href="https://help.syncfusion.com/document-processing/skills/document-sdk">Agent Skills</a>.
Enables AI agents to autonomously execute document tasks at runtime - generate reports, convert files, and extract form data - without requiring manual processing logic. Integrate the <a href="https://www.nuget.org/packages/Syncfusion.DocumentSDK.AI.AgentTools">Syncfusion.DocumentSDK.AIAgentTools</a> NuGet package to extend your agent’s document processing capabilities.
<br><br>Learn more about <a href="https://help.syncfusion.com/document-processing/ai-agent-tools/overview">AI Agent Tools</a>.
</td>
</tr>

<tr>
<td>Agentic UI Builder </td>
<td>MCP Server</td>
<td>
Transforms natural-language prompts into production-ready UIs using real Syncfusion<sup>&reg;</sup> components. Generates structured, responsive layouts with maintainable architecture by default. Integrates with AI-powered IDEs to produce accurate code while following best practices, accessibility guidelines, and enterprise UI standards. Helps developers quickly move from idea to fully functional interfaces within their workflow.
<br><br>Learn more about:
<ul>
<li><a href="https://help.syncfusion.com/document-processing/skills/pdf-viewer-sdk/ui-builder-skills">PDF Viewer UI Builder</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/docx-editor-sdk/ui-builder-skills">DOCX Editor UI Builder</a></li>
<li><a href="https://help.syncfusion.com/document-processing/skills/spreadsheet-editor-sdk/ui-builder-skills">Spreadsheet UI Builder</a></li>
</ul>
Integrates with Visual Studio, VS Code, and JetBrains Rider through MCP Server. Describe your document processing requirement and receive documentation-backed, production-ready C# code instantly.
<br><br>Learn more about <a href="https://help.syncfusion.com/document-processing/mcp-server/overview">MCP Server</a>.
</td>
</tr>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -43,19 +43,7 @@ Syncfusion<sup>&reg;</sup> offers unlimited access to this MCP server. There are

This ensures users can fully leverage Syncfusion<sup>&reg;</sup> components to enhance their development experience without limitations.

## Installation and setup

Before you can invoke the ```SyncfusionDocumentSDKAssistant``` MCP server, you need to configure your MCP client with these core settings. The **Generic MCP Server Settings** shown below are identical across all clients:

### Generic MCP Server Settings

* **npm package name**: ```@syncfusion/documentsdk-assistant```
* **Type**: stdio (standard input/output transport)
* **Command**: npx
* **Arguments**: -y
* **Server name**: syncfusionDocumentSDKAssistant

#### API Key Configuration
## API Key Configuration

Login to your [Syncfusion account](http://syncfusion.com/account/) and generate an API Key from the [API Key page](https://www.syncfusion.com/account/api-key). Replace `YOUR_API_KEY_FILE_PATH` or `YOUR_API_KEY` in the configuration files with your generated key.

Expand Down Expand Up @@ -84,21 +72,18 @@ There are two options:

<a href="https://www.npmjs.com/package/@syncfusion/documentsdk-assistant">SyncfusionDocumentSDKAssistant</a> can be configured in various MCP clients. Below are setup instructions for popular environments:

### Syncfusion<sup>&reg;</sup> Code Studio
## Setting up in MCP Clients

* In [Code Studio](https://www.syncfusion.com/code-studio/), open MCP Marketplace and navigate to the ```Custom Servers``` tab.
* Enter the Server Name as ```documentsdk-mcp```, choose Server Type as npm package, and set the NPM Package name to ```@syncfusion/documentsdk-assistant```.
* Add an environment variable as ```Syncfusion_API_Key``` and value as your [Syncfusion API key](https://syncfusion.com/account/api-key), then click **Install Server**.
* Once installed, the server will appear in the User Installed Server list and will be added to the **config.yaml** file.
* The server is now ready for use in Code Studio. For more details, refer to the Code Studio [documentation](https://help.syncfusion.com/code-studio/reference/configure-properties/mcp/customservers).
Create a configuration file in your project folder to install the server for your workspace as shown below:

For additional details, see the Code Studio [documentation](https://help.syncfusion.com/code-studio/reference/configure-properties/mcp/customservers).
**Important:** Replace `YOUR_API_KEY_FILE_PATH` with the path to your API key file.

### VS Code (GitHub Copilot MCP)
* To configure an MCP server for a specific workspace, you can create a ```.vscode/mcp.json``` file in your workspace folder.
{% tabs %}

~~~json
{
{% highlight json tabtitle="VS Code" %}
// Create a `.vscode/mcp.json` file in your workspace with the MCP server configuration:

{
"servers": {
"syncfusion-documentsdk-assistant": {
"type": "stdio",
Expand All @@ -115,21 +100,34 @@ For additional details, see the Code Studio [documentation](https://help.syncfus
}
}
}
~~~

* After updating the configuration in mcp.json, you’ll notice a “Start” option at the top of the config. This allows you to easily start the <a href ="https://www.npmjs.com/package/@syncfusion/documentsdk-assistant">SyncfusionDocumentSDKAssistant</a> server directly from the settings interface without additional commands.
{% endhighlight %}

* Confirm that <a href ="https://www.npmjs.com/package/@syncfusion/documentsdk-assistant">SyncfusionDocumentSDKAssistant</a> is being used (this does not happen automatically). Look for a statement in the output, which is similar to:
{% highlight json tabtitle="Syncfusion Code Studio" %}
// Create a `.codestudio/mcp.json` file in your workspace with the MCP server configuration:

* ```SyncfusionDocumentSDKAssistant is running...``` (in VS Code)
* For more details, refer to the official <a href = "https://learn.microsoft.com/en-us/visualstudio/ide/mcp-servers?view=vs-2022"> Visual Studio documentation</a>.

### Cursor
{
"servers": {
"syncfusion-documentsdk-assistant": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@syncfusion/documentsdk-assistant@latest"
],
"env": {
"Syncfusion_API_Key_Path": "YOUR_API_KEY_FILE_PATH",
// or
"Syncfusion_API_Key": "YOUR_API_KEY"
}
}
}
}
{% endhighlight %}

To configure an MCP server for a specific workspace, you can create a .cursor/mcp.json file in your workspace folder.
{% highlight json tabtitle="Cursor" %}
// Create a `.cursor/mcp.json` file in your workspace with the MCP server configuration:

~~~json
{
{
"mcpServers": {
"syncfusion-documentsdk-assistant": {
"type": "stdio",
Expand All @@ -146,17 +144,14 @@ To configure an MCP server for a specific workspace, you can create a .cursor/mc
}
}
}
~~~
For more details, refer to the <a href = "https://docs.cursor.com/en/context/mcp#using-mcp-json">Cursor documentation</a>.

### JetBrains IDEs
{% endhighlight %}

* Go to Settings -> Tools -> AI Assistant -> Model Context Protocol (MCP).
* Click + Add to add a new MCP server configuration.
* In the New MCP Server dialog, switch the dropdown as ```As JSON``` and add the following config:
{% highlight json tabtitle="JetBrains IDEs" %}
// Go to Settings -> Tools -> AI Assistant -> Model Context Protocol (MCP).
// Click + Add to add a new MCP server configuration.
// In the New MCP Server dialog, switch the dropdown as `As JSON` and add the following config:

~~~json
{
{
"mcpServers": {
"syncfusion-documentsdk-assistant": {
"command": "npx",
Expand All @@ -172,13 +167,11 @@ For more details, refer to the <a href = "https://docs.cursor.com/en/context/mcp
}
}
}
~~~

* Click OK and Apply.
{% endhighlight %}

For further assistance, see the <a href ="https://www.jetbrains.com/help/ai-assistant/mcp.html#connect-to-an-mcp-server">JetBrains documentation</a>.
{% endtabs %}

> For more detailed information about configuring MCP servers in various clients, refer to the official documentations, e.g., [Windsurf](https://docs.windsurf.com/windsurf/cascade/mcp#mcp-config-json)
**Verify Installation:** Check your editor's MCP Server list for `syncfusion-documentsdk-assistant` with "Connected" status to confirm successful installation.

## Usage

Expand All @@ -198,7 +191,7 @@ To activate the SyncfusionDocumentSDKAssistant MCP server:

### Mode availability

Syncfusion® MCP Servers provide full access to all AI interaction modes Ask/Chat, Edit, and Agent across supported MCP clients.
Syncfusion® MCP Servers provide full access to all AI interaction modes - Ask/Chat, Edit, and Agent - across supported MCP clients.

### Best Practices for Effective Usage

Expand All @@ -219,12 +212,16 @@ Here are some effective ways to use <a href ="https://www.npmjs.com/package/@syn

## Troubleshooting

If you encounter issues:
If you encounter issues during installation or while using the MCP server, refer to the solutions below:

* Verify your API key is correctly configured.
* Ensure the MCP server is enabled in your client’s tools selection.
* Check that you’re using a compatible MCP client version.
* Try restarting your development environment.
| Issue | Solution |
|-------|----------|
| Clear npm cache | Run `npx clear-npx-cache` and restart your IDE to resolve package caching issues |
| Server failed to start | Update to Node.js 18+, verify JSON syntax in config file, and restart your IDE |
| Invalid API key | Verify your key is active at [Syncfusion Account Page](https://syncfusion.com/account/api-key) |
| Incorrect API key config | For the file path: Verify file location and content. For inline key: Check key is properly updated |
| Wrong config file location | VS Code: `.vscode/mcp.json` <br/> Code Studio: `.codestudio/mcp.json` <br/> Cursor: `.cursor/mcp.json` <br/> JetBrains: Settings → Tools → AI Assistant → MCP in the workspace root |
| Check IDE logs | VS Code/Code Studio: Output panel → "MCP" • Cursor: Developer Console for MCP errors • JetBrains: IDE logs |

## Support

Expand Down