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
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,5 +4,5 @@ This is the GitHub repository for the technical product documentation for Syncfu

## Contributions Welcome!

We welcome the [pull request](https://docs.github.com/en/github/managing-files-in-a-repository/editing-files-in-another-users-repository) for improving the Blazor Components user guide documentation. Your contribution towards this will be greatly appreciated.
We welcome the [pull request](https://docs.github.com/en/repositories/working-with-files/managing-files/editing-files) for improving the Blazor Components user guide documentation. Your contribution towards this will be greatly appreciated.

Original file line number Diff line number Diff line change
Expand Up @@ -75,4 +75,4 @@ The instructions below assist you in creating **Syncfusion Blazor Applications**

9. The Syncfusion® Blazor application configures with most recent Syncfusion® Blazor NuGet packages version, selected style, namespaces, selected authentication, and component render code for Syncfusion® components.

10. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/license-key#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [UG](https://blazor.syncfusion.com/documentation/getting-started/license-key/overview) topic for understanding the licensing details in Essential Studio® for Blazor.
10. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [UG](https://blazor.syncfusion.com/documentation/getting-started/license-key/overview) topic for understanding the licensing details in Essential Studio® for Blazor.
Original file line number Diff line number Diff line change
Expand Up @@ -69,4 +69,4 @@ The steps below will assist you to create your **Syncfusion® Blazor Application

7. The Syncfusion® Blazor application configures with most recent Syncfusion® Blazor NuGet packages version, selected style, namespaces, selected authentication, and component render code for Syncfusion® components.

8. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for understanding the licensing changes introduced in Essential Studio®.
8. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2) post for understanding the licensing changes introduced in Essential Studio®.
Original file line number Diff line number Diff line change
Expand Up @@ -54,4 +54,4 @@ The instructions below assist you in creating **Syncfusion Blazor Applications**

9. The Syncfusion® Blazor application configures with most recent Syncfusion® Blazor NuGet packages version, selected style, namespaces, selected authentication, and component render code for Syncfusion® components.

10. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/license-key#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [UG](https://blazor.syncfusion.com/documentation/getting-started/license-key/overview) topic for understanding the licensing details in Essential Studio® for Blazor.
10. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [UG](https://blazor.syncfusion.com/documentation/getting-started/license-key/overview) topic for understanding the licensing details in Essential Studio® for Blazor.
Original file line number Diff line number Diff line change
Expand Up @@ -49,4 +49,4 @@ The steps below will assist you to create your **Syncfusion® Blazor Application

7. The Syncfusion® Blazor application configures with most recent Syncfusion® Blazor NuGet packages version, selected style, namespaces, selected authentication, and component render code for Syncfusion® components.

8. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for understanding the licensing changes introduced in Essential Studio®.
8. If you installed the trial setup or NuGet packages from nuget.org you must register the Syncfusion® license key to your application since Syncfusion® introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio® release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key) to generate and register the Syncfusion® license key to your application. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2) post for understanding the licensing changes introduced in Essential Studio®.
2 changes: 1 addition & 1 deletion blazor/agentic-ui-builder.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ Before installing Blazor UI Builder, ensure the following:
| **Microsoft .NET SDK 8.0 or later** | .NET CLI tools installed |
| **Node.js version 18 or later** | npm package manager installed |
| **Agent Package Manager (APM)** | Agent Package Manager installed. [Installation Guidelines](https://microsoft.github.io/apm/quickstart/#1-install-apm) |
| **Syncfusion License** | [Commercial](https://www.syncfusion.com/sales/unlimitedlicense), [Free Community](https://www.syncfusion.com/products/communitylicense), or [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials) |
| **Syncfusion License** | [Commercial](https://www.syncfusion.com/sales/pricing?category=ui-components), [Free Community](https://www.syncfusion.com/products/communitylicense), or [Free Trial](https://www.syncfusion.com/account/manage-trials/start-trials) |
| **Supported AI Agent / IDE** | A supported AI agent or IDE that integrates with Skills (VS Code, Cursor, Syncfusion® Code Studio, etc.)

## Key Benefits
Expand Down
4 changes: 2 additions & 2 deletions blazor/appearance/dynamic-theme-switching.md
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@ Include the `ThemeSwitcher` component in your `~/Components/Layout/MainLayout.ra
<div class="theme-switcher">
<ThemeSwitcher />
</div>
<a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
<a href="https://learn.microsoft.com/en-us/aspnet/core/?view=aspnetcore-10.0" target="_blank">About</a>
</div>

<article class="content px-4">
Expand Down Expand Up @@ -278,7 +278,7 @@ Modify your `~/Layout/MainLayout.razor` file to include the theme switcher dropd
<DropDownListEvents TItem="ThemeDetails" TValue="string" ValueChange="OnThemeChange"></DropDownListEvents>
</SfDropDownList>
</div>
<a href="https://learn.microsoft.com/aspnet/" target="_blank">About</a>
<a href="https://learn.microsoft.com/en-us/aspnet/core/?view=aspnetcore-10.0" target="_blank">About</a>
</div>

<article class="content px-4">
Expand Down
8 changes: 4 additions & 4 deletions blazor/appearance/figma.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ documentation: ug

# Figma UI Kits for Blazor Components with Design Tokens

Syncfusion<sup style="font-size:70%">&reg;</sup> provides [Figma UI kits](https://www.figma.com/@syncfusion) to streamline collaboration between designers and developers. The kits match the themes used by [Blazor components](https://www.syncfusion.com/blazor-components) and are available for [Material 3](https://www.figma.com/community/file/1454123774600129202/syncfusion-ui-kit-material-3-theme), [Fluent](https://www.figma.com/community/file/1385969120047188707/syncfusion-ui-kit-fluent-theme), [Tailwind](https://www.figma.com/community/file/1385969065626384098/syncfusion-ui-kit-tailwind-theme), and [Bootstrap 5](https://www.figma.com/community/file/1385968977953858272/syncfusion-ui-kit-bootstrap-5-theme).
Syncfusion<sup style="font-size:70%">&reg;</sup> provides [Figma UI kits](https://www.figma.com/@syncfusion) to streamline collaboration between designers and developers. The kits match the themes used by [Blazor components](https://www.syncfusion.com/blazor-components) and are available for [Material 3](https://www.figma.com/community/file/1454123774600129202/syncfusion-ui-kit-material-3-theme), [Fluent](https://www.figma.com/community/file/1385969120047188707/syncfusion-web-ui-kit-fluent-theme), [Tailwind](https://www.figma.com/community/file/1385969065626384098/syncfusion-web-ui-kit-tailwind-theme), and [Bootstrap 5](https://www.figma.com/community/file/1385968977953858272/syncfusion-web-ui-kit-bootstrap-5-theme).

Each kit contains reusable design components with states and variants, along with detailed figures, measurements, and icons that represent Blazor components.

Expand All @@ -28,9 +28,9 @@ The Figma UI kits offer the following advantages:
The Figma UI kits are available in the [Figma community](https://www.figma.com/@syncfusion). Download the theme-specific kits from the following links:

- [Material 3](https://www.figma.com/community/file/1454123774600129202/syncfusion-ui-kit-material-3-theme)
- [Fluent](https://www.figma.com/community/file/1385969120047188707/syncfusion-ui-kit-fluent-theme)
- [Tailwind](https://www.figma.com/community/file/1385969065626384098/syncfusion-ui-kit-tailwind-theme)
- [Bootstrap 5](https://www.figma.com/community/file/1385968977953858272/syncfusion-ui-kit-bootstrap-5-theme)
- [Fluent](https://www.figma.com/community/file/1385969120047188707/syncfusion-web-ui-kit-fluent-theme)
- [Tailwind](https://www.figma.com/community/file/1385969065626384098/syncfusion-web-ui-kit-tailwind-theme)
- [Bootstrap 5](https://www.figma.com/community/file/1385968977953858272/syncfusion-web-ui-kit-bootstrap-5-theme)

## Structure of the UI kits

Expand Down
2 changes: 1 addition & 1 deletion blazor/appearance/themes.md
Original file line number Diff line number Diff line change
Expand Up @@ -1013,7 +1013,7 @@ Below table lists the importing theme path for the individual components.

### Download customized styles using Custom Resource Generator (CRG)

1. Download the minified styles for the required components from the [CRG](https://blazor.syncfusion.com/crg) site. Learn more about CRG in the [help documentation](https://blazor.syncfusion.com/documentation/common/custom-resource-generator).
1. Download the minified styles for the required components from the [CRG](https://blazor.syncfusion.com/crg/) site. Learn more about CRG in the [help documentation](https://blazor.syncfusion.com/documentation/common/custom-resource-generator).

2. Unzip the downloaded file. It contains the styles of the selected components and an `import.json` file that stores the current settings.

Expand Down
8 changes: 4 additions & 4 deletions blazor/common/accessibility.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ The accessibility of the components consists of the following standards and aspe

[Section 508](https://www.section508.gov/) - U.S. federal standards for making electronic and information technology accessible, aligned with WCAG.

[WAI-ARIA](https://www.w3.org/WAI/ARIA/) - Roles, states, and properties that enhance accessibility of dynamic web content and applications for assistive technologies.
[WAI-ARIA](https://www.w3.org/WAI/about/groups/ariawg/) - Roles, states, and properties that enhance accessibility of dynamic web content and applications for assistive technologies.

[Keyboard navigation](https://www.w3.org/TR/WCAG22/#keyboard-accessible) - The ability to use a keyboard to interact with and navigate a user interface.

Expand All @@ -43,13 +43,13 @@ The [WAI-ARIA patterns](https://www.w3.org/WAI/ARIA/apg/patterns/) are followed

Each Blazor component is evaluated with manual screen reader testing and automated tests to ensure required attributes and behaviors are present.

Attributes are assigned and updated correctly during interaction. Each component has an appropriate `role` and ARIA attributes defined by the [WCAG 2.2](https://www.w3.org/TR/WCAG22/) specification.
Attributes are assigned and updated correctly during interaction. Each component has an appropriate `role` and ARIA attributes defined by the [WCAG 2.2](https://www.w3.org/WAI/about/groups/ariawg/) specification.

In addition to the methodologies mentioned above, Blazor components are constructed to support the following accessibility aspects.

### Screen reader support

Blazor components follow [WAI-ARIA](https://www.w3.org/WAI/ARIA/) to work properly with screen readers such as [Narrator](https://support.microsoft.com/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c172f109bdb1) for Windows and [VoiceOver](https://support.apple.com/guide/voiceover/vo2706/mac) for macOS.
Blazor components follow [WAI-ARIA](https://www.w3.org/WAI/about/groups/ariawg/) to work properly with screen readers such as [Narrator](https://support.microsoft.com/en-US/accessibility/windows/narrator/complete-guide-to-narrator) for Windows and [VoiceOver](https://support.apple.com/en-in/guide/voiceover/vo2706/mac) for macOS.

### Right-to-left support

Expand All @@ -73,7 +73,7 @@ Ensuring the accessibility of Blazor components is crucial for making the produc

* **Automated testing**: Accessibility is validated using [axe-core](https://www.nuget.org/packages/Deque.AxeCore.Playwright) with Playwright tests.

* **Manual testing**: Manual evaluation using screen readers such as [Narrator](https://support.microsoft.com/windows/complete-guide-to-narrator-e4397a0d-ef4f-b386-d8ae-c172f109bdb1) for Windows and [VoiceOver](https://support.apple.com/guide/voiceover/vo2706/mac) for macOS.
* **Manual testing**: Manual evaluation using screen readers such as [Narrator](https://support.microsoft.com/en-US/accessibility/windows/narrator/complete-guide-to-narrator) for Windows and [VoiceOver](https://support.apple.com/en-in/guide/voiceover/vo2706/mac) for macOS.

Blazor components continually improve based on standards updates and user feedback to enhance accessibility.

Expand Down
2 changes: 1 addition & 1 deletion blazor/common/adding-script-references.md
Original file line number Diff line number Diff line change
Expand Up @@ -372,7 +372,7 @@ The following table lists components and their script file names.

## Custom Resource Generator

Blazor provides an option to generate component interop scripts using the [Custom Resource Generator](https://blazor.syncfusion.com/crg) (CRG) tool. Learn how to [generate component-wise scripts using CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator).
Blazor provides an option to generate component interop scripts using the [Custom Resource Generator](https://blazor.syncfusion.com/crg/) (CRG) tool. Learn how to [generate component-wise scripts using CRG](https://blazor.syncfusion.com/documentation/common/custom-resource-generator).

## See also

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -353,7 +353,7 @@ N> This example uses Bootstrap classes (`d-flex`, `ms-auto`, `gap-3`). If your p

<main>
<div class="top-row px-4 d-flex align-items-center">
<a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
<a href="https://learn.microsoft.com/en-us/aspnet/core/?view=aspnetcore-10.0" target="_blank">About</a>

<div class="ms-auto d-flex gap-3">
<AuthorizeView>
Expand Down
2 changes: 1 addition & 1 deletion blazor/common/authentication/blazor-aws-cognito.md
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,7 @@ var app = builder.Build();
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error");
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
// The default HSTS value is 30 days. You may want to change this for production scenarios, see https://learn.microsoft.com/en-us/aspnet/core/security/enforcing-ssl?view=aspnetcore-10.0&viewFallbackFrom=aspnetcore-2.1&tabs=visual-studio%2Clinux-ubuntu#http-strict-transport-security-protocol-hsts.
app.UseHsts();
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -251,7 +251,7 @@ To make the login and logout actions available throughout the application, add t
....
<main>
<div class="top-row px-4 d-flex justify-content-between align-items-center">
<a href="https://learn.microsoft.com/aspnet/core/" target="_blank">About</a>
<a href="https://learn.microsoft.com/en-us/aspnet/core/?view=aspnetcore-10.0" target="_blank">About</a>
<LoginDisplay />
</div>

Expand Down
2 changes: 1 addition & 1 deletion blazor/common/best-practices.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ To reduce CSS payload and improve rendering speed, use optimized CSS themes that

## Lazy loading in Blazor WebAssembly App

If using a Blazor WebAssembly App, implement lazy loading to reduce initial load time. See [WebAssembly lazy load assemblies](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-lazy-load-assemblies) and the Syncfusion blog on [lazy loading Blazor assemblies](https://www.syncfusion.com/blogs/post/lazy-loading-syncfusion-blazor-assemblies-in-a-blazor-webassembly-application.aspx).
If using a Blazor WebAssembly App, implement lazy loading to reduce initial load time. See [WebAssembly lazy load assemblies](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-lazy-load-assemblies) and the Syncfusion blog on [lazy loading Blazor assemblies](https://www.syncfusion.com/blogs/post/lazy-loading-syncfusion-blazor-assemblies-in-a-blazor-webassembly-application).

## Use PreventRender in Blazor WebAssembly App

Expand Down
Loading