Added new UI composer skill content to winforms

WindowsForms-toc.html

@@ -9,9 +9,12 @@
 	<li>
 	   <a href="/windowsforms/System-Requirements">System Requirements</a>
 	</li>
-	<li>
-	   <a href="/windowsforms/skills">Skills</a>
-	</li>
+    <li>Skills
+        <ul>
+            <li><a href="/windowsforms/skills/control-skills">Control Skills</a></li>
+            <li><a href="/windowsforms/skills/ui-composer-skill">Windows Forms UI Composer Skill</a></li>
+        </ul>
+    </li>
 	<li>AI Coding Assistant
 		<ul>
 			<li><a href="/windowsforms/ai-coding-assistant/overview">Overview</a></li>

WindowsForms/skills.md → WindowsForms/skills/control-skills.md

@@ -1,7 +1,7 @@
 ---
 layout: post
 title: Syncfusion Windows Forms Agent Skills for AI Assistants | Syncfusion
-description: Learn how to install and use Syncfusion Agent Skills to enhance AI assistants with accurate Syncfusion Windows Forms component guidance.
+description: Learn how to install and use Syncfusion Agent Skills to enhance AI assistants with accurate Syncfusion Windows Forms control guidance.
 control: Skills
 platform: windowsforms
 documentation: ug
@@ -12,41 +12,43 @@ domainurl: ##DomainURL##
 
 This guide introduces **Syncfusion Windows Forms Skills**, a knowledge package that enables AI assistants (VS Code, Cursor, CodeStudio, etc.) to understand and generate accurate Windows Forms code using official APIs, patterns, and theming guidelines.
 
-These skills eliminate common issues with generic AI suggestions by grounding the assistant in accurate component usage patterns, API structures, supported features, and project‑specific configuration.
+These skills eliminate common issues with generic AI suggestions by grounding the assistant in accurate control usage patterns, API structures, supported features, and project‑specific configuration.
 
 ## Prerequisites
 
 Before installing Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms Agent Skills, ensure the following:
 
-- Required [Node.js](https://nodejs.org/en/) version >= 16
+- Required [.NET SDK](https://dotnet.microsoft.com/en-us/download) version >= 6 for Windows Forms development
 - Windows Forms application (existing or new); see [Overview](https://help.syncfusion.com/windowsforms/overview)
 - A supported AI agent or IDE that integrates with the Skills CLI (VS Code, Syncfusion<sup style="font-size:70%">&reg;</sup> Code Studio, Cursor, etc.)
 
 ## Key Benefits
 
-**Component Usage & API Knowledge**
-- Accurate guidance for adding and configuring Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms components
+**Control Usage & API Knowledge**
+- Accurate guidance for adding and configuring Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms controls
 - Component‑specific properties, events, and required assemblies
-- Guidance for component initialization and designer integration patterns
+- Guidance for control initialization and designer integration patterns
 
 **Patterns & Best Practices**
 - Recommended API structures and composition patterns for Windows Forms
-- Data‑binding approaches for common scenarios
+- Data‑binding approaches for common scenarios using DataSource and BindingSource
 - Feature‑injection workflows (for example, paging, sorting, filtering)
+- Event handling and layout management for Windows Forms controls
 - All guidance is authored directly in Skill files and does not rely on external documentation fetches
 
 **Design‑System Guidance**
-- Theme usage, including light and dark variants
-- VisualStyle patterns and customization approaches
-- Consistent design alignment across Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms components
+- SkinManager integration with Office2007, Office2010, Office2013, Office2016, Office2019, Metro, and HighContrast themes
+- Theme customization using Theme Studio for Office2019Colorful and HighContrastBlack themes
+- Light and dark theme variants for Windows Forms
+- Consistent design alignment across Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms controls
 
 ## Installation
 
-Install [Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms components skills](https://github.com/syncfusion/winforms-ui-components-skills.git) using the Skills CLI. Users can also explore available skills from the [marketplace](https://skills.sh/syncfusion/).
+Install [Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms controls skills](https://github.com/syncfusion/winforms-ui-components-skills.git) using the Skills CLI. Users can also explore available skills from the [marketplace](https://www.skills.sh/syncfusion).
 
 ### Install all skills
 
-Use the following command to install all component skills at once in the `.agents/skills` directory:
+Use the following command to install all control skills at once in the `.agents/skills` directory:
 
 {% tabs %}
 {% highlight bash tabtitle="NPM" %}
@@ -127,24 +129,27 @@ Choose your installation scope (project-level or global), then confirm to comple
 
 This registers the Syncfusion<sup style="font-size:70%">&reg;</sup> skill pack so your AI assistant can automatically load it in supported IDEs such as [Code Studio](https://help.syncfusion.com/code-studio/reference/configure-properties/skills), [Visual Studio Code](https://code.visualstudio.com/docs/copilot/customization/agent-skills), and [Cursor](https://cursor.com/docs/skills).
 
-To learn more about the Skills CLI, refer [here](https://skills.sh/docs). 
+To learn more about the Skills CLI, refer [here](https://www.skills.sh/docs). 
 
 ## How Syncfusion<sup style="font-size:70%">&reg;</sup> Agent Skills Work
 
-1. **Reads relevant Skill files based on queries**, retrieving component usage patterns, APIs, and best‑practice guidance from installed Syncfusion<sup style="font-size:70%">&reg;</sup> Skills. The assistant initially loads only skill names and descriptions, then dynamically loads the required skill and reference files as needed to provide accurate Syncfusion guidance.
+1. **Reads relevant Skill files based on queries**, retrieving control usage patterns, APIs, and best‑practice guidance from installed Syncfusion<sup style="font-size:70%">&reg;</sup> Skills. The assistant initially loads only skill names and descriptions, then dynamically loads the required skill and reference files as needed to provide accurate Syncfusion guidance.
 2. **Enforces Syncfusion<sup style="font-size:70%">&reg;</sup> best practices**, including:
 
-   - Using the required assemblies for each component.
-   - Injecting applicable component controls (for example, paging, sorting, filtering, and other feature controls).
-   - Adding the correct theme and VisualStyle settings.
-3. **Generates component‑accurate code**, avoiding invalid properties or unsupported patterns.
+   - Using the required Syncfusion assemblies for each control (.dll references).
+   - Injecting applicable control controls and behaviors (for example, paging, sorting, filtering, and other feature controls).
+   - Adding the correct theme, VisualStyle, and StyleManager configurations for Windows Forms.
+   - Proper event wiring and control initialization within Form designer or code.
+3. **Generates component‑accurate code**, avoiding invalid properties or unsupported patterns specific to Windows Forms.
 
 ### Using the AI Assistant
 
 Once skills are installed, the assistant can be used to generate and update Syncfusion<sup style="font-size:70%">&reg;</sup> Windows Forms code for tasks such as:
 
-- "Add a DataGrid with paging, sorting, and filtering."
-- "Create a Scheduler with week view and drag‑drop."
+- "Add a DataGrid with paging, sorting, and filtering features."
+- "Create a Scheduler control with week view and drag-and-drop support."
+- "Apply the Office2019Colorful theme to all Syncfusion controls using SkinManager."
+- "Configure a ComboBox with autocomplete and data binding."
 
 ## Skills CLI Commands
 
@@ -217,4 +222,4 @@ Verify that skills are installed in the correct agent directory, restart the IDE
 ## See also
 
 - [Agent Skills Standards](https://agentskills.io/home)
-- [Skills CLI](https://skills.sh/docs)
+- [Skills CLI](https://www.skills.sh/docs)

WindowsForms/skills/ui-composer-skill.md

@@ -0,0 +1,200 @@
+---
+layout: post
+title: Syncfusion® WinForms UI Composer Skill for AI Assistants | Syncfusion®
+description: Install Syncfusion® Windows Forms UI Composer to generate production-ready Windows Forms controls from natural-language prompts.
+control: Skills
+platform: windowsforms
+documentation: ug
+domainurl: ##DomainURL##
+---
+
+# Syncfusion® Windows Forms UI Composer Skill for AI Assistants
+
+**Syncfusion® Windows Forms UI Composer** is an AI-powered skill and companion agent that accelerates Windows Forms application development by transforming natural-language UI requirements into production-ready controls using Syncfusion® Windows Forms libraries. 
+
+Integrated with your AI-powered IDE, it leverages deep knowledge of **Syncfusion® controls** to deliver accurate and ready-to-use code.
+By combining intelligent code generation with best practices, accessibility standards, and design-system consistency, Windows Forms UI Composer helps you rapidly build scalable dashboards and user interfaces without leaving your development workflow.
+
+## Prerequisites
+
+Before installing Windows Forms UI Composer, ensure the following:
+
+- Install [APM (Agent Package Manager)](https://microsoft.github.io/apm/getting-started/installation/#quick-install-recommended)
+- Required [.NET SDK](https://dotnet.microsoft.com/en-us/download) version ≥ 6
+- Windows Forms application (existing or new); see [Overview](https://help.syncfusion.com/windowsforms/overview)
+- A supported AI agent or IDE that integrates with the Skills (VS Code, Cursor, Syncfusion® Code Studio, etc.)
+- Active Syncfusion<sup style="font-size:70%">&reg;</sup> 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)
+
+## Key Benefits
+
+### **AI-Driven UI Generation**
+- Converts prompts into complete Windows Forms components—not just snippets
+- Automatically selects appropriate Syncfusion® controls and features
+- Produces structured, maintainable C# code
+
+### **Control Usage & API Accuracy**
+- Uses correct Syncfusion® control APIs and properties
+- Injects required feature controls and behaviors (paging, sorting, filtering, etc.)
+- Ensures proper assembly references and control initialization
+- Avoids unsupported or deprecated patterns for Windows Forms
+
+### **Patterns & Best Practices**
+- Recommended control composition and data-binding patterns
+- Event handling aligned with Windows Forms standards and designer integration
+- Secure and scalable coding patterns with proper resource management
+- Designer-friendly code that works in both code-behind and UI designer
+
+### **Accessibility & Design System**
+- Follows Windows accessibility guidelines
+- Supports keyboard navigation and accessibility standards
+- Theme consistency across desktop applications
+
+### **Design-System Integration**
+- Supports Syncfusion® Windows Forms themes via SkinManager (Office2007, Office2010, Office2013, Office2016, Office2019, Metro, HighContrast)
+- SkinManager integration for consistent theming
+- Theme Studio support for customizing Office2019Colorful and HighContrastBlack themes
+- Ensures consistent Syncfusion® styling across controls
+
+## Installation
+
+Before installing WinForms UI Composer, ensure that APM (Agent Package Manager) is installed and available in your environment.
+
+### Verify APM Installation
+
+Run the following command to confirm APM is installed:
+
+```bash
+apm --version
+```
+
+### Install the Syncfusion® Windows Forms UI Composer package using APM
+
+Use the APM CLI to install the WinForms UI Composer skill for your preferred environment:
+
+{% tabs %}
+{% highlight bash tabtitle="Copilot" %}
+
+apm install syncfusion/winforms-ui-composer -t copilot
+
+{% endhighlight %}
+{% highlight bash tabtitle="Cursor" %}
+
+apm install syncfusion/winforms-ui-composer -t cursor
+
+{% endhighlight %}
+{% highlight bash tabtitle="Codex" %}
+
+apm install syncfusion/winforms-ui-composer -t codex
+
+{% endhighlight  %}
+{% highlight bash tabtitle="Claude" %}
+
+apm install syncfusion/winforms-ui-composer -t claude
+
+{% endhighlight %}
+{% endtabs %}
+
+After installation, the following artifacts are added to your project for the GitHub Copilot target:
+
+- `.agent/skills/` – contains the skill files
+- `.github/agents/` – contains the agent configuration
+
+Refer to the [documentation](https://microsoft.github.io/apm/reference/cli/targets/#detection-signals) for details about supported deployment targets.
+
+> For Syncfusion® Code Studio, use the Copilot command above to install the WinForms UI Composer.
+
+## How the Syncfusion® Windows Forms UI Composer Skill Works
+
+1. **Intent Analysis** — Parse the user's prompt to identify control types and high-level form layout intent.
+2. **Project Detection** — Automatically detects .NET framework (Framework, Core, or .NET 5+) and existing Syncfusion® configurations.
+3. **Control Mapping** — Map intent to Syncfusion® Windows Forms controls and required feature controls.
+4. **Theming & Design System**  
+   Load required theming guidelines and confirm key design choices:
+   - Syncfusion® Windows Forms theme (Office2007, Office2010, Office2013, Office2016, Office2019, Metro, HighContrast)
+   - Core design basics (colors, fonts, control appearance, DPI awareness)
+   - Light and dark theme variants per theme family
+5. **Code Generation** — Produce C# Windows Forms controls, data bindings, event handlers, and styling.
+6. **Dependency Management** — Recommend or install required Syncfusion® NuGet packages and .NET dependencies.
+7. **Validation** — Run code compatibility and basic security checks, request confirmation for changes.
+8. **Code Insertion** — Create Form classes, user controls, or patch existing files following Windows Forms conventions.
+
+Key enforcement points:
+
+- Adds correct SkinManager configuration and theme settings for chosen Syncfusion® themes (loads required theme assemblies)
+- Injects only the feature controls and behaviors required by generated controls
+- Follows Windows Forms conventions for control naming, initialization, and event handling
+- Generates designer-compatible code with proper control hierarchy and parent-child relationships
+- Ensures all required Syncfusion® assemblies and theme NuGet packages are referenced and configured
+- Avoids unsupported or deprecated API usages for Syncfusion® Windows Forms controls
+
+> The assistant handles most stages automatically and may request confirmation where required.
+
+## Using the AI Assistant
+
+After installing Windows Forms UI Composer with APM, the relevant agent and skill files are added to your project under:
+
+- `.agent/skills/` (skill files)
+- `.github/agents/` (Windows Forms UI composer agent configuration, based on the selected target)
+
+To start using the skill:
+
+1. Open your supported IDE.
+2. In the chat panel, select the `syncfusion-winforms-ui-composer` agent from the **Agent dropdown**.
+
+3. Start prompting the agent with a clear description of your UI requirements.
+
+Examples Prompts:
+
+{% promptcards %}
+{% promptcard Authentication %}
+Create a login form using the Office2019Colorful theme with a centered TableLayoutPanel containing email and password TextBox controls with validation. Include a "Remember Me" CheckBox, a forgot password LinkLabel, and a primary login Button. Add a secondary "Create Account" button below. Ensure the form is well-organized and follows Windows Forms best practices with proper SkinManager configuration.
+{% endpromptcard %}
+{% promptcard Admin Dashboard %}
+Create a CMS Admin Dashboard UI featuring a collapsible TreeView in a left panel (docked) with navigation items for Dashboard, Content, Users, Analytics, and Settings; a top StatusBar showing the title "CMS Admin Dashboard" and user name; and a main content area with a SplitContainer containing three compact summary panels in a FlowLayoutPanel displaying Total Content, Total Users, and Active Sessions (each showing a label, count value, and percentage change), followed by a "Content Management" section with a DataGrid containing columns for Title, Author, Status, Date, and Actions, and finally two charts displayed side by side—a column chart titled "Content Over Time" and a pie chart titled "Content by Category"—using realistic sample data.
+{% endpromptcard %}
+{% endpromptcards %}
+
+Generated code follows Windows Forms best practices with proper control layout, event handling, data bindings, strong C# typing, and built-in security measures such as input validation and avoidance of hardcore secrets. The code is fully compatible with Visual Studio designer and Windows Forms conventions.
+
+## Best Practices
+
+Follow these guidelines to get the most out of UI Composer and ensure high-quality production-ready results:
+
+- **Stay consistent** — Maintain consistent file organization, naming conventions (PascalCase for classes, camelCase for variables), and Windows Forms 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.
+- **Review all content before production** — Validate the logic, security, and compatibility with your existing code and target .NET framework before deployment. Test control functionality within Visual Studio designer and at runtime.
+- **Verify Syncfusion® licenses** — Ensure all required Syncfusion® controls have valid licenses before deploying to production.
+- **Test across platforms** — Verify DPI awareness, high-resolution display support, and Windows accessibility features.
+
+## Troubleshooting
+
+- **APM installation failure**: Refer to this [documentation](https://microsoft.github.io/apm/getting-started/installation/#troubleshooting)
+
+- **Skills not loading**: Ensure the **.agent/** and **.github/agents/** folders exist in your project and that the skill was installed successfully using APM. Verify that the correct agent is selected from the Agent dropdown in your IDE.
+
+- **Control not rendering**: Retry generation using the specific control skill to resolve the issue, and ensure required Syncfusion® packages and themes are properly configured.
+
+- **Syncfusion license banner appears**: Use the licensing skill to correctly register and validate your Syncfusion® license key in the application.
+
+
+## FAQ
+
+**Which agents/IDEs are supported?**
+Any Skills-compatible agent that reads local skill files (Code Studio, VS Code, Cursor, etc.).
+
+**Are skills loaded automatically?**  
+Yes. Supported agents automatically load relevant skills based on your query.
+
+**Can I customize the generated styles?**
+Yes — the generated Windows Forms controls include clear integration points for style adjustments.
+
+**Does it modify files automatically?**
+The skill proposes changes and requires confirmation for insertion; automatic dependency installation may be offered depending on agent permissions.
+
+## See also
+
+- [Agent Skills Standards](https://agentskills.io/home)
+- [Agent Package Manager](https://microsoft.github.io/apm/getting-started/quick-start/)