This example demonstrates the filtering capabilities of the Blazor MultiColumn ComboBox. Users can type in the ComboBox to filter and narrow down the list of items across multiple columns, making it easier to find specific entries.
+The MultiColumn ComboBox supports filtering, which allows users to search for and select items by typing keywords. The available items are dynamically filtered based on the input, ensuring quick access to the desired data.
+See also
+ +
+
+
+@code {
+ public class Employee
+ {
+ public string Name { get; set; }
+ public string Department { get; set; }
+ public string Role { get; set; }
+ public string Location { get; set; }
+ public int Experience { get; set; }
+ }
+
+ private string Value { get; set; } = "Alice Johnson";
+
+ private List
+
+
+
+
+
+
+
+
+
+
+ Properties
+
+
+
+
+
+ This example demonstrates how the Blazor MultiColumn ComboBox can be integrated within a form using the EditForm component. This allows the ComboBox to be used in data entry scenarios, where it can be validated and managed as part of a form submission process.
+The MultiColumn ComboBox supports form integration, enabling it to work seamlessly within an EditForm. In this example, the ComboBox is placed inside an EditForm, allowing it to participate in form validation and data binding. This feature is particularly useful for creating data entry forms where the ComboBox needs to be validated and its values submitted as part of the form.
+See also
+ +
+
+
+
+@code {
+ public Product ProductModel = new Product();
+
+ public class Product
+ {
+ [Required(ErrorMessage = "Please select a product")]
+ public string Name { get; set; }
+ public decimal Price { get; set; }
+ public string Availability { get; set; }
+ public string Category { get; set; }
+ public double Rating { get; set; }
+ }
+
+ private List
+ @if (string.IsNullOrEmpty(Message))
+ {
+
+
+ }
+ else
+ {
+
+
+
+
+
+
+
+ Submit
+
+
+ @Message
+
+ }
+ This example demonstrates the grouping feature of the Blazor MultiColumn ComboBox. Grouping allows you to categorize items within the ComboBox, making it easier to navigate and select related options.
+The MultiColumn ComboBox supports grouping, which organizes the list items into logical categories. This feature enhances user experience by structuring related items together, enabling quicker selection and better data organization.
+See also
+ +
+
+
+@code {
+
+ public class Product
+ {
+ public string Name { get; set; }
+ public decimal Price { get; set; }
+ public string Availability { get; set; }
+ public string Category { get; set; }
+ public double Rating { get; set; }
+ }
+
+ private List
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This example demonstrates the keyboard navigation capabilities of the Blazor MultiColumn ComboBox. Users can interact with the ComboBox using only the keyboard, providing an accessible and efficient way to navigate through the list and select items.
+The MultiColumn ComboBox supports comprehensive keyboard navigation, allowing users to perform all interactions without a mouse. You can open the dropdown, navigate through items, select an option, and close the dropdown using standard keyboard keys. This feature enhances accessibility and improves the user experience for keyboard-centric users.
+MultiColumn ComboBox supports the below keyboard actions
+ Focus +-
+
- + Alt + J + - Focuses on the first component of the sample. + +
-
+
- + Alt + Down arrow + - Opens the popup list. + +
- + Alt + Up arrow + - Closes the popup list. + +
- + Home + - Cursor moves before the first character in the input. + +
- + End + - Cursor moves next to the last character in the input. + +
- + Tab + + - Focuses on the next Tab Index element on the page. + + +
- + Shift + Tab + + - Focuses on the previous Tab Index element on the page. + + +
-
+
- + Enter + - Selects the focused item, and when it is in an open state the popup list closes. + +
-
+
- + Down arrow + + - Selects the first item in the ComboBox when no item is + selected. Otherwise, selects the item next to the currently selected item. + + +
- + Up arrow + - Selects the item previous to the currently selected one. + +
- + Esc + + - Closes the popup list when it is in an open state and the + currently selected item remains the same. + + +
+
+
+@code {
+ public class Product
+ {
+ public int ProductID { get; set; }
+ public string ProductName { get; set; }
+ public decimal UnitPrice { get; set; }
+ public int UnitsInStock { get; set; }
+ }
+
+ private List
+
+
+This example demonstrates the paging feature of the Blazor MultiColumn ComboBox. The ComboBox can display a large dataset efficiently by dividing it into pages, allowing users to navigate through items without performance degradation.
+The MultiColumn ComboBox supports paging, enabling users to manage large data sets by navigating through different pages. This feature improves load times and maintains performance when dealing with extensive lists.
+See also
+ +
+
+
+@code {
+ public int PageSize { get; set; } = 4;
+ public int PageCount { get; set; }= 5;
+
+ public class Service
+ {
+ public string Name { get; set; }
+ public string Icon { get; set; }
+ public string Description { get; set; }
+ public string Price { get; set; }
+ public double Rating { get; set; }
+ }
+
+ private IEnumerable
+
+
+
+
+
+
+
+
+
+
+ Properties
+
+
+
+
+
+
+ This example demonstrates the remote data binding capabilities of the MultiColumn ComboBox. Select an item from the suggestion list by interacting with the component. Upon initial selection, a loading icon appears while the data is retrieved from the server.
+
+ The MultiColumn ComboBox can load data from either local sources or remote services using the DataSource property. Supported data types include Array, ObservableCollection, ExpandoObject, DynamicObject, and DataManager.
+
+ The DataManager acts as an intermediary between the service endpoint and the MultiColumn ComboBox, requiring minimal setup to connect effectively. +
+-
+
- DataManager.Url - Specifies the service endpoint for data retrieval. +
-
+
+ DataManager.Adaptor - Determines the adaptor used, with
+ODataAdaptoras the default for remote binding. + Syncfusion.Blazor.Data provides various adaptors, including: +-
+
UrlAdaptor- For generic remote services.
+ ODataAdaptor- For OData endpoints.
+ ODataV4Adaptor- For OData V4 endpoints.
+ WebApiAdaptor- For Web APIs adhering to OData standards.
+ WebMethodAdaptor- For interacting with web methods.
+
+
The example below demonstrates the MultiColumn ComboBox bound to a customer data collection using DataManager.
See also
+ +
+
+
+@code {
+ public string EmployeeValue { get; set; } = "Andrew";
+
+ public Query RemoteQuery = new Query();
+
+ public class EmployeeData
+ {
+ public int EmployeeID { get; set; }
+ public string FirstName { get; set; }
+ public string LastName { get; set; }
+ public string Country { get; set; }
+ }
+}
+
+
diff --git a/Blazor-MAUI-Demos/Pages/DropDowns/MultiColumnComboBox/RowStyle.razor b/Blazor-MAUI-Demos/Pages/DropDowns/MultiColumnComboBox/RowStyle.razor
new file mode 100644
index 000000000..bb9f6b2b9
--- /dev/null
+++ b/Blazor-MAUI-Demos/Pages/DropDowns/MultiColumnComboBox/RowStyle.razor
@@ -0,0 +1,233 @@
+@page "/MultiColumn-ComboBox/RowStyle"
+
+@using Syncfusion.Blazor.MultiColumnComboBox
+
+@*Hidden:Lines*@
+@inherits SampleBaseComponent
+@*End:Hidden*@
+
+
+
+
+
+
+This example demonstrates how to customize row styles in the Blazor MultiColumn ComboBox. It showcases the use of vertical and horizontal grid lines along with alternative row styles to enhance the readability and appearance of the ComboBox's dropdown list.
++ The MultiColumn ComboBox supports extensive row customization through styles. Grid lines can be added both vertically and horizontally to clearly separate items and columns, making the list easier to navigate. Additionally, the alternative row style feature allows for different styles to be applied to even and odd rows, offering a visually distinct and appealing look that improves user experience. +
+See also
+ +
+
+
+@code {
+ public int PageSize { get; set; } = 3;
+
+ public int PageCount { get; set; }= 10;
+
+ public class Service
+ {
+ public string Name { get; set; }
+ public string Icon { get; set; }
+ public string Description { get; set; }
+ public string Price { get; set; }
+ public double Rating { get; set; }
+ }
+
+ private IEnumerable
+
+
+
+
+This example demonstrates the template capabilities of the Blazor MultiColumn ComboBox. Various templates such as column header, column content, NoRecords, and footer templates are used to customize the appearance and layout of the ComboBox.
++ The MultiColumn ComboBox allows for extensive customization through templates. The column header template lets you define custom headers for each column, while the column content template provides control over how the data is displayed within the columns. The NoRecords template displays a custom message or layout when no records match the search criteria, and the footer template enables you to add content at the bottom of the multi-column popup, such as additional instructions or summary information. +
+See also
+ +
+
+
+@code {
+ public class Employee
+ {
+ public string Name { get; set; }
+ public string Department { get; set; }
+ public string Role { get; set; }
+ public string Location { get; set; }
+ public int Experience { get; set; }
+ public int EmployeeID { get; set; }
+ }
+
+ private string Value { get; set; } = "Alice Johnson";
+
+ private List
+
+
+
+
+
+
+ @{
+ var EmployeeInfo = (context as Employee);
+
+
+
+
+
+ @{
+ var EmployeeInfo = (context as Employee);
+
+
+
+
+
+
+ images/multicolumn-combobox/employees/@(EmployeeInfo.EmployeeID).png)
+
+ }
+
+
+
+ Photo
+
+ @EmployeeInfo.Name
+ @EmployeeInfo.Role
+ }
+
+ This example demonstrates the TextWrap feature of the Blazor MultiColumn ComboBox, which specifies how words should break when reaching the end of a line, ensuring that content and headers wrap appropriately based on the specified wrapping options.
+The TextWrap feature of the Blazor MultiColumn ComboBox can be achieved by setting EnableTextWrap to true and configuring the TextWrapElement and TextOverflowMode enums to control how the content is displayed based on your preferences.
+-
+
Both- Wraps both the header and content.
+ Header- Wraps only the header.
+ Content- Wraps only the content.
+
TextWrapElement is an enum Defines the element where text wrapping is applied.
+-
+
-
+
Ellipsis- Displays an ellipsis (...) when the content overflows its area.
+ EllipsisWithTooltip- Displays an ellipsis (...) when the content overflows its area, and it also shows a tooltip on hover.
+
TextOverflowMode is an enum Defines truncates the cell content when it overflows its area.
+-
+
+
+
+@code {
+ public class Employee
+ {
+ public string Name { get; set; }
+ public string Position { get; set; }
+ public string Department { get; set; }
+ public decimal Salary { get; set; }
+ public double Rating { get; set; }
+ }
+ private List
+
+
+
+
+
+
+This example demonstrates the virtualization feature of the Blazor MultiColumn ComboBox. Virtualization optimizes the ComboBox by only rendering the items visible in the dropdown, allowing efficient handling of large datasets without performance issues.
+The MultiColumn ComboBox supports virtualization, which enhances performance by loading and displaying only the items currently in view. This feature is particularly useful when working with extensive data sets, ensuring smooth scrolling and quick interactions.
+See also
+ +
+
+
+@code {
+ public class Employee
+ {
+ public string Name { get; set; }
+ public string Department { get; set; }
+ public string Role { get; set; }
+ public string Location { get; set; }
+ public int Experience { get; set; }
+ }
+
+ private string Value { get; set; } = "Alice Johnson";
+
+ private List
+
+
+
+
++ This demo showcases the keyboard shortcuts applicable in the Rating component. +
+-
+
- + Tab + - Focus. + +
- + Left Arrow + - Increase in RTL and decrease in LTR. + +
- + Right Arrow + - Decrease in RTL and increase in LTR. + +
- + Down arrow + - Decreases the value. + +
- + Up arrow + - Increases the value. + +
+
+
+
+
+
diff --git a/Blazor-MAUI-Demos/wwwroot/data/word/markdown-to-word.md b/Blazor-MAUI-Demos/wwwroot/data/word/markdown-to-word.md
new file mode 100644
index 000000000..bb53c1a70
--- /dev/null
+++ b/Blazor-MAUI-Demos/wwwroot/data/word/markdown-to-word.md
@@ -0,0 +1,70 @@
+# A tour of the C\# language
+
+C\# (pronounced "See Sharp") is a modern, object\-oriented, and type\-safe programming language. C\# enables developers to build many types of secure and robust applications that run in .NET. C\# has its roots in the C family of languages and will be immediately familiar to C, C\+\+, Java, and JavaScript programmers. This tour provides an overview of the major components of the language in C\# 11 and earlier. If you want to explore the language through interactive examples, try the [introduction to C#](https://learn.microsoft.com/en-us/dotnet/csharp/tour-of-csharp/tutorials/) tutorials.
+
+Several C\# features help create robust and durable applications. [Garbage collection](https://learn.microsoft.com/en-us/dotnet/standard/garbage-collection/) automatically reclaims memory occupied by unreachable unused objects. [Nullable types](https://learn.microsoft.com/en-us/dotnet/csharp/nullable-references) guard against variables that don't refer to allocated objects. [Exception handling](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/exceptions/) provides a structured and extensible approach to error detection and recovery. [Lambda expressions](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/operators/lambda-expressions) support functional programming techniques. [Language Integrated Query (LINQ)](https://learn.microsoft.com/en-us/dotnet/csharp/linq/) syntax creates a common pattern for working with data from any source. Language support for [asynchronous operations](https://learn.microsoft.com/en-us/dotnet/csharp/programming-guide/concepts/async/) provides syntax for building distributed systems. C\# has a [unified type system](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/types/). All C\# types, including primitive types such as `int` and `double`, inherit from a single root `object` type. All types share a set of common operations. Values of any type can be stored, transported, and operated upon in a consistent manner. Furthermore, C\# supports both user\-defined [reference types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/reference-types) and [value types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types). C\# allows dynamic allocation of objects and in\-line storage of lightweight structures. C\# supports generic methods and types, which provide increased type safety and performance. C\# provides iterators, which enable implementers of collection classes to define custom behaviors for client code.
+
+# Hello world
+
+The "Hello, World" program is traditionally used to introduce a programming language. Here it is in C\#:
+```
+using System;
+class Hello
+{
+ static void Main()
+ {
+ Console.WriteLine("Hello, World");
+ }
+}
+```
+
+
+
+The "Hello, World" program starts with a `using` directive that references the `System` namespace. Namespaces provide a hierarchical means of organizing C\# programs and libraries. A `using` directive that references a given namespace enables unqualified use of the types that are members of that namespace. Because of the `using` directive, the program can use Console.WriteLine as shorthand for System.Console.WriteLine.
+
+The Hello `class` declared by the "Hello, World" program has a single member, the method named `Main`. The `Main` method is declared with the static modifier. By convention, a static method named `Main` serves as the entry point of a C\# program.
+
+The output of the program is produced by the `WriteLine` method of the `Console` class in the `System` namespace. This class is provided by the standard class libraries, which, by default, are automatically referenced by the compiler.
+
+# Types and variables
+
+AÂ *type*Â defines the structure and behavior of any data in C\#. The declaration of a type may include its members, base type, interfaces it implements, and operations permitted for that type. AÂ *variable*Â is a label that refers to an instance of a specific type.
+
+There are two kinds of types in C\#:Â
+
+1. Value types
+
+1. Reference types.
+
+## Value types
+
+C\#'s value types are further divided into *simple types*, *enum types*, *struct types*, *nullable value types*, and *tuple value types*.
+|Value types|Details|
+|:---|:---|
+|[Simple types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-types)|[Signed integral](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/integral-numeric-types), [unsigned integral](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/integral-numeric-types), [unicode characters](https://learn.microsoft.com/en-us/dotnet/standard/base-types/character-encoding-introduction), [IEEE binary floating-point](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/floating-point-numeric-types), [High-precision decimal floating-point](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/floating-point-numeric-types), and boolean. |
+|[Enum types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/enum)|User\-defined types of the form `enum E {...}`. An `enum` type is a distinct type with named constants. Every `enum` type has an underlying type, which must be one of the eight integral types. The set of values of an `enum` type is the same as the set of values of the underlying type.|
+|[Struct types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/struct)|User\-defined types of the form `struct S {...}`|
+|[Nullable value types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/nullable-value-types)|Extensions of all other value types with a `null` value|
+|[Tuple value types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/value-tuples)|User\-defined types of the form `(T1, T2, ...)`|
+
+
+## Reference types
+|Reference types|Details|
+|:---|:---|
+|[Class types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/class) |Ultimate base class of all other types: object. Unicode strings: string, which represents a sequence of UTF\-16 code units. User\-defined types of the form class C {...}|
+|[Interface types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/keywords/interface) |User\-defined types of the form interface I {...}|
+|[Array types](https://learn.microsoft.com/en-us/dotnet/csharp/programming-guide/arrays/) |Single\-dimensional, multi\-dimensional, and jagged. For example: int\[], int\[,], and int\[]\[] |
+|[Delegate types](https://learn.microsoft.com/en-us/dotnet/csharp/language-reference/builtin-types/reference-types) |User\-defined types of the form delegate int D(...) |
+
+
+C\# programs use *type declarations* to create new types. A type declaration specifies the name and the members of the new type. Six of C\#'s categories of types are user\-definable: class types, struct types, interface types, enum types, delegate types, and tuple value types. You can also declare `record` types, either `record struct`, or `record class`. Record types have compiler\-synthesized members. You use records primarily for storing values, with minimal associated behavior.
+
+- AÂ `class`Â type defines a data structure that contains data members (fields) and function members (methods, properties, and others). Class types support single inheritance and polymorphism, mechanisms whereby derived classes can extend and specialize base classes.
+
+- A `struct` type is similar to a class type in that it represents a structure with data members and function members. However, unlike classes, structs are value types and don't typically require heap allocation. Struct types don't support user\-specified inheritance, and all struct types implicitly inherit from type `object`.
+
+- An `interface` type defines a contract as a named set of public members. A `class` or `struct` that implements an `interface` must provide implementations of the interface's members. An `interface` may inherit from multiple base interfaces, and a `class` or `struct` may implement multiple interfaces.
+
+- AÂ `delegate`Â type represents references to methods with a particular parameter list and return type. Delegates make it possible to treat methods as entities that can be assigned to variables and passed as parameters. Delegates are analogous to function types provided by functional languages. They're also similar to the concept of function pointers found in some other languages. Unlike function pointers, delegates are object\-oriented and type\-safe.
+
+You can explore more about C\# in this [tutorials](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/tutorials/classes).
\ No newline at end of file
diff --git a/Blazor-Server-Demos/Blazor_Server_Demos_NET6.csproj b/Blazor-Server-Demos/Blazor_Server_Demos_NET6.csproj
deleted file mode 100644
index 5725955f4..000000000
--- a/Blazor-Server-Demos/Blazor_Server_Demos_NET6.csproj
+++ /dev/null
@@ -1,53 +0,0 @@
-