microsoft · vnbaaij · Apr 17, 2025 · Apr 17, 2025 · Apr 17, 2025 · Apr 17, 2025
@@ -1,4 +1,4 @@
-# Microsoft Fluent UI Blazor components
+# Microsoft Fluent UI Blazor library
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 [![.NET C#](https://img.shields.io/badge/.NET-C%23-blue)](https://docs.microsoft.com/en-us/dotnet/csharp/)
@@ -14,7 +14,7 @@ This package is for use in .NET 8 and 9 Blazor projects. If you are using **now
 
 ## Introduction
 
-The `Microsoft.FluentUI.AspNetCore` family of packages provides a set of [Blazor](https://blazor.net) components, tools and utilities which are used to build applications that have a Fluent design (i.e. have the look and feel of modern Microsoft applications). 
+The `Microsoft.FluentUI.AspNetCore` family of packages provides a set of Razor components for [Blazor](https://blazor.net) applications, tools and utilities which are used to build applications that have a Fluent design (i.e. have the look and feel of modern Microsoft applications). 
 
 Some of the components in the library are wrappers around Microsoft's official Fluent UI Web Components. Others are components that leverage the Fluent Design System or make it easier to work with Fluent. To get up and running with the library, see the **Getting Started** section below.
 
@@ -120,7 +120,7 @@ We have additional packages available that include the complete Fluent UI System
 Please refer to the [Icons and Emoji](https://www.fluentui-blazor.net/IconsAndEmoji) page for more information.
 
 ## Usage
-With the package installed, you can begin using the Fluent UI Blazor components in the same way as any other Blazor component. 
+With the package installed, you can begin using the Fluent UI Blazor library components in the same way as any other Razor component. 
 
 ### Add Imports
 
@@ -131,7 +131,7 @@ After the package is added, you need to add the following in your  `_Imports.raz
 ```
 
 ### Quick Start
-This is literally all you need in your views to use Fluent UI Blazor components.
+This is literally all you need in your views to use Fluent UI Blazor library in your application.
 
 ```xml
 <FluentCard>
@@ -141,7 +141,7 @@ This is literally all you need in your views to use Fluent UI Blazor components.
 ```
 
 ## Configuring the Design System
-The Fluent UI Blazor components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
+The Fluent UI Razor components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
 maintaining accessibility. This is accomplished through setting various "design tokens". The library exposes all design tokens, which you can use both from code as in a declarative way in your `.razor` pages. The different ways of working with design tokens are described in the [design tokens](https://www.fluentui-blazor.net/DesignTokens) page.
 
 ## Blazor Hybrid
@@ -171,7 +171,7 @@ Please see the [DataGrid](https://www.fluentui-blazor.net/DataGrid) page for mor
 
 
 ## Additional resources
-* The Microsoft Fluent UI Blazor components [documentation and demo site](https://www.fluentui-blazor.net)
+* The Microsoft Fluent UI Blazor library [documentation and demo site](https://www.fluentui-blazor.net)
 
 ## Support
 The Microsoft Fluent UI Blazor library is an open source project and is **not** an official part of ASP.NET Core, which means it’s **not** officially

@@ -4,7 +4,7 @@
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="description" content="Microsoft Fluent UI Blazor components library. For use with ASP.NET Core Blazor applications">
+    <meta name="description" content="Microsoft Fluent UI Blazor library. For use with ASP.NET Core Blazor applications">
     <meta name="keywords" content="Blazor, Fluent UI, demo, components, Microsoft, asp.net core, fluentui">
     <title>Fluent UI Blazor Documentation & Demo site</title>
     <base href="/" />

@@ -7,7 +7,7 @@
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="description" content="Microsoft Fluent UI Blazor components library. For use with ASP.NET Core Blazor applications">
+    <meta name="description" content="Microsoft Fluent UI Blazor library. For use with ASP.NET Core Blazor applications">
     <meta name="keywords" content="Blazor, Fluent UI, demo, components, Microsoft, asp.net core, fluentui">
     <title>Fluent UI Blazor Demo site</title>
     <base href="~/" />

@@ -1,9 +1,13 @@
+// ------------------------------------------------------------------------
+// MIT License - Copyright (c) Microsoft Corporation. All rights reserved.
+// ------------------------------------------------------------------------
+
 namespace FluentUI.Demo.Shared;
 public partial class App
 {
     public static string PageTitle(string page)
     {
-        return $"{page} - FluentUI Blazor Components";
+        return $"{page} - Fluent UI Blazor library";
     }
 
     public const string MESSAGES_NOTIFICATION_CENTER = "NOTIFICATION_CENTER";

@@ -163,7 +163,7 @@
 <p>
     Technically, this <b>loading-theme</b> component adds a <b>hidden-body</b> class
     (<code>visibility: hidden; background-color: #272727;</code>) to the <b>body</b> tag during the loading time
-    of all FluentUI Blazor components.
+    of all FluentUI components.
     Once they are integrated into the browser, this class is removed and the content is displayed.
 </p>
 

@@ -10,7 +10,7 @@
 
 <h2>FluentComponentBase</h2>
 <p>
-    <code>FluentComponentBase</code> is the abstract base class all other Fluent UI Blazor components inherit from.
+    <code>FluentComponentBase</code> is the abstract base class all other Fluent UI Razor components inherit from.
 </p>
 <p>You can <b>not</b> create or use a <code>FluentComponentBase</code> on a page or in another component but it adds the following parameters to every derived component.<br /><br />
 <em>These parameters are not shown in the component overviews of the derived components pages</em>

@@ -5,7 +5,7 @@
 <h1>FluentInputBase&lt;TValue&gt;</h1>
 
 <p>
-    <code>FluentInputBase&lt;TValue&gt;</code> is the abstract base class all Fluent UI input handling Blazor components inherit from.
+    <code>FluentInputBase&lt;TValue&gt;</code> is the abstract base class all Fluent UI input handling components inherit from.
 </p>
 <p>
     You can <b>not</b> create or use a <code>FluentInputBase&lt;TValue&gt;</code> on a page or in another component but it adds

@@ -105,21 +105,21 @@
 
 <h2>Binding</h2>
 <p>
-    The Fluent UI Blazor input components all support binding, just like the standard Blazor input components do. See the
+    The Fluent UI input components all support binding, just like the standard Blazor input components do. See the
     <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/binding?view=aspnetcore-8.0">documentation</a> on the Learn site
     for more information.
 </p>
 
 <h2>Validation</h2>
 <p>
-    The Fluent UI Blazor input components work with validation in the same way the standard Blazor input components do. We provide 2 extra
+    The Fluent UI input components work with validation in the same way the standard Blazor input components do. We provide 2 extra
     components to make it possible to show validation messages which follow the Fluent Design guidelines:
     <ul>
         <li><code>FluentValidationSummary</code></li>
         <li><code>FluentValidationMessage</code></li>
     </ul>
     See the <a href="https://learn.microsoft.com/en-us/aspnet/core/blazor/forms/validation?view=aspnetcore-8.0">documentation</a> on the Learn site
-    for more information on the standard components. As the Fluent UI Blazor components are based on the standard components, the same documentation applies.
+    for more information on the standard components. As the Fluent UI Razor components are based on the standard components, the same documentation applies.
 </p>
 <p>
 

@@ -9,7 +9,7 @@
     <FluentGridItem xs="12" sm="12" md="6">
         <h1>Welcome!</h1>
         <p>
-            The Fluent UI Blazor library provides a robust and extensive set of <a href="https://blazor.net">Blazor</a> components. Some of those
+            The Fluent UI Blazor library provides a robust and extensive set of Razor components for <a href="https://blazor.net">Blazor</a> applications. Some of those
             components are  wrappers around Microsoft's official Fluent UI Web Components. Others are components that leverage the <a href="https://fluent2.microsoft.design/">Fluent Design System</a>
             or just make it easier to work with Fluent in general.
         </p>
@@ -69,7 +69,7 @@
         </p>
         <h3>Manual setup</h3>
         <p>
-            To start using the Fluent UI Blazor components from scratch, you first need to install the main <a href="https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/">Nuget package</a>
+            To start using the Fluent UI Blazor library from scratch, you first need to install the main <a href="https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/">NuGet package</a>
             in the project you want to use the components. You can use the NuGet package manager in your IDE for that or use the following command when using a CLI:
         </p>
         <CodeSnippet>dotnet add package Microsoft.FluentUI.AspNetCore.Components</CodeSnippet>
@@ -83,7 +83,7 @@
     <FluentGridItem xs="12" sm="12" md="6">
         <h3>Scripts</h3>
         <p>
-            As mentioned, we wrap the Fluent UI Web Components for some of our compnents. The needed script is included in the library and will
+            As mentioned, we wrap the Fluent UI Web Components for some of our components. The needed script is included in the library and will
             be loaded for you automatically by using Blazor's built-in capabilities. You do not need to download or pull the script from a CDN manually.
         </p>
        <p>
@@ -107,8 +107,8 @@
     </FluentGridItem>
 
     <FluentGridItem xs="12" sm="12" md="8" >
-        <h2 id="using-the-fluentui-web-components">Using the Fluent UI Blazor components</h2>
-        <p>With the package installed, you can begin using the Fluent UI Blazor components in the same way as any other Blazor component. Just be sure to add the following using statement to your views:</p>
+        <h2 id="using-the-fluentui-web-components">Using the Fluent UI Blazor library</h2>
+        <p>With the package installed, you can begin using the components from the Fluent UI Blazor library in the same way as any other Razor component. Just be sure to add the following using statement to your views:</p>
         <CodeSnippet>@@using Microsoft.FluentUI.AspNetCore.Components</CodeSnippet>
 
 
@@ -149,7 +149,7 @@
         </p>
         <h2 id="configuring-the-design-system">Configuring the Design System</h2>
         <p>
-            The Fluent UI Blazor components are built on FAST's Adaptive UI technology, which enables design customization and personalization, while
+            The Fluent UI Razor components are using FAST's Adaptive UI technology, which enables design customization and personalization, while
             automatically maintaining accessibility. This is accomplished through setting various &quot;Design Tokens&quot;.
         </p>
         <p>

@@ -23,7 +23,7 @@ dotnet new fluentblazorwasm --name MyApplication
 When using Visual Studio, you can also use the **New Project** dialog to create a new project. The templates will be available under the **Blazor** category.
 
 ### Manual Install
-To start using the **Fluent UI Blazor components** from scratch, you first need to install the main [Nuget package](https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/) in the project you want to use the library and its components.
+To start using the **Fluent UI** library and Razor components from scratch, you first need to install the main [NuGet package](https://www.nuget.org/packages/Microsoft.FluentUI.AspNetCore.Components/) in the project you want to use the library and its components.
 You can use the NuGet package manager in your IDE or use the following command when using a CLI:
 
 ```shell
@@ -123,7 +123,7 @@ We have additional packages available that include the complete **Fluent UI Syst
 Please refer to the [Icons and Emoji](https://www.fluentui-blazor.net/IconsAndEmoji) page for more information.
 
 ## Usage
-With the package installed, you can begin using the **Fluent UI Blazor components** in the same way as any other Blazor component. 
+With the package installed, you can begin using the **Fluent UI** Razor components in the same way as any other Razor component. 
 
 ### Add Imports
 
@@ -134,7 +134,7 @@ After the package is added, you need to add the following in your  `_Imports.raz
 ```
 
 ### Quick Start
-This is literally all you need in your views to use Fluent UI Blazor components.
+This is literally all you need in your views to use Fluent UI library components in your Blazor application.
 
 ```xml
 <FluentCard>
@@ -144,7 +144,7 @@ This is literally all you need in your views to use Fluent UI Blazor components.
 ```
 
 ## Configuring the Design System
-The **Fluent UI Blazor** components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
+The **Fluent UI** library components are built on FAST's (Adaptive UI) technology, which enables design customization and personalization, while automatically
 maintaining accessibility. This is accomplished through setting various "design tokens". The library exposes all design tokens, which you can use both from code as in a declarative way in your `.razor` pages. The different ways of working with design tokens are described in the [design tokens](https://www.fluentui-blazor.net/DesignTokens) page.
 
 ### For Right-To-Left languages

@@ -1,6 +1,6 @@
 ## Design Token support
 
-The Fluent UI Blazor Components enable design customization and personalization, while automatically maintaining accessibility. This is
+The Fluent UI library's components enable design customization and personalization, while automatically maintaining accessibility. This is
 accomplished through setting various "Design Tokens". In total there are over 160 distinct design tokens defined in the library and you can
 use all of these from Blazor, both from C# code as in a declarative way in your `.razor` pages.
 
@@ -9,7 +9,7 @@ information on how Design Tokens are implemented in the web components script.
 
 ## Styling web components with Design Tokens
 
-Many of the Fluent UI Blazor components wrap the web components which are designed to be stylistically flexible, allowing dramatic changes to visual design with minimal code changes. This is possible through the extensive use of Design Tokens and an [adaptive color system](#adaptive-color-system).
+Many of the Fluent UI library components wrap the web components which are designed to be stylistically flexible, allowing dramatic changes to visual design with minimal code changes. This is possible through the extensive use of Design Tokens and an [adaptive color system](#adaptive-color-system).
 
 ### Fluent UI Web Components Design Tokens
 

@@ -1,14 +1,14 @@
 # Setup your project to use Fluent UI Icons and/or Emoji assets
 
-The Fluent UI Icons and Emoji's are available as a separate Nuget package. This is done to keep the size of the main library as small as possible.
+The Fluent UI Icons and Emoji's are available as a separate NuGet package. This is done to keep the size of the main library as small as possible.
 If you do not want to use icons and/or emoji in your project, you do not need to install these packages.
 
 >**If you are upgrading from a previous version of the library, please see the [Upgrade Guide](https://www.fluentui-blazor.net/UpgradeGuide) for more information.**
 
 ## Getting Started with icons
 
 To start using the **Fluent UI System Icons**, you will need 
-to install the official [Nuget package](https://www.nuget.org/packages/Microsoft.Fast.Components.FluentUI.Icons/)
+to install the official [NuGet package](https://www.nuget.org/packages/Microsoft.Fast.Components.FluentUI.Icons/)
 in the project you would like to use the library and components. You can use the following command:
 
 ```shell
@@ -23,7 +23,7 @@ To use the icons, you will need to add the following using statement to your `_I
 @using Microsoft.Fast.Components.FluentUI
 ```
 
-Then you can use the icons in your Blazor components like this:
+Then you can use the icons in your Blazor application like this:
 
 > **Note:** Names are structured as follows: `Icons.[IconVariant].[IconSize].[IconName]`.
 
@@ -55,7 +55,7 @@ To use the emoji's, you will need to add the following using statement to your `
 @using Microsoft.Fast.Components.FluentUI
 ```
 
-Then you can use the emoji's in your Blazor components like this:
+Then you can use the emoji's in your Blazor application like this:
 
 > **Note:** Names are structured as follows: `Emojis.[EmojiGroup].[EmojiStyle].[EmojiSkintone].[EmojiName]`.
 
@@ -69,4 +69,4 @@ Then you can use the emoji's in your Blazor components like this:
 Please see the [Code Setup](https://www.fluentui-blazor.net/CodeSetup) page to lean more about the neccesary changes to your `Program.cs` file.
 
 ## Can I include the library in a Razor Class Library (RCL) project?
-Yes, it should work without any changes to your project.
+Yes, it should work without any changes to your project.
@@ -5,7 +5,7 @@ To make it easier to start a project that uses the Fluent UI Web Components for
 - Fluent .NET Aspire Starter app
 
 
-All of these templates mimic their standard Blazor template counterpart but have the Fluent UI Blazor components already fully set up. If you choose to add sample pages when creating a project, all components have been replaced with Fluent UI components (and a few extra have been added). All Bootstrap styling is removed of course as well.
+All of these templates mimic their standard Blazor template counterpart but have the Fluent UI Blazor library already fully set up. If you choose to add sample pages when creating a project, all components have been replaced with Fluent UI components (and a few extra have been added). All Bootstrap styling is removed of course as well.
 
 If you want to use the Icon component with applications based on the templates, we have already included and set up the Icon package for you. The full collection of approximately 12 thousand icons in different variants and sizes can be browsed and searched from the [Icon](https://www.fluentui-blazor.net/Icon) page.
 

@@ -1,4 +1,4 @@
-## V3.2.2
+## V3.2.2
 - Fix [#859](https://github.com/microsoft/fluentui-blazor/issues/859) and [#884](https://github.com/microsoft/fluentui-blazor/issues/859): Fix NavMenu for real by moving `<a>` tag up in the rendering tree
 
 ### Update Fluent UI System icons to 1.1.221
@@ -535,7 +535,7 @@ unpredictable results.
 
 > **If you are upgrading from an earlier version please remove the script from your `index.html` or `_Layout.cshtml` file.**
 
-We made this change to make certain you'll always get the version of the script that works best with the Blazor components. It also eliminates the risk of having
+We made this change to make certain you'll always get the version of the script that works best with our components. It also eliminates the risk of having
 multiple versions of the script being used on a page. On top of all this, it also makes installation of the package in your new projects easier.
 
 ## Readme and docs updates