diff --git a/Document-Processing-toc.html b/Document-Processing-toc.html index aed75b7d46..b68e7b1a05 100644 --- a/Document-Processing-toc.html +++ b/Document-Processing-toc.html @@ -42,7 +42,7 @@ Component Skills
  • - UI Builder Skills + Agentic UI Builder
    • diff --git a/Document-Processing/Excel/Spreadsheet/Angular/ui-builder-skill.md b/Document-Processing/Excel/Spreadsheet/Angular/ui-builder-skill.md index 9f206a4825..7a22ffba68 100644 --- a/Document-Processing/Excel/Spreadsheet/Angular/ui-builder-skill.md +++ b/Document-Processing/Excel/Spreadsheet/Angular/ui-builder-skill.md @@ -23,7 +23,7 @@ Before installing Angular UI Builder Skill with Spreadsheet, ensure the followin - Required [Node.js](https://nodejs.org/en) version ≥ 18 - Angular application (existing or new); see [Quick Start](https://ej2.syncfusion.com/angular/documentation/getting-started/angular-cli) - A supported AI agent or IDE that integrates with the Skills (VS Code, Cursor, Syncfusion® Code Studio, etc.) -- Active Syncfusion® license(any of the following): +- Active Syncfusion® license (any of the following): - [Commercial](https://www.syncfusion.com/sales/unlimitedlicense) - [Community License](https://www.syncfusion.com/products/communitylicense) - [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials) @@ -145,7 +145,7 @@ To start using the skill: > For Syncfusion® Code Studio, if the UI Builder agent is not shown, ensure that the agent location is configured to use it in the chat, and refer to the [documentation](https://help.syncfusion.com/code-studio/reference/configure-properties/usersettings#agent-file-locations) to configure the agent location properly. -**Examples Prompts:** +**Example Prompts:** {% promptcards %} {% promptcard Project Task Planner %} @@ -160,7 +160,7 @@ Generated code follows best practices with accessible, semantic HTML, responsive ## Best Practices -Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready result: +Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready results: - **Stay consistent:** Maintain consistent file organization, naming conventions, and coding standards throughout your project. - **Use advanced AI models:** For best results, use **Claude Sonnet 4.6 or higher** capability models to produce better code quality and more accurate implementations. diff --git a/Document-Processing/Excel/Spreadsheet/Blazor/ui-builder-skill.md b/Document-Processing/Excel/Spreadsheet/Blazor/ui-builder-skill.md index 26890b7f4a..ead3c5b0f1 100644 --- a/Document-Processing/Excel/Spreadsheet/Blazor/ui-builder-skill.md +++ b/Document-Processing/Excel/Spreadsheet/Blazor/ui-builder-skill.md @@ -1,14 +1,14 @@ --- layout: post title: Blazor UI Builder Skill with Spreadsheet | Syncfusion® -description: Install Blazor UI Builder to generate production-ready Blazor components with Spreadsheet from natural-language prompts. -control: SfSpreadsheet +description: Install Syncfusion® Blazor UI Builder to generate production-ready Blazor components with Spreadsheet from natural-language prompts. +control: Spreadsheet platform: document-processing documentation: ug keywords: Blazor UI Builder, Skills, AI Assistants, Spreadsheet SDK, Agent Skills --- -# Syncfusion® Blazor UI Builder Skill with Spreadsheet for AI Assistants +# Syncfusion® Blazor UI Builder Skill with Spreadsheet **Syncfusion® Blazor UI Builder Skill** is an AI-powered skill and companion agent that accelerates Blazor Spreadsheet application development by transforming natural-language UI requirements into production-ready components using Syncfusion® Blazor UI libraries. @@ -24,7 +24,7 @@ Before installing Blazor UI Builder Skill with Spreadsheet, ensure the following - Required [Node.js](https://nodejs.org/en) version ≥ 18 - **Agent Package Manager** (APM) installed — follow [Installation Guidelines](https://microsoft.github.io/apm/quickstart/#1-install-apm) - A supported AI agent or IDE that integrates with the Skills (VS Code, Cursor, Syncfusion® Code Studio, etc.) -- Active Syncfusion® license(any of the following): +- Active Syncfusion® license (any of the following): - [Commercial](https://www.syncfusion.com/sales/unlimitedlicense) - [Community License](https://www.syncfusion.com/products/communitylicense) - [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials) @@ -158,11 +158,11 @@ Create a employee directory using blazor spreadsheet component with columns for {% endpromptcard %} {% endpromptcards %} -* Generated code follows best practices with accessible, semantic HTML, responsive mobile-first layouts, strong C# typing, and built-in security measures such as input validation and avoidance of embedded secrets. +Generated code follows best practices with accessible, semantic HTML, responsive mobile-first layouts, strong C# typing, and built-in security measures such as input validation and avoidance of embedded secrets. ## Best Practices -Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready result: +Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready results: - **Stay consistent** - Maintain consistent file organization, naming conventions, and coding standards throughout your project. - **Use advanced AI models** - For best results, use **Claude Sonnet 4.6 or higher** capability models to produce better code quality and more accurate implementations. diff --git a/Document-Processing/Excel/Spreadsheet/React/ui-builder-skill.md b/Document-Processing/Excel/Spreadsheet/React/ui-builder-skill.md index 243f4ef342..0361bc7146 100644 --- a/Document-Processing/Excel/Spreadsheet/React/ui-builder-skill.md +++ b/Document-Processing/Excel/Spreadsheet/React/ui-builder-skill.md @@ -8,7 +8,7 @@ documentation: ug keywords: React UI Builder, Skills, AI Assistants, Spreadsheet SDK, Agent Skills --- -# Syncfusion® React UI Builder Skill with Spreadsheet for AI Assistants +# Syncfusion® React UI Builder Skill with Spreadsheet **Syncfusion® React UI Builder Skill** is an AI-powered agent skill that accelerates React Spreadsheet development by transforming natural-language UI requirements into production-ready code using Syncfusion® React Spreadsheet components. @@ -23,7 +23,7 @@ Before installing React UI Builder Skill with Spreadsheet, ensure the following: - Required [Node.js](https://nodejs.org/en) version ≥ 18 - React application (existing or new); see [Quick Start](https://ej2.syncfusion.com/react/documentation/getting-started/quick-start) - A supported AI agent or IDE that integrates with the Skills (VS Code, Cursor, Syncfusion® Code Studio, etc.) -- Active Syncfusion® license(any of the following): +- Active Syncfusion® license (any of the following): - [Commercial](https://www.syncfusion.com/sales/unlimitedlicense) - [Community License](https://www.syncfusion.com/products/communitylicense) - [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials) @@ -111,7 +111,7 @@ Refer to the [documentation](https://microsoft.github.io/apm/reference/cli/targe Load required theming guidelines and confirm key design choices: - CSS framework (Tailwind, Bootstrap, Material, or Greenfield(custom theme)). If no themes detected in the existing project, Greenfield and Syncfusion Tailwind3 theme are shown as the default option. - Syncfusion theme (Tailwind3, Bootstrap5, Material3, fluent2) - - Light and Dark Mode + - Light and Dark Mode - Core design basics (colors, spacing, typography, responsiveness, accessibility) 5. **Code Generation:** Produce TypeScript React components with Spreadsheet integration, props interfaces, and CSS/styling scaffolding. 6. **Dependency Management:** Recommend or install required Syncfusion® packages and peer dependencies. @@ -160,7 +160,7 @@ Generated code follows best practices with accessible, semantic HTML, responsive ## Best Practices -Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready result: +Follow these guidelines to get the most out of UI Builder and ensure high-quality production-ready results: - **Stay consistent:** Maintain consistent file organization, naming conventions, and coding standards throughout your project. - **Use advanced AI models:** For best results, use **Claude Sonnet 4.6 or higher** capability models to produce better code quality and more accurate implementations. diff --git a/Document-Processing/Skills/spreadsheet-editor-sdk/component-skills.md b/Document-Processing/Skills/spreadsheet-editor-sdk/component-skills.md index 703ea4ca7a..3bc80ea4b3 100644 --- a/Document-Processing/Skills/spreadsheet-editor-sdk/component-skills.md +++ b/Document-Processing/Skills/spreadsheet-editor-sdk/component-skills.md @@ -9,7 +9,7 @@ keywords: Skills, AI Assistants, Spreadsheet Editor SDK, Agent Skills # Syncfusion Spreadsheet Editor SDK Agent Skills for AI Assistants -This guide introduces **Syncfusion Spreadsheet Editor SDK Skills**, a curated knowledge package that empowers AI assistants (such as GitHub Copilot, Code Studio, Cursor, Claude, and others) to generate accurate code for Syncfusion® Spreadsheet Editor SDK components across supported platforms. +This guide introduces **Syncfusion Spreadsheet Editor SDK Skills**, a curated knowledge package that empowers AI assistants (such as GitHub Copilot, Code Studio, Cursor, Claude, and others) to generate accurate, production ready Spreadsheet integration code using the Syncfusion® Spreadsheet Editor SDK components across supported platforms. Syncfusion® Spreadsheet Editor SDK Skills address common issues with generic AI code suggestions by grounding the assistant in precise Spreadsheet Editor SDK Component APIs, spreadsheet editor patterns, and platform-specific configuration for the following platforms: @@ -20,7 +20,7 @@ Syncfusion® Spreadsheet Editor SDK Skills a | [Blazor](https://help.syncfusion.com/document-processing/excel/spreadsheet/blazor/overview) | [syncfusion-blazor-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-blazor-spreadsheet-editor) | | [ASP.NET Core](https://help.syncfusion.com/document-processing/excel/spreadsheet/asp-net-core/overview) | [syncfusion-aspnetcore-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-aspnetcore-spreadsheet-editor) | | [ASP.NET MVC](https://help.syncfusion.com/document-processing/excel/spreadsheet/asp-net-mvc/overview) | [syncfusion-aspnetmvc-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-aspnetmvc-spreadsheet-editor) | -| [TypeScript](https://help.syncfusion.com/document-processing/excel/spreadsheet/javascript-es6/overview) | [syncfusion-javascript-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-javascript-spreadsheet-editor) | +| [avaScript (ES6)](https://help.syncfusion.com/document-processing/excel/spreadsheet/javascript-es6/overview) | [syncfusion-javascript-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-javascript-spreadsheet-editor) | | [Vue](https://help.syncfusion.com/document-processing/excel/spreadsheet/vue/overview) | [syncfusion-vue-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-vue-spreadsheet-editor) | | [UWP](https://help.syncfusion.com/document-processing/excel/spreadsheet/uwp/overview) | [syncfusion-uwp-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-uwp-spreadsheet-editor) | | [WPF](https://help.syncfusion.com/document-processing/excel/spreadsheet/wpf/overview) | [syncfusion-wpf-spreadsheet-editor](https://github.com/syncfusion/spreadsheet-editor-sdk-skills/tree/master/skills/syncfusion-wpf-spreadsheet-editor) | @@ -74,10 +74,10 @@ The terminal will show a list of available skills. Use the arrow keys to navigat Select skills to install (space to toggle) │ ◻ syncfusion-react-spreadsheet-editor -│ ◻ ssyncfusion-angular-spreadsheet-editor +│ ◻ syncfusion-angular-spreadsheet-editor │ ◻ syncfusion-blazor-spreadsheet-editor │ ◻ syncfusion-aspnetcore-spreadsheet-editor -│ ◻ ssyncfusion-aspnetmvc-spreadsheet-editor +│ ◻ syncfusion-aspnetmvc-spreadsheet-editor │ ◻ syncfusion-javascript-spreadsheet-editor │ ◻ syncfusion-vue-spreadsheet-editor │ ◻ syncfusion-uwp-spreadsheet-editor @@ -252,7 +252,7 @@ Yes. Once installed, supported agents automatically detect and load relevant ski Verify that skills are installed in the correct agent directory, restart the IDE, and confirm that the agent supports external skill files. -## See also +## See Also - [Syncfusion Spreadsheet Editor Documentation](https://help.syncfusion.com/document-processing/excel/spreadsheet/overview) - [Agent Skills Standards](https://agentskills.io/home) diff --git a/Document-Processing/Skills/spreadsheet-editor-sdk/ui-builder-skills.md b/Document-Processing/Skills/spreadsheet-editor-sdk/ui-builder-skills.md index 5a5ac0f91e..4aa6437e84 100644 --- a/Document-Processing/Skills/spreadsheet-editor-sdk/ui-builder-skills.md +++ b/Document-Processing/Skills/spreadsheet-editor-sdk/ui-builder-skills.md @@ -1,6 +1,6 @@ --- layout: post -title: UI Builder Skill with Spreadsheet Editor SDK | Syncfusion® +title: UI Builder Skills with Spreadsheet Editor SDK | Syncfusion® description: Learn to use Syncfusion® UI Builder Skill with Spreadsheet Editor SDK to help AI assistants create accurate, production-ready UIs using Spreadsheet components. control: Spreadsheet Editor SDK platform: document-processing @@ -8,9 +8,9 @@ documentation: ug keywords: UI Builder, Skills, AI Assistants, Spreadsheet Editor SDK, Agent Skills --- -# Syncfusion® UI Builder Skill with Spreadsheet Editor SDK +# Syncfusion® UI Builder Skills with Spreadsheet Editor SDK -Syncfusion® UI Builder Skill with Spreadsheet Editor SDK for AI Assistants is an AI-powered companion that accelerates application development by transforming natural-language UI requirements into production-ready implementations using Syncfusion® UI components and Spreadsheet Editor components. +Syncfusion® UI Builder Skills with Spreadsheet Editor SDK for AI Assistants is an AI-powered companion that accelerates application development by transforming natural-language UI requirements into production-ready implementations using Syncfusion® UI components and Spreadsheet Editor components. It supports multiple platforms—including React, Angular, Blazor, WPF and WinForms integrates seamlessly with AI-powered IDEs to generate accurate, platform-specific code. @@ -18,9 +18,9 @@ By leveraging deep knowledge of Syncfusion® component libraries, it enables dev With intelligent UI generation across both general UI components and Spreadsheet Editor capabilities, developers can rapidly design and implement modern applications without leaving their development workflow. -## Supported Platforms for Spreadsheet UI Builder Skill +## Supported Platforms for Spreadsheet UI Builder Skills -You can refer to the platform-specific guidance on how to use Syncfusion® UI Builder Skill for AI Assistants with Spreadsheet Editor SDK products from the following: +You can refer to the platform-specific guidance on how to use Syncfusion® UI Builder Skills for AI Assistants with Spreadsheet Editor SDK products from the following: - [UI Builder Skill for React Spreadsheet Editor](../../Excel/Spreadsheet/react/ui-builder-skill) - [UI Builder Skill for Angular Spreadsheet Editor](../../Excel/Spreadsheet/angular/ui-builder-skill)