Skip to content
Open
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
8 changes: 4 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
# Syncfusion Code Studio Documentation
# Syncfusion Code Documentation

This repository contains the official documentation for Syncfusion Code Studio, a next-generation AI-powered Integrated Development Environment (IDE) designed to enhance developer productivity.
This repository contains the official documentation for Syncfusion Code, a next-generation AI-powered Integrated Development Environment (IDE) designed to enhance developer productivity.

## About Syncfusion Code Studio
## About Syncfusion Code

Syncfusion Code Studio combines the power of AI with comprehensive development tools to help developers write better code faster. With its deep integration with Syncfusion's component library, Syncfusion Code Studio provides intelligent assistance for building robust applications across multiple platforms.
Syncfusion Code combines the power of AI with comprehensive development tools to help developers write better code faster. With its deep integration with Syncfusion's component library, Syncfusion Code provides intelligent assistance for building robust applications across multiple platforms.
14 changes: 7 additions & 7 deletions code-studio-ide-toc.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<a href="/code-studio/ide/getting-started/quick-start">Quickstart</a>
</li>
<li>
<a href="/code-studio/ide/getting-started/build-voice-notes-app-with-spec-driven-development">Build Your First App in Code Studio</a>
<a href="/code-studio/ide/getting-started/build-voice-notes-app-with-spec-driven-development">Build Your First App in Syncfusion Code</a>
</li>
</ul>
</li>
Expand All @@ -24,7 +24,7 @@
<a href="/code-studio/ide/tutorials/generate-your-first-code-using-agent">Generate Code Changes with Agent Mode</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/from-complex-web-automation-to-streamlined-workflows-code-studio-skills-for-playwright-mcp">Playwright MCP Workflows with Code Studio Skills</a>
<a href="/code-studio/ide/tutorials/from-complex-web-automation-to-streamlined-workflows-code-studio-skills-for-playwright-mcp">Playwright MCP Workflows with Syncfusion Code Skills</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/compare-ai-models">Compare AI Models</a>
Expand All @@ -39,7 +39,7 @@
<a href="/code-studio/ide/tutorials/reusable-prompt-templates">Reusable Prompt Templates</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/fixing-bugs-with-ai">Fix Bugs with Code Studio AI</a>
<a href="/code-studio/ide/tutorials/fixing-bugs-with-ai">Fix Bugs with Syncfusion Code AI</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/context-aware-prompt-optimization">Context Aware Prompt Optimization</a>
Expand All @@ -54,7 +54,7 @@
<a href="/code-studio/ide/tutorials/use-code-studio-efficiently">Efficient Usage and Cost Management</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/using-openspec-inside-syncfusion-code">Using OpenSpec in Code Studio</a>
<a href="/code-studio/ide/tutorials/using-openspec-inside-syncfusion-code">Using OpenSpec in Syncfusion Code</a>
</li>
<li>
<a href="/code-studio/ide/tutorials/automating-software-testing-with-testcases">Automated Testing without Writing Test Cases Manually</a>
Expand Down Expand Up @@ -227,13 +227,13 @@
<li>Troubleshoot
<ul>
<li>
<a href="/code-studio/ide/troubleshoot/how-to-resolve-the-app-corruption">How to resolve Code Studio app corruption</a>
<a href="/code-studio/ide/troubleshoot/how-to-resolve-the-app-corruption">How to resolve Syncfusion Code app corruption</a>
</li>
<li>
<a href="/code-studio/ide/troubleshoot/openai-integration">How to Resolve Error (Status Code 403) for O3 model in OpenAI Integration via OpenRouter</a>
</li>
<li>
<a href="/code-studio/ide/troubleshoot/migrate-code-studio-rules-to-instructions">How to migrate Code Studio Rules to Instructions in the latest release</a>
<a href="/code-studio/ide/troubleshoot/migrate-code-studio-rules-to-instructions">How to migrate Syncfusion Code Rules to Instructions in the latest release</a>
</li>
<li>
<a href="/code-studio/ide/troubleshoot/migrate-legacy-prompt-files">How to migrate legacy Prompt files to the updated platform</a>
Expand All @@ -251,7 +251,7 @@
<a href="/code-studio/ide/troubleshoot/review-gitdiff-changes">How to review Git diff changes in the current release</a>
</li>
<li>
<a href="/code-studio/ide/troubleshoot/resolve-uncaught-exception-error">How to resolve the Uncaught Exception error during Code Studio auto update</a>
<a href="/code-studio/ide/troubleshoot/resolve-uncaught-exception-error">How to resolve the Uncaught Exception error during Syncfusion Code auto update</a>
</li>
</ul>
</li>
Expand Down
8 changes: 4 additions & 4 deletions code-studio/enterprise-server/createbudget.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
---
title: Create Budget in Syncfusion Code Studio
description: Learn how to configure team and individual user budgets, set budget periods with auto-renewal, and set up usage alerts in Syncfusion Code Studio Enterprise Server.
title: Create Budget in Syncfusion Code
description: Learn how to configure team and individual user budgets, set budget periods with auto-renewal, and set up usage alerts in Syncfusion Code Enterprise Server.
platform: syncfusion-code-studio
keywords: budget, usage, billing, alerts, teams, users, admin, syncfusion, code-studio, enterprise server, getting started
tocname: code-studio-enterprise-server-toc
---

# Create Budget

The Budget feature in Code Studio enables administrators to allocate and monitor AI usage budgets for teams and individual users. This helps organizations manage costs effectively and optimize AI resource utilization.
The Budget feature in Syncfusion Code enables administrators to allocate and monitor AI usage budgets for teams and individual users. This helps organizations manage costs effectively and optimize AI resource utilization.

> **Note**: Admins can edit and assign budget for all. A Team Owner can add budgets and set alerts for their users, but not for the entire team. Team Lead and User can view their team and user budget.

Expand All @@ -17,7 +17,7 @@ The Budget feature in Code Studio enables administrators to allocate and monitor

**Steps:**

- Open the **Code Studio** page and navigate to the **Budget** page from the left sidebar.
- Open the **Syncfusion Code** page and navigate to the **Budget** page from the left sidebar.

<img src="./enterprise-images/budget.png" alt="budget" />

Expand Down
4 changes: 2 additions & 2 deletions code-studio/enterprise-server/dashboard.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
title: Code Studio Enterprise Dashboard
description: Monitor and analyze organization, team, and user metrics such as cost, tokens, requests, and latency in Syncfusion Code Studio.
title: Syncfusion Code Enterprise Dashboard
description: Monitor and analyze organization, team, and user metrics such as cost, tokens, requests, and latency in Syncfusion Code.
platform: syncfusion-code-studio
keywords: dashboard, analytics, monitoring, usage, tokens, requests, latency, teams, users, cost, syncfusion, code-studio, enterprise
tocname: code-studio-enterprise-server-toc
Expand Down
4 changes: 2 additions & 2 deletions code-studio/enterprise-server/fallback.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Configuring Fallback Policies in Syncfusion Code Studio
title: Configuring Fallback Policies in Syncfusion Code
description: Set up resilient AI workflows by defining fallback and retry rules that automatically switch to backup models when the primary model fails.
platform: syncfusion-code-studio
keywords: fallback, failover, retries, policy, models, routing, reliability, code-studio, enterprise-server
Expand All @@ -8,7 +8,7 @@ tocname: code-studio-enterprise-server-toc

# Fallback Policy Configuration

Fallback Policies in Code Studio ensure uninterrupted AI workflows by automatically rerouting requests to alternative models when the primary model fails. This feature improves reliability, success rates, and cost efficiency.
Fallback Policies in Syncfusion Code ensure uninterrupted AI workflows by automatically rerouting requests to alternative models when the primary model fails. This feature improves reliability, success rates, and cost efficiency.

## Prerequisites

Expand Down
10 changes: 5 additions & 5 deletions code-studio/enterprise-server/freemodel.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
---
title: Use OpenRouter Free Models in Syncfusion Code Studio
description: Instructions to use Code Studio effectively while minimizing or eliminating costs through free models.
title: Use OpenRouter Free Models in Syncfusion Code
description: Instructions to use Syncfusion Code effectively while minimizing or eliminating costs through free models.
platform: syncfusion-code-studio
control: IDE
documentation: Getting Started
keywords: code, IDE, freemodel, openrouter
tocname: code-studio-enterprise-server-toc
---

# Use OpenRouter Free Models in Syncfusion Code Studio
# Use OpenRouter Free Models in Syncfusion Code

## Why this Matters
AI model costs can add up quickly during development. This guide shows you how to use Code Studio effectively while minimizing or eliminating costs through free models.
AI model costs can add up quickly during development. This guide shows you how to use Syncfusion Code effectively while minimizing or eliminating costs through free models.

## When to use
- You need instant access for coding models with no token limits.
Expand All @@ -35,7 +35,7 @@ AI model costs can add up quickly during development. This guide shows you how t

## OpenRouter Free Tier Models

OpenRouter's free tier unlocks powerful, hosted models that are free (with fair usage limits to keep things sustainable). It's perfect for testing and prototyping without cost. You can easily connect the free models to Code Studio by following this [Configuration steps](/code-studio/enterprise-server/providersandmodels).
OpenRouter's free tier unlocks powerful, hosted models that are free (with fair usage limits to keep things sustainable). It's perfect for testing and prototyping without cost. You can easily connect the free models to Syncfusion Code by following this [Configuration steps](/code-studio/enterprise-server/providersandmodels).


**Note:** These free models generally deliver about 60% proper results, so use them for prototyping and non-sensitive tasks rather than production.
Expand Down
10 changes: 5 additions & 5 deletions code-studio/enterprise-server/getting-started.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
---
title: Getting started with Syncfusion Code Studio
description: Set up your account, download the app, and configure your organization to begin using Code Studio for AI-assisted development.
title: Getting started with Syncfusion Code
description: Set up your account, download the app, and configure your organization to begin using Syncfusion Code for AI-assisted development.
platform: syncfusion-code-studio
keywords: getting started, onboarding, setup, account, dashboard, profile, settings, download, syncfusion, Code Studio
keywords: getting started, onboarding, setup, account, dashboard, profile, settings, download, syncfusion, Syncfusion Code
tocname: code-studio-enterprise-server-toc
---

# Getting Started

Start using Code Studio
Start using Syncfusion Code

### 1. Create and Access Your Account

To start using Code Studio, visit: [Syncfusion Code Studio](https://app.sfcodestudio.com)
To start using Syncfusion Code, visit: [Syncfusion Code](https://app.sfcodestudio.com)

**Sign-In Options**
You can sign in using one of the following methods:
Expand Down
10 changes: 5 additions & 5 deletions code-studio/enterprise-server/providersandmodels.md
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
---
title: Configure LLM Providers and Models in Syncfusion Code Studio
description: Admin guide to connect LLM providers, manage API keys, and add models to your enterprise catalog in Code Studio.
title: Configure LLM Providers and Models in Syncfusion Code
description: Admin guide to connect LLM providers, manage API keys, and add models to your enterprise catalog in Syncfusion Code.
platform: syncfusion-code-studio
keywords: llm, providers, models, configuration, admin, enterprise, syncfusion, code-studio, api keys, model catalog, openai, anthropic, azure openai, gemini
tocname: code-studio-enterprise-server-toc
---

# Configure LLM Providers and Models

This guide provides step-by-step instructions for administrators to configure Large Language Model (LLM) providers and manage models within Code Studio.
This guide provides step-by-step instructions for administrators to configure Large Language Model (LLM) providers and manage models within Syncfusion Code.

> **Note**: Only admins can configure LLM providers and models.

## Prerequisites
- You need an active account on Code Studio
- You need an active account on Syncfusion Code
- OpenRouter API Key - Follow the detailed instructions [here](/code-studio/enterprise-server/freemodel) to obtain an OpenRouter API key and the list of recommended free models for integration.


## 1. Adding an LLM Provider
To integrate an LLM provider into Code Studio:
To integrate an LLM provider into Syncfusion Code:

### Steps
1. Navigate to the **LLM Keys** page under the **BYOK** section.
Expand Down
10 changes: 5 additions & 5 deletions code-studio/enterprise-server/settings.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
---
title: Code Studio Enterprise Settings
description: Manage profile, organization, credits, billing, and subscriptions in Syncfusion Code Studio Enterprise.
title: Syncfusion Code Enterprise Settings
description: Manage profile, organization, credits, billing, and subscriptions in Syncfusion Code Enterprise.
platform: syncfusion-code-studio
keywords: settings, profile, organization, credits, billing, subscription, plans,payments, enterprise, syncfusion, code-studio
tocname: code-studio-enterprise-server-toc
---

# Settings

The Settings area centralizes account and organization configuration for Code Studio Enterprise. Use it to manage your profile, organization details, credits, and billing/subscription plans.
The Settings area centralizes account and organization configuration for Syncfusion Code Enterprise. Use it to manage your profile, organization details, credits, and billing/subscription plans.

## How to Access

- Open the [Code Studio page](https://app.sfcodestudio.com) and navigate to Settings from the left sidebar
- Open the [Syncfusion Code page](https://app.sfcodestudio.com) and navigate to Settings from the left sidebar
- Select one of the tabs: Profile, Organization, Credits, or Billing & Subscription

## 1. Profile
Expand Down Expand Up @@ -109,7 +109,7 @@ Add-on credits fund model usage across your organization.
<td>$0</td>
<td>
<ul>
<li>Full access to Code Studio IDE & Enterprise Server</li>
<li>Full access to Syncfusion Code IDE & Enterprise Server</li>
<li>Five AI modes: Chat, Edit, Agent, Plan, Autocomplete</li>
<li>Image input support</li>
<li>MCP server integration</li>
Expand Down
6 changes: 3 additions & 3 deletions code-studio/enterprise-server/userandteams.md
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
---
title: Managing Users and Teams in Syncfusion Code Studio
description: Learn how to manage users, roles, and teams in Syncfusion Code Studio Enterprise Server for secure collaboration, governance, and usage visibility.
title: Managing Users and Teams in Syncfusion Code
description: Learn how to manage users, roles, and teams in Syncfusion Code Enterprise Server for secure collaboration, governance, and usage visibility.
platform: syncfusion-code-studio
keywords: users, teams, roles, admin, team lead, invitations, access control, governance, syncfusion, code-studio, enterprise
tocname: code-studio-enterprise-server-toc
---
# User & Teams

Code Studio empowers administrators and team leads to manage organization members, assign roles, and organize users into teams for seamless collaboration and governance.
Syncfusion Code empowers administrators and team leads to manage organization members, assign roles, and organize users into teams for seamless collaboration and governance.

## 1. Key Benefits
- **Role Assignment:** Assign roles such as Admin, Team Lead, or User to match your organizational hierarchy.
Expand Down
18 changes: 9 additions & 9 deletions code-studio/ide/customization/agent-plugin.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,14 @@
title: Autopilot and Agent Permissions
description: Learn how to configure and control agent autonomy in code studio using the new Autopilot and permissions picker. This tutorial walks you through enabling Autopilot with chat.autopilot.enabled, choosing between Default Approvals, Bypass Approvals, or Autopilot (Preview), and understanding the security implications of each mode
platform: syncfusion-code-studio
keywords: syncfusion, syncfusion Code Studio,Autopilot, agent permissions, bypass approvals, agent-scoped hooks, agent debugging
keywords: syncfusion, Syncfusion Code,Autopilot, agent permissions, bypass approvals, agent-scoped hooks, agent debugging
tocname: code-studio-ide-toc
---
# Agent Plugins

## Purpose

Agent plugins are bundles of customizations you can install from plugin marketplaces. They extend Code Studio with combinations of slash commands, skills, agents, hooks, and MCP servers, while working alongside your existing customizations.
Agent plugins are bundles of customizations you can install from plugin marketplaces. They extend Syncfusion Code with combinations of slash commands, skills, agents, hooks, and MCP servers, while working alongside your existing customizations.

**Key Benefits:** - Simplify Configuration — Install complete workflows in one action - Standardize Practices — Enforce consistent coding standards across your team - Share Knowledge — Distribute expertise and best practices organization-wide

Expand Down Expand Up @@ -64,7 +64,7 @@ To install a plugin from a marketplace:

- Click the **Install** button to add it to your user profile.

- Code Studio automatically downloads and registers the plugin.
- Syncfusion Code automatically downloads and registers the plugin.

<img src="./reference-images/agent-plugin.gif" alt="Plugin List" />

Expand All @@ -82,7 +82,7 @@ To install a plugin that is not available in a marketplace:

<img src="./reference-images/git-plugin-custom.png" alt="Plugin List" />

- Code Studio automatically clones the repository and installs the plugin.
- Syncfusion Code automatically clones the repository and installs the plugin.

### Step 3: Manage Installed Plugins

Expand All @@ -100,9 +100,9 @@ To manage your installed plugins:

### Step 4: Update Plugins

Code Studio provides two methods to check for plugin updates:
Syncfusion Code provides two methods to check for plugin updates:

- **Automatic Updates**: Code Studio checks for updates automatically every 24 hours if the `extensions.autoUpdate` setting is enabled.
- **Automatic Updates**: Syncfusion Code checks for updates automatically every 24 hours if the `extensions.autoUpdate` setting is enabled.

- **On-Demand Updates**: Press `Ctrl+Shift+P` (or `Cmd+Shift+P` on macOS) and run **Extensions: Check for Extension Updates**.

Expand Down Expand Up @@ -133,15 +133,15 @@ When you disable a plugin, the following components become inactive:

## Understanding How Plugins Become Available

Once you install a plugin, Code Studio processes the plugin's configuration and makes its components available for use. Here is what happens behind the scenes:
Once you install a plugin, Syncfusion Code processes the plugin's configuration and makes its components available for use. Here is what happens behind the scenes:

### Plugin Processing

A typical plugin contains the following components: `plugin.json` (manifest), `agents/` (custom agents), `skills/` (reusable skills), `hooks/` (lifecycle automation), and `.mcp.json` .

When you install a plugin, Code Studio performs the following steps:
When you install a plugin, Syncfusion Code performs the following steps:

1. **Configuration Reading**: Code Studio reads the plugin's `plugin.json` file to understand the plugin's structure and components.
1. **Configuration Reading**: Syncfusion Code reads the plugin's `plugin.json` file to understand the plugin's structure and components.

2. **Component Registration**: The plugin's AI components (agents, skills, and slash commands) are registered and made available for use in your chats.

Expand Down
Loading