From a5bcc4c8fa59af2343b6bd42c47fe6eac93a3c2f Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Sun, 29 Sep 2024 23:08:28 +0530 Subject: [PATCH 01/23] Chat component + Markdown component (#893) * AI Chat component + Markdown component --- .../Components/Layout/MainLayout.razor.cs | 1 + .../Pages/AI/AIChat/AIChatDocumentation.razor | 21 +++ .../AI/AIChat/AIChat_Demo_01_Examples.razor | 4 + .../Grid_Demo_14_A_DetailView.razor | 101 ++++++----- ...id_Demo_14_B_DetailView_Dynamic_Data.razor | 66 +++++++ .../Grid_DetailView_Documentation.razor | 4 + .../Components/Pages/Index.razor | 19 ++ .../Markdown/MarkdownDocumentation.razor | 45 +++++ .../Markdown/Markdown_Demo_01_Examples.razor | 15 ++ .../Markdown/Markdown_Demo_02_Headers.razor | 7 + ...n_Demo_03_Paragraphs_and_Line_Breaks.razor | 8 + .../Markdown_Demo_04_Blockquotes.razor | 6 + .../Markdown_Demo_05_Horizontal_Rules.razor | 6 + ..._Emphasis_bold_italics_strikethrough.razor | 5 + .../Markdown_Demo_07_Code_Highlighting.razor | 11 ++ BlazorBootstrap.Demo.Server/appsettings.json | 6 + blazorbootstrap/BlazorBootstrap.csproj | 2 + .../Components/AI/Chat/AIChat.razor | 63 +++++++ .../Components/AI/Chat/AIChat.razor.cs | 155 ++++++++++++++++ .../Components/AI/Chat/AIChatInterop.cs.cs | 12 ++ .../Core/BlazorBootstrapComponentBase.cs | 6 +- .../Components/Core/BlazorBootstrapInterop.cs | 14 ++ .../Components/Markdown/Markdown.razor | 6 + .../Components/Markdown/Markdown.razor.cs | 165 ++++++++++++++++++ blazorbootstrap/Config.cs | 19 +- blazorbootstrap/Constants/BootstrapClass.cs | 2 + .../Models/AI/OpenAIChatMessage.cs | 3 + .../Models/AI/OpenAIChatPayload.cs | 56 ++++++ blazorbootstrap/Models/MarkdownPattern.cs | 3 + .../wwwroot/blazor.bootstrap.ai.js | 57 ++++++ blazorbootstrap/wwwroot/blazor.bootstrap.js | 90 ++++++++++ 31 files changed, 927 insertions(+), 51 deletions(-) create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChat_Demo_01_Examples.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_B_DetailView_Dynamic_Data.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor create mode 100644 blazorbootstrap/Components/AI/Chat/AIChat.razor create mode 100644 blazorbootstrap/Components/AI/Chat/AIChat.razor.cs create mode 100644 blazorbootstrap/Components/AI/Chat/AIChatInterop.cs.cs create mode 100644 blazorbootstrap/Components/Core/BlazorBootstrapInterop.cs create mode 100644 blazorbootstrap/Components/Markdown/Markdown.razor create mode 100644 blazorbootstrap/Components/Markdown/Markdown.razor.cs create mode 100644 blazorbootstrap/Models/AI/OpenAIChatMessage.cs create mode 100644 blazorbootstrap/Models/AI/OpenAIChatPayload.cs create mode 100644 blazorbootstrap/Models/MarkdownPattern.cs create mode 100644 blazorbootstrap/wwwroot/blazor.bootstrap.ai.js diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs index 97b8ebb37..d4797337d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs @@ -62,6 +62,7 @@ internal override IEnumerable GetNavItems() #endregion Grid + new (){ Id = "514", Text = "Markdown", Href = "/markdown", IconName = IconName.MarkdownFill, ParentId = "5" }, new (){ Id = "514", Text = "Modals", Href = "/modals", IconName = IconName.WindowStack, ParentId = "5" }, new (){ Id = "515", Text = "Offcanvas", Href = "/offcanvas", IconName = IconName.LayoutSidebarReverse, ParentId = "5" }, new (){ Id = "516", Text = "Pagination", Href = "/pagination", IconName = IconName.ThreeDots, ParentId = "5" }, diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor new file mode 100644 index 000000000..559e797cd --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor @@ -0,0 +1,21 @@ +@page "/ai/open-ai-chat" + +@title + + + +

Blazor Open AI Chat

+
Provide contextual feedback messages for typical user actions with a handful of available and flexible alert messages.
+ + + + +
Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight colors.
+ + +@code{ + private string pageUrl = "/ai/open-ai-chat"; + private string title = "Blazor Open AI Chat Component"; + private string description = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages."; // TODO: update + private string imageUrl = "https://i.imgur.com/FGgEMp6.jpg"; // TODO: update +} \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChat_Demo_01_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChat_Demo_01_Examples.razor new file mode 100644 index 000000000..a9cdd295b --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChat_Demo_01_Examples.razor @@ -0,0 +1,4 @@ + diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor index 38c47764c..a17d058ce 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor @@ -1,66 +1,85 @@ - - + @context.Id - + @context.Name - - @context.Designation - - - @context.DOJ - - + @context.IsActive - -
-
Id
-
@context.Id
-
-
-
Name
-
@context.Name
-
-
-
Designation
-
@context.Designation
-
-
-
DOJ
-
@context.DOJ
-
-
-
IsActive
-
@context.IsActive
-
+ + + + + + + @emp1.Id + + + @emp1.Description + + + @emp1.Unit + + + @emp1.Quantity + + + + + @code { - private List employees = new List { - new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true }, - new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true }, - new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true }, - new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false }, - new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true } + private List products = new List { + new Product { Id = 1, Name = "Product 1", IsActive = true }, + new Product { Id = 2, Name = "Product 2", IsActive = true }, + new Product { Id = 3, Name = "Product 3", IsActive = true }, + new Product { Id = 4, Name = "Product 4", IsActive = true }, + new Product { Id = 5, Name = "Product 5", IsActive = true } }; - public record class Employee1 + private List ingredients = new List { + new Ingredient { Id = 105, ProductId = 1, Description = "Ingredient 1", Unit = "UNIT1", Quantity = 350 }, + new Ingredient { Id = 106, ProductId = 1, Description = "Ingredient 2", Unit = "UNIT1", Quantity = 600 }, + new Ingredient { Id = 107, ProductId = 1, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 108, ProductId = 1, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 109, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 110, ProductId = 2, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 111, ProductId = 1, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 112, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 113, ProductId = 4, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 114, ProductId = 5, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 115, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + }; + + private IEnumerable GetIngredients(int productId) => ingredients.Where(i => i.ProductId == productId); + + public record class Product { public int Id { get; set; } public string? Name { get; set; } - public string? Designation { get; set; } - public DateOnly DOJ { get; set; } public bool IsActive { get; set; } } + + public record class Ingredient + { + public int Id { get; set; } + public int ProductId { get; set; } + public string? Description { get; set; } + public string? Unit { get; set; } + public int Quantity { get; set; } + } } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_B_DetailView_Dynamic_Data.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_B_DetailView_Dynamic_Data.razor new file mode 100644 index 000000000..38c47764c --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_B_DetailView_Dynamic_Data.razor @@ -0,0 +1,66 @@ + + + + + @context.Id + + + @context.Name + + + @context.Designation + + + @context.DOJ + + + @context.IsActive + + + + +
+
Id
+
@context.Id
+
+
+
Name
+
@context.Name
+
+
+
Designation
+
@context.Designation
+
+
+
DOJ
+
@context.DOJ
+
+
+
IsActive
+
@context.IsActive
+
+ + + + +@code { + private List employees = new List { + new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true }, + new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true }, + new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true }, + new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false }, + new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true } + }; + + public record class Employee1 + { + public int Id { get; set; } + public string? Name { get; set; } + public string? Designation { get; set; } + public DateOnly DOJ { get; set; } + public bool IsActive { get; set; } + } +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor index 5e33560fc..beae70930 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor @@ -13,6 +13,10 @@
To enable detail view, set the AllowDetailView parameter to true. In the following example, existing <GridColumn> tags are nested under <GridColumns> tag to distinguish them from <GridDetailView>.
+ +
+ + @code { private const string pageUrl = "/grid/detail-view"; private const string title = "Blazor Grid Component - Detail View"; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor index a874822ef..e63d9fc44 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor @@ -130,6 +130,11 @@

Images New

+
+ +

Markdown New

+ +

Modals

@@ -233,6 +238,20 @@
+
+
+

AI Components

+
+ +
+
+ +

Open AI Chat

+ +
+
+
+

Form Components

diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor new file mode 100644 index 000000000..ca711ea73 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor @@ -0,0 +1,45 @@ +@page "/markdown" + +@title + + + +

Blazor Markdown

+
Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages.
+ + + +@* +
+ *@ + + +
+ + + +
+ + + +
+ + + +
+ + + +
+ + + +
+ + +@code{ + private string pageUrl = "/markdown"; + private string title = "Blazor Markdown Component"; + private string description = "Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages."; + private string imageUrl = "https://i.imgur.com/FGgEMp6.jpg"; // TODO: update +} \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor new file mode 100644 index 000000000..1a0d708d7 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor @@ -0,0 +1,15 @@ + + Test + # Heading level 1 + ## Heading level 2 + ### Heading level 3 + #### Heading level 4 + ##### Heading level 5 + ###### Heading level 6 + + + __bold text__ + **bold text** + _italic text_ + *italic text* + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor new file mode 100644 index 000000000..9792ee11e --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor @@ -0,0 +1,7 @@ + + # This is a H1 header + ## This is a H2 header + ### This is a H3 header + #### This is a H4 header + ##### This is a H5 header + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor new file mode 100644 index 000000000..24b026e26 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor @@ -0,0 +1,8 @@ + + Add lines between your text with the **Enter** key. + Your text gets better spaced and makes it easier to read. + + + Add lines between your text with the **Enter** key. + Your text gets better spaced and makes it easier to read. + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor new file mode 100644 index 000000000..8e065dd41 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor @@ -0,0 +1,6 @@ + + > Single line quote + >> Nested quote + >> multiple line + >> quote + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor new file mode 100644 index 000000000..e7d9c79e5 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor @@ -0,0 +1,6 @@ + + above + + ---- + below + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor new file mode 100644 index 000000000..9ab8f7c56 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor @@ -0,0 +1,5 @@ + + Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~ + **_Bold, italicized text_** + **~~Bold, strike-through text~~** + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor new file mode 100644 index 000000000..137c1352d --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor @@ -0,0 +1,11 @@ + + ```js + const count = records.length; + ``` + + + + ```csharp + Console.WriteLine("Hello, World!"); + ``` + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.Server/appsettings.json b/BlazorBootstrap.Demo.Server/appsettings.json index 0fc7e90f8..03290f577 100644 --- a/BlazorBootstrap.Demo.Server/appsettings.json +++ b/BlazorBootstrap.Demo.Server/appsettings.json @@ -23,5 +23,11 @@ }, "GoogleMap": { "ApiKey": "AIzaSyDc110Rvu20IMJhlZcWTOPoLbVQdnjLyXs" + }, + "AzureOpenAI": { + "Endpoint": "", + "DeploymentName": "", + "ApiKey": "", + "ApiVersion": "" } } diff --git a/blazorbootstrap/BlazorBootstrap.csproj b/blazorbootstrap/BlazorBootstrap.csproj index 34c3dbc0f..7d0120794 100644 --- a/blazorbootstrap/BlazorBootstrap.csproj +++ b/blazorbootstrap/BlazorBootstrap.csproj @@ -46,10 +46,12 @@ + + \ No newline at end of file diff --git a/blazorbootstrap/Components/AI/Chat/AIChat.razor b/blazorbootstrap/Components/AI/Chat/AIChat.razor new file mode 100644 index 000000000..254561235 --- /dev/null +++ b/blazorbootstrap/Components/AI/Chat/AIChat.razor @@ -0,0 +1,63 @@ +@namespace BlazorBootstrap +@inherits BlazorBootstrapComponentBase + + \ No newline at end of file diff --git a/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs b/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs new file mode 100644 index 000000000..ab33601c9 --- /dev/null +++ b/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs @@ -0,0 +1,155 @@ +namespace BlazorBootstrap; + +public partial class AIChat : BlazorBootstrapComponentBase +{ + #region Fields and Constants + + private readonly List conversationHistory = new(); + private string? apiKey; + private string? apiVersion; + private string? currentCompletion; + private string? deploymentName; + private string? endpoint; + private bool isRequestInProgress; + private DotNetObjectReference? objRef; + private string userPrompt = string.Empty; + + #endregion + + #region Methods + + protected override async Task OnInitializedAsync() + { + var configurationSection = Configuration.GetSection("AzureOpenAI"); + + if (Configuration is null) + throw new ArgumentException("`AzureOpenAI` section was not found in the application configuration."); + + endpoint = configurationSection["Endpoint"]; + + if (endpoint is null) + throw new ArgumentException("`Endpoint` key/value was not found in the 'AzureOpenAI' section of the application configuration."); + + deploymentName = configurationSection["DeploymentName"]; + + if (deploymentName is null) + throw new ArgumentException("`DeploymentName` key/value was not found in the 'AzureOpenAI' section of the application configuration."); + + apiKey = configurationSection["ApiKey"]; + + if (apiKey is null) + throw new ArgumentException("`ApiKey` key/value was not found in the 'AzureOpenAI' section of the application configuration."); + + apiVersion = configurationSection["ApiVersion"]; + + if (apiVersion is null) + throw new ArgumentException("`ApiVersion` key/value was not found in the 'AzureOpenAI' section of the application configuration."); + + objRef ??= DotNetObjectReference.Create(this); + + await base.OnInitializedAsync(); + } + + [JSInvokable] + public async Task ChartCompletetionsStreamJs(string content, bool done) + { + ClearInput(); + + if (isRequestInProgress) + isRequestInProgress = false; + + if (done) + { + conversationHistory.Add(new OpenAIChatMessage("system", currentCompletion!)); + currentCompletion = ""; + await InvokeAsync(StateHasChanged); + await JSRuntime.InvokeVoidAsync(BlazorBootstrapInterop.ScrollToElementBottom, Id); + return; + } + + currentCompletion += content; + await InvokeAsync(StateHasChanged); + await JSRuntime.InvokeVoidAsync(BlazorBootstrapInterop.ScrollToElementBottom, Id); + } + + private void ClearInput() => userPrompt = string.Empty; + + private async Task CreateCompletionAsync(List messages) + { + isRequestInProgress = true; + + var payload = new OpenAIChatPayload { Messages = messages, MaximumTokens = MaximumTokens, Temperature = Temperature, TopP = TopP }; + + try + { + await JSRuntime.InvokeVoidAsync( + AIChatInterop.AzureOpenAIChatCompletions, + $"{endpoint}openai/deployments/{deploymentName}/chat/completions?api-version={apiVersion}", + apiKey, + payload, + objRef! + ); + } + catch + { + isRequestInProgress = false; + } + } + + private async Task SendPromptAsync() + { + if (string.IsNullOrWhiteSpace(userPrompt)) + return; + + var message = new OpenAIChatMessage("user", userPrompt); + conversationHistory.Add(message); + + await CreateCompletionAsync(new List { message }); + } + + #endregion + + #region Properties, Indexers + + protected override string? ClassNames => + BuildClassNames(Class, + (BootstrapClass.Container, true)); + + protected override string? StyleNames => + BuildStyleNames(Style, + //("min-height:200px", true), + //("max-height:400px", true), + ("overflow-x:hidden", true), + ("overflow-y:auto", true)); + + /// + /// The maximum number of tokens to generate shared between the prompt and completion. + /// The exact limit varies by model. (One token is roughly 4 characters for standard English text) + /// Minimum 1 and the maximum tokens is 4096. + /// + /// Default value is 2048. This value is limited by gpt-3.5-turbo. + [Parameter] + public long MaximumTokens { get; set; } = 2048; + + /// + /// Controls randomness: Lowering results in less random completions. + /// As the temperature approaches zero, the model will become deterministic and repetitive. + /// Minimum 1 and the maximum is 2. + /// + /// Default value is 1. + [Parameter] + public double Temperature { get; set; } = 1; + + /// + /// Controls diversity via nucleus sampling: 0.5 means half of all likelihood-weighted options are considered. + /// + /// Default value is 1. + [Parameter] + public double TopP { get; set; } = 1; + + #endregion +} + + + + diff --git a/blazorbootstrap/Components/AI/Chat/AIChatInterop.cs.cs b/blazorbootstrap/Components/AI/Chat/AIChatInterop.cs.cs new file mode 100644 index 000000000..8dc241100 --- /dev/null +++ b/blazorbootstrap/Components/AI/Chat/AIChatInterop.cs.cs @@ -0,0 +1,12 @@ +namespace BlazorBootstrap; + +public class AIChatInterop +{ + #region Fields and Constants + + private const string Prefix = "window.blazorBootstrap.ai."; + + public const string AzureOpenAIChatCompletions = Prefix + "azureOpenAI.chat.completions"; + + #endregion +} diff --git a/blazorbootstrap/Components/Core/BlazorBootstrapComponentBase.cs b/blazorbootstrap/Components/Core/BlazorBootstrapComponentBase.cs index e5386389f..a8bfe8dfa 100644 --- a/blazorbootstrap/Components/Core/BlazorBootstrapComponentBase.cs +++ b/blazorbootstrap/Components/Core/BlazorBootstrapComponentBase.cs @@ -1,4 +1,6 @@ -namespace BlazorBootstrap; +using Microsoft.Extensions.Configuration; + +namespace BlazorBootstrap; public abstract class BlazorBootstrapComponentBase : ComponentBase, IDisposable, IAsyncDisposable { @@ -141,6 +143,8 @@ protected virtual ValueTask DisposeAsyncCore(bool disposing) protected virtual string? ClassNames => Class; + [Inject] protected IConfiguration Configuration { get; set; } = default!; + public ElementReference Element { get; set; } [Parameter] public string? Id { get; set; } diff --git a/blazorbootstrap/Components/Core/BlazorBootstrapInterop.cs b/blazorbootstrap/Components/Core/BlazorBootstrapInterop.cs new file mode 100644 index 000000000..a3d057186 --- /dev/null +++ b/blazorbootstrap/Components/Core/BlazorBootstrapInterop.cs @@ -0,0 +1,14 @@ +namespace BlazorBootstrap; + +public class BlazorBootstrapInterop +{ + #region Fields and Constants + + private const string Prefix = "window.blazorBootstrap."; + + public const string ScrollToElementBottom = Prefix + "scrollToElementBottom"; + + public const string ScrollToElementTop = Prefix + "scrollToElementTop"; + + #endregion +} diff --git a/blazorbootstrap/Components/Markdown/Markdown.razor b/blazorbootstrap/Components/Markdown/Markdown.razor new file mode 100644 index 000000000..0a5a86345 --- /dev/null +++ b/blazorbootstrap/Components/Markdown/Markdown.razor @@ -0,0 +1,6 @@ +@namespace BlazorBootstrap +@inherits BlazorBootstrapComponentBase + + \ No newline at end of file diff --git a/blazorbootstrap/Components/Markdown/Markdown.razor.cs b/blazorbootstrap/Components/Markdown/Markdown.razor.cs new file mode 100644 index 000000000..fe95e23e7 --- /dev/null +++ b/blazorbootstrap/Components/Markdown/Markdown.razor.cs @@ -0,0 +1,165 @@ +using Microsoft.AspNetCore.Components.Rendering; +using System.Text.RegularExpressions; + +namespace BlazorBootstrap; + +public partial class Markdown : BlazorBootstrapComponentBase +{ + private string? html; + + #region Properties, Indexers + + /// + /// Gets or sets the content to be rendered within the component. + /// + /// + /// Default value is null. + /// + [Parameter] + public RenderFragment? ChildContent { get; set; } + + #endregion + + protected override void OnInitialized() + { + ParseMarkdown(); + + base.OnInitialized(); + } + + protected override void OnParametersSet() + { + if (IsRenderComplete) + ParseMarkdown(); + + base.OnParametersSet(); + } + + private void ParseMarkdown() + { + var lines = GetLines(); + if (lines.Any()) + { + // remove start and end blank lines + if (lines[0] == "") + lines.RemoveAt(0); + + if (lines[lines.Count - 1] == "") + lines.RemoveAt(lines.Count - 1); + } + + var markup = ApplyRules(lines); + html = ApplyFullMarkupRules(markup); + } + + private string ApplyRules(List lines) + { + var patterns = GetRules(); + foreach (var pattern in patterns) + { + for (var i = 0; i < lines.Count; i++) + lines[i] = Regex.Replace(lines[i], pattern.Rule, pattern.Template); + } + + return string.Join("\n", lines); + } + + private string ApplyFullMarkupRules(string markup) + { + var patterns = GetFullMarkupRules(); + + foreach (var pattern in patterns) + markup = Regex.Replace(markup, pattern.Rule, pattern.Template); + + return markup; + } + + List GetLines() + { + var inputs = new List(); + + if (ChildContent is not null) + { + var builder = new RenderTreeBuilder(); + ChildContent.Invoke(builder); + + var frames = builder.GetFrames().Array; + foreach (var frame in frames) + { + if (frame.MarkupContent is not null) + { + var lines = frame.MarkupContent.Split("\r\n"); + foreach (var line in lines) + inputs.Add(line.Trim()); + } + } + } + + return inputs; + } + + private List GetRules() + { + return new List + { + // Headers + new(@"^#{6}\s?([^\n]+)", "
$1
"), + new(@"^#{5}\s?([^\n]+)", "
$1
"), + new(@"^#{4}\s?([^\n]+)", "

$1

"), + new(@"^#{3}\s?([^\n]+)", "

$1

"), + new(@"^#{2}\s?([^\n]+)", "

$1

"), + new(@"^#{1}\s?([^\n]+)", "

$1

"), + + // Blockquotes + new(@"^>{1}\s(.*)$", "
$1
"), + //new(@"^(>>)+ (.*)$", "

$2

"), + + // Horizontal rules + new(@"^\-{3,}$", "
"), + + // Emphasis (bold, italics, strikethrough) + new(@"\*\*(.*?)\*\*", "$1"), + new(@"__(.*?)__", "$1"), + new(@"\*(.*?)\*", "$1"), + new(@"_(.*?)_", "$1"), + new(@"~~(.*?)~~", "$1"), + + // Code highlighting + new(@"\```(\w+)", "
"),
+            new(@"```", "
"), + + // Tables + + // Lists + // Ordered or numbered lists + + // Bulleted lists + + // Nested lists + + // Links + + // Anchor links + + // Images + + // Checklist or task list + + // Emoji + + // Mathematical notation and characters + + // Mermaid diagrams + }; + } + + private List GetFullMarkupRules() + { + return new List + { + // Paragraphs and line breaks + new(@"(?"), + new(@"([^\n\n]+\n?)", "

$1

"), + }; + } +} diff --git a/blazorbootstrap/Config.cs b/blazorbootstrap/Config.cs index 19fb67f36..fe8146e37 100644 --- a/blazorbootstrap/Config.cs +++ b/blazorbootstrap/Config.cs @@ -1,4 +1,5 @@ using BlazorBootstrap; +using Microsoft.Extensions.Configuration; namespace Microsoft.Extensions.DependencyInjection; @@ -9,19 +10,19 @@ public static class Config /// /// Adds a bootstrap providers and component mappings. /// - /// + /// /// IServiceCollection - public static IServiceCollection AddBlazorBootstrap(this IServiceCollection serviceCollection) + public static IServiceCollection AddBlazorBootstrap(this IServiceCollection services, IConfiguration configuration = null!) { - serviceCollection.AddScoped(); - serviceCollection.AddScoped(); - serviceCollection.AddScoped(); - serviceCollection.AddScoped(); + services.AddScoped(); + services.AddScoped(); + services.AddScoped(); + services.AddScoped(); - serviceCollection.AddScoped(); - serviceCollection.AddScoped(); + services.AddScoped(); + services.AddScoped(); - return serviceCollection; + return services; } #endregion diff --git a/blazorbootstrap/Constants/BootstrapClass.cs b/blazorbootstrap/Constants/BootstrapClass.cs index 03fc8791d..73919b3ad 100644 --- a/blazorbootstrap/Constants/BootstrapClass.cs +++ b/blazorbootstrap/Constants/BootstrapClass.cs @@ -65,6 +65,8 @@ public static class BootstrapClass public const string ConfirmationModal = "modal-confirmation"; + public const string Container = "container"; + public const string Disabled = "disabled"; public const string DisplayNone = "d-none"; public const string DisplayBlock = "d-block"; diff --git a/blazorbootstrap/Models/AI/OpenAIChatMessage.cs b/blazorbootstrap/Models/AI/OpenAIChatMessage.cs new file mode 100644 index 000000000..4a3950e63 --- /dev/null +++ b/blazorbootstrap/Models/AI/OpenAIChatMessage.cs @@ -0,0 +1,3 @@ +namespace BlazorBootstrap; + +public record OpenAIChatMessage(string Role, string Content); diff --git a/blazorbootstrap/Models/AI/OpenAIChatPayload.cs b/blazorbootstrap/Models/AI/OpenAIChatPayload.cs new file mode 100644 index 000000000..92f69887d --- /dev/null +++ b/blazorbootstrap/Models/AI/OpenAIChatPayload.cs @@ -0,0 +1,56 @@ +namespace BlazorBootstrap; + +public record OpenAIChatPayload +{ + #region Properties, Indexers + + /// + /// How much to penalize new tokens based on their existing frequency in the text so far. + /// Decreases the model's likelihood to repeat the same line verbatim. + /// Minimum 1 and the maximum is 2. + /// + /// Default value is 0. + [JsonPropertyName("frequency_penalty")] + public double FrequencyPenalty { get; set; } = 0; + + /// + /// The maximum number of tokens to generate shared between the prompt and completion. + /// The exact limit varies by model. (One token is roughly 4 characters for standard English text) + /// Minimum 1 and the maximum tokens is 4096. + /// + /// Default value is 2048. This value is limited by gpt-3.5-turbo. + [JsonPropertyName("max_tokens")] + public long MaximumTokens { get; set; } = 2048; + + [JsonPropertyName("messages")] + public List? Messages { get; set; } + + /// + /// How much to penalize new tokens based on whether they appear in the text so far. + /// Increases the model's likelihood to talk about new topics. + /// Minimum 1 and the maximum is 2. + /// + /// Default value is 0. + [JsonPropertyName("presence_penalty")] + public float PresencePenalty { get; set; } = 0; + + [JsonPropertyName("stream")] public bool Stream { get; } = true; + + /// + /// Controls randomness: Lowering results in less random completions. + /// As the temperature approaches zero, the model will become deterministic and repetitive. + /// Minimum 1 and the maximum is 2. + /// + /// Default value is 1. + [JsonPropertyName("temperature")] + public double Temperature { get; set; } = 1; + + /// + /// Controls diversity via nucleus sampling: 0.5 means half of all likelihood-weighted options are considered. + /// + /// Default value is 1. + [JsonPropertyName("top_p")] + public double TopP { get; set; } = 1; + + #endregion +} diff --git a/blazorbootstrap/Models/MarkdownPattern.cs b/blazorbootstrap/Models/MarkdownPattern.cs new file mode 100644 index 000000000..c5095e5b7 --- /dev/null +++ b/blazorbootstrap/Models/MarkdownPattern.cs @@ -0,0 +1,3 @@ +namespace BlazorBootstrap; + +public record MarkdownPattern(string Rule, string Template); diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.ai.js b/blazorbootstrap/wwwroot/blazor.bootstrap.ai.js new file mode 100644 index 000000000..f9241c524 --- /dev/null +++ b/blazorbootstrap/wwwroot/blazor.bootstrap.ai.js @@ -0,0 +1,57 @@ +export async function createChatCompletions(key, messages, dotNetHelper) { + const API_KEY = key; + const API_URL = 'https://api.openai.com/v1/chat/completions'; + + try { + // Fetch the response from the OpenAI API with the signal from AbortController + const response = await fetch(API_URL, { + method: "POST", + headers: { + "Content-Type": "application/json", + Authorization: `Bearer ${API_KEY}`, + }, + body: JSON.stringify({ + model: "gpt-3.5-turbo", //"gpt-4", + messages: messages, + max_tokens: 200, + stream: true, // For streaming responses + }) + }); + + // Read the response as a stream of data + const reader = response.body.getReader(); + const decoder = new TextDecoder("utf-8"); + let i = 0; + while (true) { + const { done, value } = await reader.read(); + if (done) { + break; + } + + // Massage and parse the chunk of data + const chunk = decoder.decode(value); + const lines = chunk.split("\n"); + + for (const payload of lines) { + + if (payload.includes('[DONE]')) { + dotNetHelper.invokeMethodAsync('ChartCompletetionsStreamJs', '', true); + return; + } + + if (payload.startsWith("data:")) { + const data = JSON.parse(payload.replace("data:", "")); + const content = data.choices[0].delta.content; + if (content) { + dotNetHelper.invokeMethodAsync('ChartCompletetionsStreamJs', content, false); + } + } + } + } + } catch (error) { + // Handle fetch request errors + console.log(error); + } finally { + // TODO: cleanup + } +} diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.js b/blazorbootstrap/wwwroot/blazor.bootstrap.js index 1d45c7a38..055742f0d 100644 --- a/blazorbootstrap/wwwroot/blazor.bootstrap.js +++ b/blazorbootstrap/wwwroot/blazor.bootstrap.js @@ -933,6 +933,16 @@ window.blazorBootstrap = { return false; }, + scrollToElementBottom: (elementId) => { + let el = document.getElementById(elementId); + if (el) + el.scrollTop = el.scrollHeight; + }, + scrollToElementTop: (elementId) => { + let el = document.getElementById(elementId); + if (el) + el.scrollTop = 0; + } } window.blazorChart = { @@ -1992,3 +2002,83 @@ window.blazorChart.scatter = { } } } + +if (!window.blazorBootstrap.ai) { + window.blazorBootstrap.ai = {}; +} + +window.blazorBootstrap.ai = { + azureOpenAI: { + chat: { + completions: async (url, key, payload, dotNetHelper) => { + let contentArray = []; + let notificationTriggered = false; + let streamComplete = false; + + try { + const response = await fetch(url, { + method: "POST", + headers: { + "Content-Type": "application/json", + "api-key": `${key}`, + }, + body: JSON.stringify(payload) + }); + + // Read the response as a stream of data + const reader = response.body.getReader(); + const decoder = new TextDecoder("utf-8"); + let i = 0; + while (true) { + const { done, value } = await reader.read(); + if (done) { + break; + } + + // Message and parse the chunk of data + const chunk = decoder.decode(value); + const lines = chunk.split("\n"); + + for (const line of lines) { + + if (line.includes('[DONE]')) { + streamComplete = true; + return; + } + + if (line.startsWith("data:")) { + const data = JSON.parse(line.replace("data:", "")); + const content = data.choices[0]?.delta?.content; + if (content) { + contentArray.push(content); + if (!notificationTriggered) { + notificationTriggered = true; + triggerNotify(); + } + } + } + } + } + + function triggerNotify() { + let handler = setInterval(() => { + const content = contentArray.shift(); + if (content && content.length > 0) + dotNetHelper.invokeMethodAsync('ChartCompletetionsStreamJs', content, false); + + if (streamComplete && contentArray.length === 0) { + clearInterval(handler); + dotNetHelper.invokeMethodAsync('ChartCompletetionsStreamJs', '', true); + } + }, 100); + } + + } catch (error) { + console.log(error); + } finally { + // TODO: cleanup + } + } + } + } +} From d4cc2668ca2e42b9515c2105ad6e0ecbed657c74 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Sun, 6 Oct 2024 23:33:45 +0530 Subject: [PATCH 02/23] Dark mode support (#895) * dark mode support --- .../Components/Layout/EmptyLayout.razor | 116 +++------ .../Components/Layout/EmptyLayout.razor.cs | 5 + .../Components/Layout/MainLayout.razor | 1 - .../Components/Layout/MainLayoutBase.cs | 38 ++- .../Layout/MainLayoutBaseFooter.razor | 4 +- .../Components/Shared/Demo.razor | 8 +- .../Components/Shared/Demo.razor.cs | 4 +- .../Components/Shared/Demo.razor.css | 6 +- .../wwwroot/css/blazorbootstrap.demo.rcl.css | 61 ++++- .../wwwroot/css/prism-vs.min.css | 117 +++++++++ .../wwwroot/css/prism-vsc-dark-plus.min.css | 226 ++++++++++++++++++ .../wwwroot/js/blazorbootstrap.demo.rcl.js | 99 ++++++++ .../Components/App.razor | 4 +- .../Components/Callout/Callout.razor.css | 5 +- .../Components/Modals/Modal.razor.cs | 6 +- .../Components/Toasts/Toast.razor.cs | 4 +- blazorbootstrap/Enums/ModalType.cs | 1 + blazorbootstrap/Models/ModalOption.cs | 4 +- blazorbootstrap/wwwroot/blazor.bootstrap.css | 101 +++++--- 19 files changed, 658 insertions(+), 152 deletions(-) create mode 100644 BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor.cs create mode 100644 BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vs.min.css create mode 100644 BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vsc-dark-plus.min.css diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor index 2858d1aa1..c2ad8e129 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor @@ -1,6 +1,5 @@ @namespace BlazorBootstrap.Demo.RCL - -@inherits LayoutComponentBase +@inherits MainLayoutBase @@ -64,6 +63,33 @@ Open Collective +
  • +
    +
    +
    • +
  • + +
      +
    • + +
      • +
    • + +
      • +
    • + +
      • +
    +
    • @@ -74,79 +100,13 @@ @Body - - -@code { - private string version = default!; - private string docsUrl = default!; - private string blogUrl = default!; - private string githubUrl = default!; - private string twitterUrl = default!; - private string linkedInUrl = default!; - private string openCollectiveUrl = default!; - private string githubIssuesUrl = default!; - private string githubDiscussionsUrl = default!; - private string stackoverflowUrl = default!; - - [Inject] public IConfiguration Configuration { get; set; } = default!; - - protected override void OnInitialized() - { - version = $"v{Configuration["version"]}"; // example: v0.6.1 - docsUrl = $"{Configuration["urls:docs"]}"; - blogUrl = $"{Configuration["urls:blog"]}"; - githubUrl = $"{Configuration["urls:github"]}"; - twitterUrl = $"{Configuration["urls:twitter"]}"; - linkedInUrl = $"{Configuration["urls:linkedin"]}"; - openCollectiveUrl = $"{Configuration["urls:opencollective"]}"; - githubIssuesUrl = $"{Configuration["urls:github_issues"]}"; - githubDiscussionsUrl = $"{Configuration["urls:github_discussions"]}"; - stackoverflowUrl = $"{Configuration["urls:stackoverflow"]}"; - - base.OnInitialized(); - } -} + diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor.cs new file mode 100644 index 000000000..278295750 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor.cs @@ -0,0 +1,5 @@ +namespace BlazorBootstrap.Demo.RCL; + +public partial class EmptyLayout : MainLayoutBase +{ +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor index a81e746b9..2298ef346 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor @@ -1,5 +1,4 @@ @namespace BlazorBootstrap.Demo.RCL - @inherits MainLayoutBase
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs index 2c7a5d8db..92ce935ec 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs @@ -2,22 +2,32 @@ public class MainLayoutBase : LayoutComponentBase { - private string version = default!; - private string docsUrl = default!; - private string blogUrl = default!; - private string githubUrl = default!; - private string twitterUrl = default!; - private string linkedInUrl = default!; - private string openCollectiveUrl = default!; - private string githubIssuesUrl = default!; - private string githubDiscussionsUrl = default!; - private string stackoverflowUrl = default!; + internal string version = default!; + internal string docsUrl = default!; + internal string blogUrl = default!; + internal string githubUrl = default!; + internal string twitterUrl = default!; + internal string linkedInUrl = default!; + internal string openCollectiveUrl = default!; + internal string githubIssuesUrl = default!; + internal string githubDiscussionsUrl = default!; + internal string stackoverflowUrl = default!; internal Sidebar2 sidebar2 = default!; internal IEnumerable navItems = default!; [Inject] public IConfiguration Configuration { get; set; } = default!; + [Inject] protected IJSRuntime JS { get; set; } = default!; + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender) + await JS.InvokeVoidAsync("initializeTheme"); + + await base.OnAfterRenderAsync(firstRender); + } + protected override void OnInitialized() { version = $"v{Configuration["version"]}"; // example: v0.6.1 @@ -33,6 +43,14 @@ protected override void OnInitialized() base.OnInitialized(); } + internal Task SetAutoTheme() => SetTheme("system"); + + internal Task SetDarkTheme() => SetTheme("dark"); + + internal Task SetLightTheme() => SetTheme("light"); + + internal async Task SetTheme(string themeName) => await JS.InvokeVoidAsync("setTheme", themeName); + internal virtual async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request) { if (navItems is null) diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor index 42c32ab15..c35d8360e 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor @@ -1,11 +1,11 @@ @namespace BlazorBootstrap.Demo.RCL @inherits ComponentBase -
    +
    - + Blazor Bootstrap Blazor Bootstrap diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor index c8d9f8db5..84d057fa8 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor @@ -12,7 +12,7 @@
    -
    + 
                     
                     @if (snippet is not null)
@@ -27,7 +27,7 @@
 else if (!Tabs)
 {
     
    
-        
    
+        
    
             
         
    
         
    
@@ -38,7 +38,7 @@ else if (!Tabs)
                 
             
    
         
    
-        
    
+        
    
             
                     
                     @if (snippet is not null)
@@ -58,7 +58,7 @@ else // Tabs = true
                 Example
             
             
-                
    
+                
    
                     
                 
    
             
diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs
index 91c4d5466..8be134615 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs
+++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs
@@ -4,7 +4,7 @@ public partial class Demo : ComponentBase
 {
     #region Fields and Constants
 
-    private IconColor clipboardTooltipIconColor = IconColor.Dark;
+    private IconColor clipboardTooltipIconColor = IconColor.None;
 
     private IconName clipboardTooltipIconName = IconName.Clipboard;
 
@@ -92,7 +92,7 @@ public void ResetCopyStatusJS()
     {
         clipboardTooltipTitle = "Copy to clipboard";
         clipboardTooltipIconName = IconName.Clipboard;
-        clipboardTooltipIconColor = IconColor.Dark;
+        clipboardTooltipIconColor = IconColor.None;
 
         StateHasChanged();
     }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.css b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.css
index 6d21ea991..2ac0b89e6 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.css
+++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.css
@@ -1,4 +1,6 @@
 .highlight-toolbar {
-    color: #212529;
-    background-color: #f8f9fa;
+    /*color: #212529;*/
+    /*background-color: #f8f9fa;*/
+    color: var(--bs-body-color);
+    background-color: var(--bs-body-bg);
 }
diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
index 32d30b5de..05be8dea8 100644
--- a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
+++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
@@ -1,16 +1,24 @@
 /*** START: home ***/
-:root {
-    --bd-purple: #4c0bce;
-    --bd-violet: #712cf9;
+:root, [data-bs-theme="light"] {
     --bd-accent: #ffe484;
-    --bd-violet-rgb: 112.520718,44.062154,249.437846;
     --bd-accent-rgb: 255,228,132;
+    --bs-body-color: #212529;
+    --bs-body-color-rgb: 33, 37, 41;
+    --bs-emphasis-color: #000;
+    --bs-link-color: #0d6efd;
+    --bs-link-color-rgb: 13, 110, 253;
     --bd-pink-rgb: 214,51,132;
+    --bd-purple: #4c0bce;
+    --bs-secondary-color: rgba(33, 37, 41, 0.75);
     --bd-teal-rgb: 32,201,151;
+    --bs-tertiary-color: rgba(33, 37, 41, 0.5);
+    --bs-tertiary-color-rgb: 33, 37, 41;
+    --bs-tertiary-bg: #f8f9fa;
+    --bs-tertiary-bg-rgb: 248, 249, 250;
+    --bd-violet: #712cf9;
+    --bd-violet-rgb: 112.520718,44.062154,249.437846;
     --docsearch-primary-color: var(--bd-violet);
     --docsearch-logo-color: var(--bd-violet);
-    --bs-body-color: #212529;
-    --bs-tertiary-bg: #f8f9fa;
 }
 
 h1:focus-visible {
@@ -124,7 +132,8 @@ h1:focus-visible {
 
     .bd-masthead h1 {
         font-size: calc(1.525rem + 3.3vw);
-        line-height: 1
+        line-height: 1;
+        --bs-heading-color: var(--bs-emphasis-color);
     }
 
 @media (min-width: 1200px) {
@@ -136,7 +145,7 @@ h1:focus-visible {
 .bd-masthead .lead {
     font-size: 1rem;
     font-weight: 400;
-    color: #495057
+    color: var(--bs-secondary-color);
 }
 
 .bd-masthead .bd-code-snippet {
@@ -184,6 +193,14 @@ h1:focus-visible {
     }
 }
 
+.masthead-followup h2, .masthead-followup h3, .masthead-followup h4 {
+    --bs-heading-color: var(--bs-emphasis-color);
+}
+
+.masthead-followup h4 {
+    --bs-heading-color: var(--bs-link-color-rgb) !important;
+}
+
 .masthead-followup .lead {
     font-size: 1rem
 }
@@ -225,7 +242,7 @@ h1:focus-visible {
 }
 
 .bd-footer a {
-    color: #495057;
+    color: var(--bs-body-color);
     text-decoration: none
 }
 
@@ -299,7 +316,8 @@ h1:focus-visible {
 .highlight {
     padding: 1rem;
     margin-bottom: 1rem;
-    background-color: #f8f9fa;
+    /*background-color: #f8f9fa;*/
+    background-color: var(--bs-body-bg);
     border: solid #dee2e6;
     border-width: 0 1px 1px 1px;
     border-bottom-left-radius: .25rem;
@@ -324,7 +342,7 @@ h1:focus-visible {
 
     .highlight pre code {
         font-size: inherit;
-        color: #212529;
+        /*color: #212529;*/
         word-wrap: normal
     }
 
@@ -415,3 +433,24 @@ h1:focus-visible {
     margin-top: .75rem;
     color: var(--bs-body-color) !important
 }
+
+.bg-body-tertiary {
+    --bs-bg-opacity: 1;
+    background-color: rgba(var(--bs-tertiary-bg-rgb), var(--bs-bg-opacity)) !important;
+}
+
+[data-bs-theme=dark] {
+    color-scheme: dark;
+    --bs-body-color: #dee2e6;
+    --bs-body-color-rgb: 222, 226, 230;
+    --bs-emphasis-color: #fff;
+    --bs-link-color: #6ea8fe;
+    --bs-link-hover-color: #8bb9fe;
+    --bs-link-color-rgb: 110, 168, 254;
+    --bs-link-hover-color-rgb: 139, 185, 254;
+    --bs-secondary-color: rgba(222, 226, 230, 0.75);
+    --bs-tertiary-color: rgba(222, 226, 230, 0.5);
+    --bs-tertiary-color-rgb: 222, 226, 230;
+    --bs-tertiary-bg: #2b3035;
+    --bs-tertiary-bg-rgb: 43, 48, 53;
+}
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vs.min.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vs.min.css
new file mode 100644
index 000000000..612398812
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vs.min.css
@@ -0,0 +1,117 @@
+code[class*=language-], pre[class*=language-] {
+    color: #393a34;
+    text-shadow: none;
+    direction: ltr;
+    text-align: left;
+    white-space: pre;
+    word-spacing: normal;
+    word-break: normal;
+    line-height: 1.5em;
+    -moz-tab-size: 4;
+    -o-tab-size: 4;
+    tab-size: 4;
+    -webkit-hyphens: none;
+    -moz-hyphens: none;
+    -ms-hyphens: none;
+    hyphens: none
+}
+
+    code[class*=language-] ::-moz-selection, code[class*=language-]::-moz-selection, pre[class*=language-] ::-moz-selection, pre[class*=language-]::-moz-selection {
+        background: #c1def1
+    }
+
+    code[class*=language-] ::selection, code[class*=language-]::selection, pre[class*=language-] ::selection, pre[class*=language-]::selection {
+        background: #c1def1
+    }
+
+pre[class*=language-] {
+    padding: 1em;
+    margin: .5em 0;
+    overflow: auto;
+    background-color: #fff
+}
+
+:not(pre) > code[class*=language-] {
+    padding: .1em .3em;
+    border-radius: .3em;
+    background: #f8f8f8;
+}
+
+.prism-token.prism-cdata, .prism-token.prism-comment, .prism-token.prism-doctype, .prism-token.prism-prolog {
+    color: green;
+}
+
+.prism-token.prism-namespace {
+    opacity: .7
+}
+
+.prism-token.prism-string {
+    color: #a31515
+}
+
+.prism-token.prism-operator, .prism-token.prism-punctuation {
+    color: #393a34
+}
+
+.prism-token.prism-boolean, .prism-token.prism-constant, .prism-token.prism-inserted, .prism-token.prism-number, .prism-token.prism-symbol, .prism-token.prism-url, .prism-token.prism-variable {
+    color: #36acaa
+}
+
+.language-autohotkey .prism-token.prism-selector, .prism-language-json .prism-token.prism-boolean, .prism-language-json .prism-token.prism-number, .prism-token.prism-atrule, .prism-token.prism-attr-value, .prism-token.prism-keyword, code[class*=language-css] {
+    color: #00f
+}
+
+.prism-token.prism-function {
+    color: #393a34
+}
+
+.language-autohotkey .prism-token.prism-tag, .prism-token.prism-deleted {
+    color: #9a050f
+}
+
+.language-autohotkey .prism-token.prism-keyword, .prism-token.prism-selector {
+    color: #00009f
+}
+
+.prism-token.prism-important {
+    color: #e90
+}
+
+.prism-token.prism-bold, .prism-token.prism-important {
+    font-weight: 700
+}
+
+.prism-token.prism-italic {
+    font-style: italic
+}
+
+.language-json .prism-token.prism-property, .prism-token.prism-class-name {
+    color: #2b91af
+}
+
+.prism-token.prism-selector, .prism-token.prism-tag {
+    color: maroon
+}
+
+.prism-token.prism-attr-name, .prism-token.prism-entity, .prism-token.prism-property, .prism-token.prism-regex {
+    color: red
+}
+
+.prism-token.prism-directive.prism-tag .prism-tag {
+    background: #ff0;
+    color: #393a34
+}
+
+.prism-line-numbers.prism-line-numbers .prism-line-numbers-rows {
+    border-right-color: #a5a5a5
+}
+
+.prism-line-numbers .prism-line-numbers-rows > span:before {
+    color: #2b91af
+}
+
+.line-highlight.line-highlight {
+    background: rgba(193,222,241,.2);
+    background: -webkit-linear-gradient(left,rgba(193,222,241,.2) 70%,rgba(221,222,241,0));
+    background: linear-gradient(to right,rgba(193,222,241,.2) 70%,rgba(221,222,241,0))
+}
diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vsc-dark-plus.min.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vsc-dark-plus.min.css
new file mode 100644
index 000000000..0e85e720d
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/prism-vsc-dark-plus.min.css
@@ -0,0 +1,226 @@
+code[class*=language-], pre[class*=language-] {
+    color: #d4d4d4;
+    text-shadow: none;
+    direction: ltr;
+    text-align: left;
+    white-space: pre;
+    word-spacing: normal;
+    word-break: normal;
+    line-height: 1.5;
+    -moz-tab-size: 4;
+    -o-tab-size: 4;
+    tab-size: 4;
+    -webkit-hyphens: none;
+    -moz-hyphens: none;
+    -ms-hyphens: none;
+    hyphens: none
+}
+
+    code[class*=language-] ::selection, code[class*=language-]::selection, pre[class*=language-] ::selection, pre[class*=language-]::selection {
+        text-shadow: none;
+        background: #264f78
+    }
+
+@media print {
+    code[class*=language-], pre[class*=language-] {
+        text-shadow: none
+    }
+}
+
+pre[class*=language-] {
+    padding: 1em;
+    margin: .5em 0;
+    overflow: auto;
+    background: #1e1e1e
+}
+
+:not(pre) > code[class*=language-] {
+    padding: .1em .3em;
+    border-radius: .3em;
+    color: #db4c69;
+    background: #1e1e1e
+}
+
+.prism-namespace {
+    opacity: .7
+}
+
+.prism-token.prism-doctype .prism-token.prism-doctype-tag {
+    color: #569cd6
+}
+
+.prism-token.prism-doctype .prism-token.prism-name {
+    color: #9cdcfe
+}
+
+.prism-token.prism-comment, .prism-token.prism-prolog {
+    color: #6a9955
+}
+
+.language-html .language-css .prism-token.prism-punctuation, .language-html .language-javascript .prism-token.prism-punctuation, .prism-token.prism-punctuation {
+    color: #d4d4d4
+}
+
+.prism-token.prism-boolean, .prism-token.prism-constant, .prism-token.prism-inserted, .prism-token.prism-number, .prism-token.prism-property, .prism-token.prism-symbol, .prism-token.prism-tag, .prism-token.prism-unit {
+    color: #b5cea8
+}
+
+.prism-token.prism-attr-name, .prism-token.prism-builtin, .prism-token.prism-char, .prism-token.prism-deleted, .prism-token.prism-selector, .prism-token.prism-string {
+    color: #ce9178
+}
+
+.language-css .prism-token.prism-string.prism-url {
+    text-decoration: underline
+}
+
+.prism-token.prism-entity, .prism-token.prism-operator {
+    color: #d4d4d4
+}
+
+    .prism-token.prism-operator.prism-arrow {
+        color: #569cd6
+    }
+
+.prism-token.prism-atrule {
+    color: #ce9178
+}
+
+    .prism-token.prism-atrule .prism-token.prism-rule {
+        color: #c586c0
+    }
+
+    .prism-token.prism-atrule .prism-token.prism-url {
+        color: #9cdcfe
+    }
+
+        .prism-token.prism-atrule .prism-token.prism-url .prism-token.prism-function {
+            color: #dcdcaa
+        }
+
+        .prism-token.prism-atrule .prism-token.prism-url .prism-token.prism-punctuation {
+            color: #d4d4d4
+        }
+
+.prism-token.prism-keyword {
+    color: #569cd6
+}
+
+    .prism-token.prism-keyword.prism-control-flow, .prism-token.prism-keyword.prism-module {
+        color: #c586c0
+    }
+
+.prism-token.prism-function, .prism-token.prism-function .prism-token.prism-maybe-class-name {
+    color: #dcdcaa
+}
+
+.prism-token.prism-regex {
+    color: #d16969
+}
+
+.prism-token.prism-important {
+    color: #569cd6
+}
+
+.prism-token.prism-bold, .prism-token.prism-important {
+    font-weight: 700
+}
+
+.prism-token.prism-italic {
+    font-style: italic
+}
+
+.prism-token.prism-constant {
+    color: #9cdcfe
+}
+
+.prism-token.prism-class-name, .prism-token.prism-maybe-class-name {
+    color: #4ec9b0
+}
+
+.prism-token.prism-console {
+    color: #9cdcfe
+}
+
+.prism-token.prism-parameter {
+    color: #9cdcfe
+}
+
+.prism-token.prism-interpolation {
+    color: #9cdcfe
+}
+
+.prism-token.prism-punctuation.prism-interpolation-punctuation {
+    color: #569cd6
+}
+
+.prism-token.prism-boolean {
+    color: #569cd6
+}
+
+.prism-token.prism-exports .prism-token.prism-maybe-class-name, .prism-token.prism-imports .prism-token.prism-maybe-class-name, .prism-token.prism-property, .prism-token.prism-variable {
+    color: #9cdcfe
+}
+
+.prism-token.prism-selector {
+    color: #d7ba7d
+}
+
+.prism-token.prism-escape {
+    color: #d7ba7d
+}
+
+.prism-token.prism-tag {
+    color: #569cd6
+}
+
+    .prism-token.prism-tag .prism-token.prism-punctuation {
+        color: grey
+    }
+
+.prism-token.prism-cdata {
+    color: grey
+}
+
+.prism-token.prism-attr-name {
+    color: #9cdcfe
+}
+
+.prism-token.prism-attr-value, .prism-token.prism-attr-value .prism-token.prism-punctuation {
+    color: #ce9178
+}
+
+    .prism-token.prism-attr-value .prism-token.prism-punctuation.prism-attr-equals {
+        color: #d4d4d4
+    }
+
+.prism-token.prism-entity {
+    color: #569cd6
+}
+
+.prism-token.prism-namespace {
+    color: #4ec9b0
+}
+
+code[class*=language-javascript], code[class*=language-jsx], code[class*=language-tsx], code[class*=language-typescript], pre[class*=language-javascript], pre[class*=language-jsx], pre[class*=language-tsx], pre[class*=language-typescript] {
+    color: #9cdcfe
+}
+
+code[class*=language-css], pre[class*=language-css] {
+    color: #ce9178
+}
+
+code[class*=language-html], pre[class*=language-html] {
+    color: #d4d4d4
+}
+
+.language-regex .prism-token.prism-anchor {
+    color: #dcdcaa
+}
+
+.language-html .prism-token.prism-punctuation {
+    color: grey
+}
+
+.line-highlight.line-highlight {
+    background: #f7ebc6;
+}
diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js b/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js
index d7b5c529f..2414e3695 100644
--- a/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js
+++ b/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js
@@ -17,6 +17,7 @@
 
 function highlightCode() {
     if (Prism) {
+        Prism.plugins.customClass.prefix('prism-');
         Prism.highlightAll();
     }
 };
@@ -33,3 +34,101 @@ function navigateToHeading() {
     }
 }
 
+// THEMES
+const STORAGE_KEY = "blazorbootstrap-theme";
+const DEFAULT_THEME = "light";
+const SYSTEM_THEME = "system";
+
+const state = {
+    chosenTheme: SYSTEM_THEME, // light|dark|system
+    appliedTheme: DEFAULT_THEME // light|dark
+};
+
+const showActiveTheme = () => {
+    let $themeIndicator = document.querySelector(".blazorbootstrap-theme-indicator>i");
+    if ($themeIndicator) {
+        if (state.appliedTheme === "light") {
+            $themeIndicator.className = "bi bi-sun-fill";
+        } else if (state.appliedTheme === "dark") {
+            $themeIndicator.className = "bi bi-moon-stars-fill";
+        } else {
+            $themeIndicator.className = "bi bi-circle-half";
+        }
+    }
+
+    let $themeSwitchers = document.querySelectorAll(".blazorbootstrap-theme-item>button");
+    if ($themeSwitchers) {
+        $themeSwitchers.forEach((el) => {
+            const bsThemeValue = el.dataset.bsThemeValue;
+            const iEl = el.querySelector(".bi.bi-check2");
+            if (state.chosenTheme === bsThemeValue) {
+                el.classList.add("active");
+                if (iEl)
+                    iEl.classList.remove("d-none");
+            } else {
+                el.classList.remove("active");
+                if (iEl)
+                    iEl.classList.add("d-none");
+            }
+        });
+    }
+};
+
+function setTheme(theme, save = true) {
+    state.chosenTheme = theme;
+    state.appliedTheme = theme;
+
+    if (theme === SYSTEM_THEME) {
+        state.appliedTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    }
+
+    document.documentElement.setAttribute("data-bs-theme", state.appliedTheme);
+    if (save) {
+        window.localStorage.setItem(STORAGE_KEY, state.chosenTheme);
+    }
+    showActiveTheme();
+    updateDemoCodeThemeCss(state.appliedTheme);
+};
+
+function initializeTheme() {
+    const localTheme = window.localStorage.getItem(STORAGE_KEY);
+    if (localTheme) {
+        setTheme(localTheme, false);
+    } else {
+        setTheme(SYSTEM_THEME);
+    }
+}
+
+window
+    .matchMedia("(prefers-color-scheme: dark)")
+    .addEventListener("change", (event) => {
+        const theme = event.matches ? "dark" : "light";
+        setTheme(theme);
+    });
+
+function updateDemoCodeThemeCss(theme) {
+    if (theme === "dark") {
+        let prismThemeLightLinkEl = document.getElementById('prismThemeLightLink');
+        if (prismThemeLightLinkEl)
+            prismThemeLightLinkEl?.remove();
+
+        let prismThemeDarkLinkEl = document.createElement("link");
+        prismThemeDarkLinkEl.setAttribute("rel", "stylesheet");
+        prismThemeDarkLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vsc-dark-plus.min.css");
+        prismThemeDarkLinkEl.setAttribute("id", "prismThemeDarkLink");
+
+        document.head.append(prismThemeDarkLinkEl);
+    }
+    else if (theme === "light") {
+        let prismThemeDarkLinkEl = document.getElementById('prismThemeDarkLink');
+        if (prismThemeDarkLinkEl)
+            prismThemeDarkLinkEl?.remove();
+
+        let prismThemeLightLinkEl = document.createElement("link");
+        prismThemeLightLinkEl.setAttribute("rel", "stylesheet");
+        prismThemeLightLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vs.min.css");
+        prismThemeLightLinkEl.setAttribute("id", "prismThemeLightLink");
+
+        document.head.append(prismThemeLightLinkEl);
+    }
+}
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.Server/Components/App.razor b/BlazorBootstrap.Demo.Server/Components/App.razor
index 48894caed..36d417c47 100644
--- a/BlazorBootstrap.Demo.Server/Components/App.razor
+++ b/BlazorBootstrap.Demo.Server/Components/App.razor
@@ -10,7 +10,6 @@
     
     
     
-    
     
     
     
@@ -51,9 +50,10 @@
     
     
     
-    
     
     
+    
+    
 
 
 
diff --git a/blazorbootstrap/Components/Callout/Callout.razor.css b/blazorbootstrap/Components/Callout/Callout.razor.css
index 5fb5e2a29..99676fc1d 100644
--- a/blazorbootstrap/Components/Callout/Callout.razor.css
+++ b/blazorbootstrap/Components/Callout/Callout.razor.css
@@ -1,6 +1,9 @@
 .bb-callout {
-    --bs-link-color-rgb: var(--bb-callout-link);
+    --bb-callout-color: var(--bs-secondary-text-emphasis);
+    --bb-callout-bg: var(--bs-secondary-bg-subtle);
+    --bb-callout-border: var(--bs-secondary-border-subtle);
     --bs-code-color: var(--bb-callout-code-color);
+    --bs-link-color-rgb: var(--bb-callout-link);
     padding: 1.25rem;
     margin-top: 1.25rem;
     margin-bottom: 1.25rem;
diff --git a/blazorbootstrap/Components/Modals/Modal.razor.cs b/blazorbootstrap/Components/Modals/Modal.razor.cs
index 2183d9506..d840f81fe 100644
--- a/blazorbootstrap/Components/Modals/Modal.razor.cs
+++ b/blazorbootstrap/Components/Modals/Modal.razor.cs
@@ -245,7 +245,7 @@ private async Task ShowAsync(string? title, string? message, Type? type, Diction
 
     // Modal close "X" button with bootstrap 5.3.3 - https://github.com/vikramlearning/blazorbootstrap/issues/714
     // Review this fix after bootstrap 5.3.4 or 5.4 release. Ref: https://github.com/twbs/bootstrap/issues/39798
-    private string headerCssClassInternal => $"justify-content-between {ModalType.ToModalHeaderColorClass()}";
+    private string headerCssClassInternal => $"justify-content-between {ModalType.ToModalHeaderColorClass()}".Trim();
 
     /// 
     /// Gets or sets the header template.
@@ -302,10 +302,10 @@ private async Task ShowAsync(string? title, string? message, Type? type, Diction
     /// Gets or sets the modal type.
     /// 
     /// 
-    /// Default value is .
+    /// Default value is .
     /// 
     [Parameter]
-    public ModalType ModalType { get; set; } = ModalType.Light;
+    public ModalType ModalType { get; set; } = ModalType.None;
 
     /// 
     /// This event is fired when an offcanvas element has been hidden from the user (will wait for CSS transitions to
diff --git a/blazorbootstrap/Components/Toasts/Toast.razor.cs b/blazorbootstrap/Components/Toasts/Toast.razor.cs
index d16ec42c6..c013f7979 100644
--- a/blazorbootstrap/Components/Toasts/Toast.razor.cs
+++ b/blazorbootstrap/Components/Toasts/Toast.razor.cs
@@ -149,9 +149,7 @@ private IconName GetToastIconName() =>
     #region Properties, Indexers
 
     protected override string? ClassNames =>
-        BuildClassNames(Class,
-            (BootstrapClass.Toast, true),
-            (BackgroundColor.White.ToBackgroundClass(), true));
+        BuildClassNames(Class, (BootstrapClass.Toast, true));
 
     /// 
     /// Gets or sets the auto hide state.
diff --git a/blazorbootstrap/Enums/ModalType.cs b/blazorbootstrap/Enums/ModalType.cs
index 9b065670a..8b99f7ed2 100644
--- a/blazorbootstrap/Enums/ModalType.cs
+++ b/blazorbootstrap/Enums/ModalType.cs
@@ -2,6 +2,7 @@
 
 public enum ModalType
 {
+    None,
     Primary,
     Secondary,
     Success,
diff --git a/blazorbootstrap/Models/ModalOption.cs b/blazorbootstrap/Models/ModalOption.cs
index 58abb9e55..76cd24e0f 100644
--- a/blazorbootstrap/Models/ModalOption.cs
+++ b/blazorbootstrap/Models/ModalOption.cs
@@ -45,9 +45,9 @@ public class ModalOption
     public string Title { get; set; } = default!;
 
     /// 
-    /// Gets or sets the modal type. Default value is `ModalType.Light`.
+    /// Gets or sets the modal type. Default value is `ModalType.None`.
     /// 
-    public ModalType Type { get; set; } = ModalType.Light;
+    public ModalType Type { get; set; } = ModalType.None;
 
     #endregion
 }
diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.css b/blazorbootstrap/wwwroot/blazor.bootstrap.css
index 5571ea62b..5e532d082 100644
--- a/blazorbootstrap/wwwroot/blazor.bootstrap.css
+++ b/blazorbootstrap/wwwroot/blazor.bootstrap.css
@@ -11,28 +11,6 @@
     --bb-offcanvas-footer-padding-x: 1rem;
     --bb-offcanvas-horizontal-width-sm: 300px;
     --bb-offcanvas-horizontal-width-lg: 800px;
-    /* sidebar */
-    --bb-violet: #712cf9;
-    --bb-sidebar-width: 270px;
-    --bb-sidebar-collapsed-width: 50px;
-    --bb-sidebar-background-color: rgba(255, 255, 255, 1);
-    --bb-sidebar-top-row-background-color: var(--bb-violet);
-    --bb-sidebar-top-row-border-color: var(--bb-violet);
-    --bb-sidebar-title-text-color: rgb(255,255,255);
-    --bb-sidebar-brand-icon-color: rgb(255,255,255);
-    --bb-sidebar-brand-image-width: 24px;
-    --bb-sidebar-brand-image-height: 24px;
-    --bb-sidebar-title-badge-text-color: var(--bb-violet);
-    --bb-sidebar-title-badge-background-color: rgb(255,255,255);
-    --bb-sidebar-navbar-toggler-icon-color: var(--bb-violet);
-    --bb-sidebar-navbar-toggler-background-color: rgb(255,255,255);
-    --bb-sidebar-content-border-color: rgb(214,213,213);
-    --bb-sidebar-nav-item-text-color: rgba(0,0,0,0.9);
-    --bb-sidebar-nav-item-text-active-color-rgb: 112.520718,44.062154,249.437846;
-    --bb-sidebar-nav-item-text-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
-    --bb-sidebar-nav-item-text-active-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
-    --bb-sidebar-nav-item-background-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
-    --bb-sidebar-nav-item-group-background-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
     /* custom tooltip */
     --bb-tooltip-primary: var(--bs-primary);
     --bb-tooltip-secondary: var(--bs-secondary);
@@ -48,30 +26,54 @@
     --bs-border-radius-xs: 0.125rem;
     --bs-border-radius-md: 0.375rem;
     /* table */
-    --bb-table-sticky-background-color: #fff;
-    --bb-table-freeze-column-background-color: #efefef;
+    --bb-table-sticky-background-color: var(--bs-body-bg);
+    --bb-table-freeze-column-background-color: var(--bs-body-bg);
     --bb-table-selected-row-color: #000;
-    --bb-table-selected-row-hover-color: #000;
     --bb-table-selected-row-background-color: rgba(0,0,0,0.075);
+    --bb-table-selected-row-hover-color: #000;
     --bb-table-selected-row-hover-background-color: rgba(0,0,0,0.075);
     /* enum filter */
     --bb-grid-filter-dropdown-max-height: 300px;
     /* callout */
     --bb-callout-link: 10, 88, 202;
     --bb-callout-code-color: #ab296a;
+    /* sidebar */
+    --bb-violet: #9461fb;
+    --bb-violet-bg: #712cf9;
+    --bb-violet-bg-rgb: 113,44,249;
+    --bb-sidebar-width: 270px;
+    --bb-sidebar-collapsed-width: 50px;
+    --bb-sidebar-background-color: rgba(255, 255, 255, 1);
+    --bb-sidebar-top-row-background-color: var(--bb-violet-bg);
+    --bb-sidebar-top-row-border-color: var(--bb-violet-bg);
+    --bb-sidebar-title-text-color: rgb(255,255,255);
+    --bb-sidebar-brand-icon-color: rgb(255,255,255);
+    --bb-sidebar-brand-image-width: 24px;
+    --bb-sidebar-brand-image-height: 24px;
+    --bb-sidebar-title-badge-text-color: var(--bb-violet-bg);
+    --bb-sidebar-title-badge-background-color: rgb(255,255,255);
+    --bb-sidebar-navbar-toggler-icon-color: var(--bb-violet-bg);
+    --bb-sidebar-navbar-toggler-background-color: rgb(255,255,255);
+    --bb-sidebar-content-border-color: rgb(214,213,213);
+    --bb-sidebar-nav-item-text-color: rgba(0,0,0,0.9);
+    --bb-sidebar-nav-item-text-active-color-rgb: 112.520718,44.062154,249.437846;
+    --bb-sidebar-nav-item-text-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
+    --bb-sidebar-nav-item-text-active-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.9);
+    --bb-sidebar-nav-item-background-hover-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
+    --bb-sidebar-nav-item-group-background-color: rgba(var(--bb-sidebar-nav-item-text-active-color-rgb),0.08);
     /* sidebar2 */
     --bb-sidebar2-width: 270px;
     --bb-sidebar2-collapsed-width: 50px;
     --bb-sidebar2-background-color: rgba(255, 255, 255, 1);
-    --bb-sidebar2-top-row-background-color: var(--bb-violet);
-    --bb-sidebar2-top-row-border-color: var(--bb-violet);
+    --bb-sidebar2-top-row-background-color: var(--bb-violet-bg);
+    --bb-sidebar2-top-row-border-color: var(--bb-violet-bg);
     --bb-sidebar2-title-text-color: rgb(255,255,255);
     --bb-sidebar2-brand-icon-color: rgb(255,255,255);
     --bb-sidebar2-brand-image-width: 24px;
     --bb-sidebar2-brand-image-height: 24px;
-    --bb-sidebar2-title-badge-text-color: var(--bb-violet);
+    --bb-sidebar2-title-badge-text-color: var(--bb-violet-bg);
     --bb-sidebar2-title-badge-background-color: rgb(255,255,255);
-    --bb-sidebar2-navbar-toggler-icon-color: var(--bb-violet);
+    --bb-sidebar2-navbar-toggler-icon-color: var(--bb-violet-bg);
     --bb-sidebar2-navbar-toggler-background-color: rgb(255,255,255);
     --bb-sidebar2-content-border-color: rgb(214,213,213);
     --bb-sidebar2-nav-item-text-color: rgba(0,0,0,0.9);
@@ -82,6 +84,43 @@
     --bb-sidebar2-nav-item-group-background-color: rgba(var(--bb-sidebar2-nav-item-text-active-color-rgb),0.08);
 }
 
+[data-bs-theme=dark] {
+    /* sidebar */
+    --bb-sidebar-background-color: var(--bs-body-bg);
+    --bb-sidebar-top-row-background-color: var(--bs-body-bg);
+    --bb-sidebar-top-row-border-color: var(--bs-border-color);
+    --bb-sidebar-title-text-color: var(--bs-body-color);
+    --bb-sidebar-brand-icon-color: var(--bs-body-color);
+    --bb-sidebar-title-badge-text-color: var(--bs-body-color);
+    --bb-sidebar-title-badge-background-color: var(--bs-border-color);
+    --bb-sidebar-navbar-toggler-icon-color: var(--bs-body-color);
+    --bb-sidebar-navbar-toggler-background-color: var(--bs-body-bg);
+    --bb-sidebar-content-border-color: var(--bs-border-color);
+    --bb-sidebar-nav-item-text-color: var(--bs-body-color);
+    --bb-sidebar-nav-item-text-active-color-rgb: 112.520718,44.062154,249.437846;
+    --bb-sidebar-nav-item-text-hover-color: var(--bs-emphasis-color);
+    --bb-sidebar-nav-item-text-active-color: var(--bs-emphasis-color);
+    --bb-sidebar-nav-item-background-hover-color: rgba(var(--bb-violet-bg-rgb),0.5);
+    --bb-sidebar-nav-item-group-background-color: rgba(var(--bb-violet-bg-rgb),0.2);
+    /* sidebar2 */
+    --bb-sidebar2-background-color: var(--bs-body-bg);
+    --bb-sidebar2-top-row-background-color: var(--bs-body-bg);
+    --bb-sidebar2-top-row-border-color: var(--bs-border-color);
+    --bb-sidebar2-title-text-color: var(--bs-body-color);
+    --bb-sidebar2-brand-icon-color: var(--bs-body-color);
+    --bb-sidebar2-title-badge-text-color: var(--bs-body-color);
+    --bb-sidebar2-title-badge-background-color: var(--bs-border-color);
+    --bb-sidebar2-navbar-toggler-icon-color: var(--bs-body-color);
+    --bb-sidebar2-navbar-toggler-background-color: var(--bs-body-bg);
+    --bb-sidebar2-content-border-color: var(--bs-border-color);
+    --bb-sidebar2-nav-item-text-color: var(--bs-body-color);
+    --bb-sidebar2-nav-item-text-active-color-rgb: 112.520718,44.062154,249.437846;
+    --bb-sidebar2-nav-item-text-hover-color: var(--bs-emphasis-color);
+    --bb-sidebar2-nav-item-text-active-color: var(--bs-emphasis-color);
+    --bb-sidebar2-nav-item-background-hover-color: rgba(var(--bb-violet-bg-rgb),0.5);
+    --bb-sidebar2-nav-item-group-background-color: rgba(var(--bb-violet-bg-rgb),0.2);
+}
+
 /* grid - enum dropdown */
 @media (max-width: 767px) {
     .table-responsive .bb-dropdown-menu-enum,
@@ -450,8 +489,8 @@ main {
 }
 
 .bb-top-row {
-    background-color: #f7f7f7;
-    border-bottom: 1px solid #d6d5d5;
+    background-color: var(--bs-body-bg);
+    border-bottom: 1px solid var(--bs-border-color);
     justify-content: flex-end;
     height: 3.5rem;
     display: flex;

From 965b49dadd9e93cfff29b088c8d085f2bc3b758c Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Sun, 6 Oct 2024 23:41:06 +0530
Subject: [PATCH 03/23] Dark mode + Demo  component - CSS Class updated

---
 BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor
index 84d057fa8..41e92cb24 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor
@@ -73,7 +73,7 @@ else // Tabs = true
                         
                     
                 
    
-                
    
+                
    
                     
                             
                             @if (snippet is not null)

From 2abbe9d8a6b08afc47b8135787fc2d1535f805d1 Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Fri, 11 Oct 2024 22:17:50 +0530
Subject: [PATCH 04/23] #871 - Grid enum filter - select text translation
 support (#905)

* #871 - Grid enum filter - select text translation support added.
---
 ...Grid_Demo_01_A_Client_Side_Filtering.razor |   9 +-
 ... => Grid_Demo_02_Set_Default_Filter.razor} |   0
 ...o_03_Disable_Specific_Column_Filter.razor} |   0
 ...mo_04_Increase_Filter_Textbox_Width.razor} |   0
 ....razor => Grid_Demo_05_Enum_Filters.razor} |   9 +-
 ....razor => Grid_Demo_06_Guid_Filters.razor} |   9 +-
 .../Grid_Filters_Documentation.razor          |  10 +-
 .../Grid_Demo_01_Translations.razor           | 101 ++++++++++++++++++
 .../Grid_Demo_31_Translations.razor           |  89 ---------------
 .../Grid_Translations_Documentation.razor     |   2 +-
 blazorbootstrap/Components/Grid/Grid.razor    |   5 +-
 blazorbootstrap/Components/Grid/Grid.razor.cs |   9 ++
 .../Components/Grid/GridColumn.razor.cs       |   3 +-
 .../Components/Grid/GridColumnFilter.razor    |   2 +-
 .../Components/Grid/GridColumnFilter.razor.cs |   3 +
 docs/docs/05-components/grid.mdx              |  75 +++++++------
 16 files changed, 172 insertions(+), 154 deletions(-)
 rename BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/{Grid_Demo_05_Set_Default_Filter.razor => Grid_Demo_02_Set_Default_Filter.razor} (100%)
 rename BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/{Grid_Demo_06_Disable_Specific_Column_Filter.razor => Grid_Demo_03_Disable_Specific_Column_Filter.razor} (100%)
 rename BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/{Grid_Demo_06_Increase_Filter_Textbox_Width.razor => Grid_Demo_04_Increase_Filter_Textbox_Width.razor} (100%)
 rename BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/{Grid_Demo_35_Enum_Filters.razor => Grid_Demo_05_Enum_Filters.razor} (92%)
 rename BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/{Grid_Demo_36_Guid_Filters.razor => Grid_Demo_06_Guid_Filters.razor} (93%)
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
 delete mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_31_Translations.razor

diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_01_A_Client_Side_Filtering.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_01_A_Client_Side_Filtering.razor
index f72ff5d5a..0795e9c95 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_01_A_Client_Side_Filtering.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_01_A_Client_Side_Filtering.razor
@@ -1,5 +1,4 @@
-
 
 @code {
-    BlazorBootstrap.Grid grid = default!;
     private IEnumerable employees = default!;
 
-    protected override async Task OnAfterRenderAsync(bool firstRender)
-    {
-        await base.OnAfterRenderAsync(firstRender);
-    }
-
     private async Task> EmployeesDataProvider(GridDataProviderRequest request)
     {
         if (employees is null) // pull employees only one time for client-side filtering, sorting, and paging
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_05_Set_Default_Filter.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_02_Set_Default_Filter.razor
similarity index 100%
rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_05_Set_Default_Filter.razor
rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_02_Set_Default_Filter.razor
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Disable_Specific_Column_Filter.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_03_Disable_Specific_Column_Filter.razor
similarity index 100%
rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Disable_Specific_Column_Filter.razor
rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_03_Disable_Specific_Column_Filter.razor
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Increase_Filter_Textbox_Width.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_04_Increase_Filter_Textbox_Width.razor
similarity index 100%
rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Increase_Filter_Textbox_Width.razor
rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_04_Increase_Filter_Textbox_Width.razor
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_35_Enum_Filters.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_05_Enum_Filters.razor
similarity index 92%
rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_35_Enum_Filters.razor
rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_05_Enum_Filters.razor
index 7698d5e10..f642a5b1d 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_35_Enum_Filters.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_05_Enum_Filters.razor
@@ -1,5 +1,4 @@
-
 
 @code {
-    BlazorBootstrap.Grid grid = default!;
     private IEnumerable users = default!;
 
-    protected override async Task OnAfterRenderAsync(bool firstRender)
-    {
-        await base.OnAfterRenderAsync(firstRender);
-    }
-
     private async Task> UsersDataProvider(GridDataProviderRequest request)
     {
         if (users is null) // pull employees only one time for client-side filtering, sorting, and paging
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_36_Guid_Filters.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Guid_Filters.razor
similarity index 93%
rename from BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_36_Guid_Filters.razor
rename to BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Guid_Filters.razor
index 0288aaff2..9d226d025 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_36_Guid_Filters.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Demo_06_Guid_Filters.razor
@@ -1,5 +1,4 @@
-
 
 @code {
-    BlazorBootstrap.Grid grid = default!;
     private IEnumerable users = default!;
 
-    protected override async Task OnAfterRenderAsync(bool firstRender)
-    {
-        await base.OnAfterRenderAsync(firstRender);
-    }
-
     private async Task> UsersDataProvider(GridDataProviderRequest request)
     {
         if (users is null) // pull employees only one time for client-side filtering, sorting, and paging
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor
index 6710e28f1..855ba0448 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor
@@ -27,18 +27,18 @@
 
    
 You can set the default filter on more than one GridColumn.
 
    The default sorting is enabled on the Id column in the below example.
    
-
+
 
 
 
    
     Filterable parameter is required to disable the filter on a specific column. Add Filterable="false" parameter to GridColumn. The column filter is disabled on the Id column in the below example.
 
    
-
+
 
 
 
    Add FilterTextboxWidth parameter to the GridColumn to increase or decrease the filter textbox width, FilterTextboxWidth parameter is optional.
    
 Filter textbox width measured in pixels.
-
+
 
 
     
    
@@ -51,10 +51,10 @@
 
 
 
-
+
 
 
-
+
 
 @code {
     private const string pageUrl = "/grid/filters";
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
new file mode 100644
index 000000000..1af66a71d
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
@@ -0,0 +1,101 @@
+
+
+    
+        
+            @context.Id
+        
+        
+            @context.Name
+        
+        
+            @context.DOB
+        
+        
+            @context.Status
+        
+    
+
+
+
+@code {
+    private IEnumerable users = default!;
+
+    private async Task> GridFiltersTranslationProvider()
+    {
+        var filtersTranslation = new List();
+
+        // number/date/boolean
+        filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals));
+        filtersTranslation.Add(new("!=", "Niet gelijk", FilterOperator.NotEquals));
+        // number/date
+        filtersTranslation.Add(new("<", "Minder dan", FilterOperator.LessThan));
+        filtersTranslation.Add(new("<=", "Kleiner dan of gelijk aan", FilterOperator.LessThanOrEquals));
+        filtersTranslation.Add(new(">", "Groter dan", FilterOperator.GreaterThan));
+        filtersTranslation.Add(new(">=", "Groter dan of gelijk aan", FilterOperator.GreaterThanOrEquals));
+        // string
+        filtersTranslation.Add(new("*a*", "Bevat", FilterOperator.Contains));
+        filtersTranslation.Add(new("a**", "Begint met", FilterOperator.StartsWith));
+        filtersTranslation.Add(new("**a", "Eindigt met", FilterOperator.EndsWith));
+        filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals));
+        // common
+        filtersTranslation.Add(new("x", "Duidelijk", FilterOperator.Clear));
+
+        return await Task.FromResult(filtersTranslation);
+    }
+
+
+    private async Task> UsersDataProvider(GridDataProviderRequest request)
+    {
+        if (users is null) // pull employees only one time for client-side filtering, sorting, and paging
+            users = GetUsers(); // call a service or an API to pull the employees
+
+        return await Task.FromResult(request.ApplyTo(users));
+    }
+
+    private IEnumerable GetUsers()
+    {
+        return new List
+        {
+            new User { Id = 107, Name = "Alice", DOB = new DateOnly(1998, 11, 17), Status = UserStatus.Registered },
+            new User { Id = null, Name = "Bob", DOB = new DateOnly(1985, 1, 5), Status = UserStatus.Verified },
+            new User { Id = 106, Name = "John", DOB = new DateOnly(1995, 4, 17), Status = UserStatus.Registered },
+            new User { Id = 104, Name = "Pop", DOB = new DateOnly(1985, 6, 8), Status = UserStatus.Registered },
+            new User { Id = 105, Name = "Ronald", DOB = new DateOnly(1991, 8, 23), Status = UserStatus.VerificationPending },
+            new User { Id = 102, Name = "Line", DOB = new DateOnly(1977, 1, 12), Status = UserStatus.VerificationPending },
+            new User { Id = 101, Name = "Daniel", DOB = new DateOnly(1977, 1, 12), Status = UserStatus.Registered },
+            new User { Id = 108, Name = "Zayne", DOB = new DateOnly(1991, 1, 1), Status = UserStatus.Verified },
+            new User { Id = 109, Name = "Isha", DOB = null, Status = UserStatus.Verified },
+            new User { Id = 110, Name = "Vijay", DOB = new DateOnly(1990, 7, 1), Status = UserStatus.Verified },
+        };
+    }
+
+    public record class User
+    {
+        public int? Id { get; set; }
+        public string? Name { get; set; }
+        public DateOnly? DOB { get; set; }
+        public UserStatus Status { get; set; }
+    }
+
+    public enum UserStatus
+    {
+        Registered,
+        VerificationPending,
+        Verified
+    }
+}
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_31_Translations.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_31_Translations.razor
deleted file mode 100644
index 09b3c8cbb..000000000
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_31_Translations.razor
+++ /dev/null
@@ -1,89 +0,0 @@
-
-
-    
-        
-            @context.Id
-        
-        
-            @context.Name
-        
-        
-            @context.Designation
-        
-        
-            @context.DOJ
-        
-        
-            @context.IsActive
-        
-    
-
-
-
-@code {
-    private IEnumerable employees = default!;
-
-    private async Task> GridFiltersTranslationProvider()
-    {
-        var filtersTranslation = new List();
-
-        // number/date/boolean
-        filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals));
-        filtersTranslation.Add(new("!=", "Niet gelijk", FilterOperator.NotEquals));
-        // number/date
-        filtersTranslation.Add(new("<", "Minder dan", FilterOperator.LessThan));
-        filtersTranslation.Add(new("<=", "Kleiner dan of gelijk aan", FilterOperator.LessThanOrEquals));
-        filtersTranslation.Add(new(">", "Groter dan", FilterOperator.GreaterThan));
-        filtersTranslation.Add(new(">=", "Groter dan of gelijk aan", FilterOperator.GreaterThanOrEquals));
-        // string
-        filtersTranslation.Add(new("*a*", "Bevat", FilterOperator.Contains));
-        filtersTranslation.Add(new("a**", "Begint met", FilterOperator.StartsWith));
-        filtersTranslation.Add(new("**a", "Eindigt met", FilterOperator.EndsWith));
-        filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals));
-        // common
-        filtersTranslation.Add(new("x", "Duidelijk", FilterOperator.Clear));
-
-        return await Task.FromResult(filtersTranslation);
-    }
-
-    private async Task> EmployeesDataProvider(GridDataProviderRequest request)
-    {
-        if (employees is null) // pull employees only one time for client-side filtering, sorting, and paging
-            employees = GetEmployees(); // call a service or an API to pull the employees
-
-        return await Task.FromResult(request.ApplyTo(employees));
-    }
-
-    private IEnumerable GetEmployees()
-    {
-        return new List
-        {
-            new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true },
-            new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true },
-            new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true },
-            new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false },
-            new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true },
-            new Employee1 { Id = 102, Name = "Line", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true },
-            new Employee1 { Id = 101, Name = "Daniel", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true },
-            new Employee1 { Id = 113, Name = "Merlin", Designation = "Senior Consultant", DOJ = new DateOnly(1989, 10, 2), IsActive = true },
-            new Employee1 { Id = 117, Name = "Sharna", Designation = "Data Analyst", DOJ = new DateOnly(1994, 5, 12), IsActive = true },
-            new Employee1 { Id = 108, Name = "Zayne", Designation = "Data Analyst", DOJ = new DateOnly(1991, 1, 1), IsActive = true },
-            new Employee1 { Id = 109, Name = "Isha", Designation = "App Maker", DOJ = new DateOnly(1996, 7, 1), IsActive = true },
-            new Employee1 { Id = 111, Name = "Glenda", Designation = "Data Engineer", DOJ = new DateOnly(1994, 1, 12), IsActive = true },
-        };
-    }
-}
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor
index 736978820..97a474e11 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor
@@ -11,7 +11,7 @@
 
 
 
    In the example below, you will see translations related to pagination and filters in Dutch.
    
-
+
 
 @code {
     private const string pageUrl = "/grid/translations";
diff --git a/blazorbootstrap/Components/Grid/Grid.razor b/blazorbootstrap/Components/Grid/Grid.razor
index 94fa60e44..88f0c3f50 100644
--- a/blazorbootstrap/Components/Grid/Grid.razor
+++ b/blazorbootstrap/Components/Grid/Grid.razor
@@ -2,7 +2,7 @@
 @inherits BlazorBootstrapComponentBase
 @typeparam TItem
 
-
+
     @ChildContent
 
 
@@ -58,7 +58,8 @@
                             
                                 @if (column.Filterable)
                                 {
-                                     filterItems)
     [Parameter]
     public string EmptyText { get; set; } = "No records to display";
 
+    /// 
+    /// Gets or sets the enum filter select text.
+    /// 
+    /// 
+    /// Default value is 'Select'.
+    /// 
+    [Parameter]
+    public string? EnumFilterSelectText { get; set; } = "Select";
+
     /// 
     /// Gets or sets the filters row css class.
     /// 
diff --git a/blazorbootstrap/Components/Grid/GridColumn.razor.cs b/blazorbootstrap/Components/Grid/GridColumn.razor.cs
index 825f03384..236de2651 100644
--- a/blazorbootstrap/Components/Grid/GridColumn.razor.cs
+++ b/blazorbootstrap/Components/Grid/GridColumn.razor.cs
@@ -411,7 +411,8 @@ private async Task OnSortClickAsync()
     [Parameter]
     public bool IsDefaultSortColumn { get; set; } = false;
 
-    [CascadingParameter] public Grid Parent { get; set; } = default!;
+    [CascadingParameter(Name = "Parent")]
+    public Grid Parent { get; set; } = default!;
 
     /// 
     /// Gets or sets the property name.
diff --git a/blazorbootstrap/Components/Grid/GridColumnFilter.razor b/blazorbootstrap/Components/Grid/GridColumnFilter.razor
index 30d33b4b0..4321a1811 100644
--- a/blazorbootstrap/Components/Grid/GridColumnFilter.razor
+++ b/blazorbootstrap/Components/Grid/GridColumnFilter.razor
@@ -58,7 +58,7 @@
             
                 @if (string.IsNullOrWhiteSpace(filterValue))
                 {
-                    Select
+                    @EnumFilterSelectText
                 }
                 else
                 {
diff --git a/blazorbootstrap/Components/Grid/GridColumnFilter.razor.cs b/blazorbootstrap/Components/Grid/GridColumnFilter.razor.cs
index aed938940..d43af52b2 100644
--- a/blazorbootstrap/Components/Grid/GridColumnFilter.razor.cs
+++ b/blazorbootstrap/Components/Grid/GridColumnFilter.razor.cs
@@ -147,6 +147,9 @@ or StringConstants.PropertyTypeNameDecimal
 
     #region Properties, Indexers
 
+    [Parameter]
+    public string? EnumFilterSelectText { get; set; }
+
     /// 
     /// Gets or sets the filter button color.
     /// 
diff --git a/docs/docs/05-components/grid.mdx b/docs/docs/05-components/grid.mdx
index cb8ece7af..0435972fc 100644
--- a/docs/docs/05-components/grid.mdx
+++ b/docs/docs/05-components/grid.mdx
@@ -35,6 +35,7 @@ Use Blazor Bootstrap grid component to display tabular data from the data source
 | DisableRowSelection | `Func?` | | | Enable or disable the row level checkbox selection. | 1.8.0 |
 | EmptyDataTemplate | RenderFragment | null | ✔️ | Template to render when there are no rows to display. | 1.0.0 |
 | EmptyText | string | `No records to display` | | Shows text on no records. | 1.0.0 |
+| EnumFilterSelectText | string | `Select` | | Gets or sets the enum filter select text. | 3.1.0 |
 | FiltersRowCssClass | string | null | | Gets or sets the filters row css class. | 1.9.2 |
 | FiltersTranslationProvider | `GridFiltersTranslationDelegate` | null | | Filters transalation is for grid filters to render. The provider should always return a 'FilterOperatorInfo' collection, and 'null' is not allowed. | 1.10.0 |
 | FixedHeader | bool | false | | Gets or sets the grid fixed header. | 1.10.3 |
@@ -2972,15 +2973,15 @@ Please see the following example where the row text color is set to **#fff (whit
 
 In the example below, you will see translations related to pagination and filters in **Dutch**.
 
-Blazor Bootstrap: Grid Component - Translations
+Blazor Bootstrap: Grid Component - Translations
 
 ```cshtml {8,13-14} showLineNumbers
-
 
     
-        
+        
             @context.Id
         
-        
+        
             @context.Name
         
-        
-            @context.Designation
-        
-        
-            @context.DOJ
+        
+            @context.DOB
         
-        
-            @context.IsActive
+        
+            @context.Status
         
     
 
@@ -3014,7 +3013,7 @@ In the example below, you will see translations related to pagination and filter
 
 ```cs {4-25} showLineNumbers
 @code {
-    private IEnumerable employees = default!;
+    private IEnumerable users = default!;
 
     private async Task> GridFiltersTranslationProvider()
     {
@@ -3039,32 +3038,46 @@ In the example below, you will see translations related to pagination and filter
         return await Task.FromResult(filtersTranslation);
     }
 
-    private async Task> EmployeesDataProvider(GridDataProviderRequest request)
+
+    private async Task> UsersDataProvider(GridDataProviderRequest request)
     {
-        if (employees is null) // pull employees only one time for client-side filtering, sorting, and paging
-            employees = GetEmployees(); // call a service or an API to pull the employees
+        if (users is null) // pull employees only one time for client-side filtering, sorting, and paging
+            users = GetUsers(); // call a service or an API to pull the employees
 
-        return await Task.FromResult(request.ApplyTo(employees));
+        return await Task.FromResult(request.ApplyTo(users));
     }
 
-    private IEnumerable GetEmployees()
+    private IEnumerable GetUsers()
     {
-        return new List
+        return new List
         {
-            new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true },
-            new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true },
-            new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true },
-            new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false },
-            new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true },
-            new Employee1 { Id = 102, Name = "Line", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true },
-            new Employee1 { Id = 101, Name = "Daniel", Designation = "Architect", DOJ = new DateOnly(1977, 1, 12), IsActive = true },
-            new Employee1 { Id = 113, Name = "Merlin", Designation = "Senior Consultant", DOJ = new DateOnly(1989, 10, 2), IsActive = true },
-            new Employee1 { Id = 117, Name = "Sharna", Designation = "Data Analyst", DOJ = new DateOnly(1994, 5, 12), IsActive = true },
-            new Employee1 { Id = 108, Name = "Zayne", Designation = "Data Analyst", DOJ = new DateOnly(1991, 1, 1), IsActive = true },
-            new Employee1 { Id = 109, Name = "Isha", Designation = "App Maker", DOJ = new DateOnly(1996, 7, 1), IsActive = true },
-            new Employee1 { Id = 111, Name = "Glenda", Designation = "Data Engineer", DOJ = new DateOnly(1994, 1, 12), IsActive = true },
+            new User { Id = 107, Name = "Alice", DOB = new DateOnly(1998, 11, 17), Status = UserStatus.Registered },
+            new User { Id = null, Name = "Bob", DOB = new DateOnly(1985, 1, 5), Status = UserStatus.Verified },
+            new User { Id = 106, Name = "John", DOB = new DateOnly(1995, 4, 17), Status = UserStatus.Registered },
+            new User { Id = 104, Name = "Pop", DOB = new DateOnly(1985, 6, 8), Status = UserStatus.Registered },
+            new User { Id = 105, Name = "Ronald", DOB = new DateOnly(1991, 8, 23), Status = UserStatus.VerificationPending },
+            new User { Id = 102, Name = "Line", DOB = new DateOnly(1977, 1, 12), Status = UserStatus.VerificationPending },
+            new User { Id = 101, Name = "Daniel", DOB = new DateOnly(1977, 1, 12), Status = UserStatus.Registered },
+            new User { Id = 108, Name = "Zayne", DOB = new DateOnly(1991, 1, 1), Status = UserStatus.Verified },
+            new User { Id = 109, Name = "Isha", DOB = null, Status = UserStatus.Verified },
+            new User { Id = 110, Name = "Vijay", DOB = new DateOnly(1990, 7, 1), Status = UserStatus.Verified },
         };
     }
+
+    public record class User
+    {
+        public int? Id { get; set; }
+        public string? Name { get; set; }
+        public DateOnly? DOB { get; set; }
+        public UserStatus Status { get; set; }
+    }
+
+    public enum UserStatus
+    {
+        Registered,
+        VerificationPending,
+        Verified
+    }
 }
 ```
 

From 9bc900944595fb4185e4e7e3dfd34f582f0384ba Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Mon, 21 Oct 2024 13:57:52 +0530
Subject: [PATCH 05/23] Markdown updates (#909)

* Added additional demo example placeholders

* #904 Translation in GRID "Does not contain"

* Markdown - New component - updates
---
 .../Grid_Demo_01_Translations.razor           |   1 +
 .../Components/Pages/Index.razor              |   6 +-
 .../Markdown/MarkdownDocumentation.razor      |  83 ++-
 .../Markdown/Markdown_Demo_01_Examples.razor  |  15 -
 .../Markdown/Markdown_Demo_01_Preview.razor   |  21 +
 .../Markdown/Markdown_Demo_02_Headers.razor   |  11 +-
 ...n_Demo_03_Paragraphs_and_Line_Breaks.razor |   8 +-
 .../Markdown_Demo_04_Blockquotes.razor        |  12 +-
 .../Markdown_Demo_05_Horizontal_Rules.razor   |   7 +-
 ..._Emphasis_bold_italics_strikethrough.razor |   6 +-
 .../Markdown_Demo_07_Code_Highlighting.razor  |  54 +-
 .../Markdown_Demo_08_Tables_A_Example.razor   |   6 +
 ...own_Demo_08_Tables_B_Custom_CssClass.razor |   9 +
 .../Markdown_Demo_09_Lists_A_Ordered.razor    |   5 +
 .../Markdown_Demo_09_Lists_B_Unordered.razor  |   5 +
 .../Markdown_Demo_09_Lists_C_Nested.razor     |  14 +
 .../Markdown_Demo_09_Lists_D_Nested.razor     |  14 +
 .../Markdown_Demo_09_Lists_E_Nested.razor     |  14 +
 .../Markdown/Markdown_Demo_10_Links.razor     |   4 +
 .../Markdown/Markdown_Demo_11_Images.razor    |  11 +
 ...kdown_Demo_12_Checklist_or_Task_List.razor |   8 +
 .../Markdown/Markdown_Demo_13_Emoji.razor     |   3 +
 .../Markdown_Demo_14_Attachments.razor        |   3 +
 ...athematical_Notations_and_Characters.razor |   3 +
 .../Markdown/Markdown_Demo_99_Examples.razor  |  69 ++
 .../wwwroot/css/blazorbootstrap.demo.rcl.css  |   8 +-
 .../Components/Markdown/Markdown.razor        |   2 +-
 .../Components/Markdown/Markdown.razor.cs     | 673 ++++++++++++++++--
 docs/docs/05-components/markdown.mdx          | 308 ++++++++
 29 files changed, 1255 insertions(+), 128 deletions(-)
 delete mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor
 create mode 100644 docs/docs/05-components/markdown.mdx

diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
index 1af66a71d..e55abdadb 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Demo_01_Translations.razor
@@ -49,6 +49,7 @@
         filtersTranslation.Add(new(">=", "Groter dan of gelijk aan", FilterOperator.GreaterThanOrEquals));
         // string
         filtersTranslation.Add(new("*a*", "Bevat", FilterOperator.Contains));
+        filtersTranslation.Add(new("!*a*", "Bevat niet", FilterOperator.DoesNotContain));
         filtersTranslation.Add(new("a**", "Begint met", FilterOperator.StartsWith));
         filtersTranslation.Add(new("**a", "Eindigt met", FilterOperator.EndsWith));
         filtersTranslation.Add(new("=", "gelijk aan", FilterOperator.Equals));
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor
index e63d9fc44..6f3c55ce5 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor
@@ -132,7 +132,7 @@
         
    
         
    
             
-                
     Markdown New
    
+                
     Markdown Preview
    
                 
         
    
         
    
@@ -238,7 +238,7 @@
     
    
 
    
 
-
    
+@* 
    
     
    
         
    AI Components
    
     
    
@@ -250,7 +250,7 @@
             
         
    
     
    
-
    
+
     *@
 
 
    
     
    
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
index ca711ea73..8992bff13 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
@@ -4,39 +4,106 @@
 
 
 
-
    Blazor Markdown
    
+
    Blazor Markdown Preview
    
 
    Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages.
    
 
 
 
-@* 
+
 
    
- *@
+
 
 
-
    
+
    
+    Use headers to structure your content. Start a line with # for a heading. Add more # characters for subheadings, up to six levels.
+
    
 
 
 
-
    
+
    
+    Break your text into paragraphs or line breaks for easier reading.
+
    
 
 
 
-
    
+
    
+    Quote text with > before it. Use more > characters to nest quotes. For blocks of text, use > at the start of each line.
+
    
 
 
 
-
    
+
    
+    Add a horizontal rule with a line of ---.
+
    
 
 
 
-
    
+
    
+    Emphasize text with bold, italics, or strikethrough:
+    
      
+        
    • Italics: *text* or _text_
      • 
+        
    • Bold: **text**
      • 
+        
    • Strikethrough: ~~text~~
      • 
+        
    • Combine for more emphasis.
      • 
+    
    
+
    
 
 
 
 
    
 
 
+
+
    
+    Tables help organize structured data.
+    
      
+        
    • Use | to separate cells.
      • 
+        
    • Escape | with \| if used within a cell.
      • 
+        
    • Use <br /> for new lines within a cell.
      • 
+        
    • End each row with a carriage return (CR) or line feed (LF).
      • 
+    
    
+
    
+
+
    
+
+
+
+
    
+    Use lists to organize related items:
+    
      
+        
    • Ordered lists: start with a number followed by a period.
      • 
+        
    • Unordered lists: start with a -.
      • 
+        
    • Begin each list item on a new line.
      • 
+    
        
+
    
+
+
    
+
+
+
+
    
+
+
+
+
    
+
+
    
+
+
    
+
+
+
+
    
+
+
+
+
    
+
+
+
+
    
+
+
 @code{
     private string pageUrl = "/markdown";
     private string title = "Blazor Markdown Component";
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor
deleted file mode 100644
index 1a0d708d7..000000000
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Examples.razor
+++ /dev/null
@@ -1,15 +0,0 @@
-
-    Test
-    # Heading level 1
-    ## Heading level 2
-    ### Heading level 3
-    #### Heading level 4
-    ##### Heading level 5
-    ###### Heading level 6  
-
-
-    __bold text__
-    **bold text**
-    _italic text_
-    *italic text*
-
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor
new file mode 100644
index 000000000..28d12daee
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_01_Preview.razor
@@ -0,0 +1,21 @@
+
    
+    
    Markdown
    
+    
    Preview
    
+
    
+
    
+    
    
+        
+    
    
+    
    
+        @markdown
+    
    
+
    
+
+@code {
+    private string markdown = "# Heading 1\n## Heading 2\n\n![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50)";
+}
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor
index 9792ee11e..def554bb8 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_02_Headers.razor
@@ -1,7 +1,8 @@
 
-    # This is a H1 header
-    ## This is a H2 header
-    ### This is a H3 header
-    #### This is a H4 header
-    ##### This is a H5 header
+# This is a H1 header
+## This is a H2 header
+### This is a H3 header
+#### This is a H4 header
+##### This is a H5 header
+###### This is a H6 header
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor
index 24b026e26..d1966b31f 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_03_Paragraphs_and_Line_Breaks.razor
@@ -1,8 +1,8 @@
 
-    Add lines between your text with the **Enter** key.    
-    Your text gets better spaced and makes it easier to read.
+Add lines between your text with the **Enter** key.    
+Your text gets better spaced and makes it easier to read.
 
 
-    Add lines between your text with the **Enter** key.
-    Your text gets better spaced and makes it easier to read.
+Add lines between your text with the **Enter** key.
+Your text gets better spaced and makes it easier to read.
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor
index 8e065dd41..d8bfe956c 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_04_Blockquotes.razor
@@ -1,6 +1,10 @@
 
-    > Single line quote
-    >> Nested quote
-    >> multiple line
-    >> quote
+> A well-known quote, contained in a blockquote element.
+
+
+
+> Single line quote
+>> Nested quote
+>> multiple line
+>> quote
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor
index e7d9c79e5..c7fa6a522 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_05_Horizontal_Rules.razor
@@ -1,6 +1,5 @@
 
-    above
-
-    ----
-    below
+above
+---
+below
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor
index 9ab8f7c56..d505bfb94 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_06_Emphasis_bold_italics_strikethrough.razor
@@ -1,5 +1,5 @@
 
-    Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~
-    **_Bold, italicized text_**
-    **~~Bold, strike-through text~~**
+Use _emphasis_ in comments to express **strong** opinions and point out ~~corrections~~
+**_Bold, italicized text_**
+**~~Bold, strike-through text~~**
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor
index 137c1352d..aede08f0d 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_07_Code_Highlighting.razor
@@ -1,11 +1,53 @@
 
-    ```js
-    const count = records.length;
-    ```
+```js
+const count = records.length;
+```
 
 
 
-    ```csharp
-    Console.WriteLine("Hello, World!");
-    ```
+```csharp
+Console.WriteLine("Hello, World!");
+```
+
+
+
+```csharp
+var countdown = new TimerRemaining()
+{
+    buffer =
+    {
+        [^1] = 0,
+        [^2] = 1,
+        [^3] = 2,
+        [^4] = 3,
+        [^5] = 4,
+        [^6] = 5,
+        [^7] = 6,
+        [^8] = 7,
+        [^9] = 8,
+        [^10] = 9
+    }
+};
+```
+
+
+
+```csharp
+public partial class C
+{
+    // Declaring declaration
+    public partial string Name { get; set; }
+}
+
+public partial class C
+{
+    // implementation declaration:
+    private string _name;
+    public partial string Name
+    {
+        get => _name;
+        set => _name = value;
+    }
+}
+```
 
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor
new file mode 100644
index 000000000..a7b8594f4
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_A_Example.razor
@@ -0,0 +1,6 @@
+
+| Heading 1 | Heading 2 | Heading 3 |
+|--|--|--|
+| Cell A1 | Cell A2 | Cell A3 |
+| Cell B1 | Cell B2 | Cell B3
    second line of text |
+    
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor
new file mode 100644
index 000000000..042de172d
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_08_Tables_B_Custom_CssClass.razor
@@ -0,0 +1,9 @@
+
+| Heading 1 | Heading 2 | Heading 3 |
+|--|--|--|
+| Cell A1 | Cell A2 | Cell A3 |
+| Cell B1 | Cell B2 | Cell B3 |
+| Cell C1 | Cell C2 | Cell C3 |
+| Cell D1 | Cell D2 | Cell D3 |
+| Cell E1 | Cell E2 | Cell E3 |
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor
new file mode 100644
index 000000000..0bbfa42e6
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_A_Ordered.razor
@@ -0,0 +1,5 @@
+
+1. First item
+1. Second item
+1. Third item
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor
new file mode 100644
index 000000000..bb863021f
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_B_Unordered.razor
@@ -0,0 +1,5 @@
+
+- Item 1
+- Item 2
+- Item 3
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor
new file mode 100644
index 000000000..7d926118c
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_C_Nested.razor
@@ -0,0 +1,14 @@
+
+1. First item
+    - Item 1
+    - Item 2
+    - Item 3
+1. Second item
+    - Nested item 1
+        - Further nested item 1
+        - Further nested item 2
+        - Further nested item 3
+    - Nested item 2
+    - Nested item 3
+1. Third item
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor
new file mode 100644
index 000000000..db2e27c2a
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_D_Nested.razor
@@ -0,0 +1,14 @@
+
+1. First item
+    1. Item 1
+    1. Item 2
+    1. Item 3
+1. Second item
+    1. Nested item 1
+        1. Further nested item 1
+        1. Further nested item 2
+        1. Further nested item 3
+    1. Nested item 2
+    1. Nested item 3
+1. Third item
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor
new file mode 100644
index 000000000..2a2511f0e
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_09_Lists_E_Nested.razor
@@ -0,0 +1,14 @@
+
+- First item
+    - Item 1
+    - Item 2
+    - Item 3
+- Second item
+    - Nested item 1
+        - Further nested item 1
+        - Further nested item 2
+        - Further nested item 3
+    - Nested item 2
+    - Nested item 3
+- Third item
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor
new file mode 100644
index 000000000..0b820c373
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_10_Links.razor
@@ -0,0 +1,4 @@
+
+[BlazorBootstrap - Docs](https://docs.blazorbootstrap.com/)
+[BlazorBootstrap - Demos](https://demos.blazorbootstrap.com/)
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor
new file mode 100644
index 000000000..a42123e61
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_11_Images.razor
@@ -0,0 +1,11 @@
+
+![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg)
+
+
+
+![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =200x200)
+
+
+
+![BlazorBootstrap](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50)
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor
new file mode 100644
index 000000000..2776263a9
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_12_Checklist_or_Task_List.razor
@@ -0,0 +1,8 @@
+
+- [ ] A
+- [ ] B
+- [ ] C
+- [x] A
+- [x] B
+- [x] C
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor
new file mode 100644
index 000000000..7941007cc
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_13_Emoji.razor
@@ -0,0 +1,3 @@
+
+Emoji
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor
new file mode 100644
index 000000000..0a9d3c4ec
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_14_Attachments.razor
@@ -0,0 +1,3 @@
+
+Attachments
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor
new file mode 100644
index 000000000..d24bb252d
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_15_Mathematical_Notations_and_Characters.razor
@@ -0,0 +1,3 @@
+
+Mathematical notation and characters
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor
new file mode 100644
index 000000000..cf3ed4ad1
--- /dev/null
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/Markdown_Demo_99_Examples.razor
@@ -0,0 +1,69 @@
+
+# Markdown syntax guide
+
+## Headers
+
+# This is a Heading h1
+## This is a Heading h2
+###### This is a Heading h6
+
+## Emphasis
+
+*This text will be italic*  
+_This will also be italic_
+
+**This text will be bold**  
+__This will also be bold__
+
+_You **can** combine them_
+
+## Lists
+
+### Unordered
+
+* Item 1
+* Item 2
+* Item 2a
+* Item 2b
+
+### Ordered
+
+1. Item 1
+2. Item 2
+3. Item 3
+    1. Item 3a
+    2. Item 3b
+
+## Images
+
+![This is an alt text.](https://demos.blazorbootstrap.com/images/logo/logo-color.svg =50)
+
+## Links
+
+[BlazorBootstrap Demos](https://demos.blazorbootstrap.com/).
+
+## Blockquotes
+
+> Markdown is a lightweight markup language with plain-text-formatting syntax, created in 2004 by John Gruber with Aaron Swartz.
+>> Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor.
+
+## Tables
+
+| Left columns  | Right columns |
+|--|--|
+| left foo | right foo |
+| left bar | right bar |
+| left baz | right baz |
+
+## Blocks of code
+
+```
+let message = 'Hello world';
+alert(message);
+```
+
+## Inline code
+
+This web site is using `markedjs/marked`.
+    
+
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
index 05be8dea8..2a6ff1fc8 100644
--- a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
+++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css
@@ -19,6 +19,7 @@
     --bd-violet-rgb: 112.520718,44.062154,249.437846;
     --docsearch-primary-color: var(--bd-violet);
     --docsearch-logo-color: var(--bd-violet);
+    --bb-example-pre-background: #f5f2f0;
 }
 
 h1:focus-visible {
@@ -346,6 +347,10 @@ h1:focus-visible {
         word-wrap: normal
     }
 
+pre[class*=language-] {
+    background: var(--bb-example-pre-background) !important;
+}
+
 .tab-pane.fade.active.show .highlight {
     border: 1px solid #dee2e6;
     border-top-width: 0;
@@ -453,4 +458,5 @@ h1:focus-visible {
     --bs-tertiary-color-rgb: 222, 226, 230;
     --bs-tertiary-bg: #2b3035;
     --bs-tertiary-bg-rgb: 43, 48, 53;
-}
\ No newline at end of file
+    --bb-example-pre-background: #1e1e1e;
+}
diff --git a/blazorbootstrap/Components/Markdown/Markdown.razor b/blazorbootstrap/Components/Markdown/Markdown.razor
index 0a5a86345..341c0f65c 100644
--- a/blazorbootstrap/Components/Markdown/Markdown.razor
+++ b/blazorbootstrap/Components/Markdown/Markdown.razor
@@ -1,6 +1,6 @@
 @namespace BlazorBootstrap
 @inherits BlazorBootstrapComponentBase
 
-
         
    
             
-                
     Carousel New
    
+                
     Carousel
    
                 
         
    
         
    
@@ -107,12 +107,12 @@
         
    
         
    
             
-                
     Dropdown
    
+                
     Dropdown Updated
    
                 
         
    
         
    
             
-                
     Google Map New
    
+                
     Google Map Updated
    
                 
         
    
         
    
@@ -127,12 +127,12 @@
         
    
         
    
             
-                
     Images New
    
+                
     Images
    
                 
         
    
         
    
             
-                
     Markdown Preview
    
+                
     Markdown New
    
                 
         
    
         
    
@@ -157,7 +157,7 @@
         
    
         
    
             
-                
     PDF Viewer Updated
    
+                
     PDF Viewer
    
                 
         
    
         
    
@@ -192,12 +192,12 @@
         
    
         
    
             
-                
     Sidebar Updated
    
+                
     Sidebar
    
                 
         
    
         
    
             
-                
     Sidebar 2 Updated
    
+                
     Sidebar 2
    
                 
         
    
         
    
@@ -217,7 +217,7 @@
         
    
         
    
             
-                
     Tabs Updated
    
+                
     Tabs
    
                 
         
    
         
    
@@ -304,12 +304,12 @@
     
    
         
    
             
-                
     Bar Chart Updated
    
+                
     Bar Chart
    
                 
         
    
         
    
             
-                
     Doughnut Chart Updated
    
+                
     Doughnut Chart
    
                 
         
    
         
    
@@ -319,22 +319,22 @@
         
    
         
    
             
-                
     Pie Chart Updated
    
+                
     Pie Chart
    
                 
         
    
         
    
             
-                
     Polar Area Chart New
    
+                
     Polar Area Chart
    
                 
         
    
         
    
             
-                
     Radar Chart New
    
+                
     Radar Chart
    
                 
         
    
         
    
             
-                
     Scatter Chart New
    
+                
     Scatter Chart
    
                 
         
    
     
    
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
index 8992bff13..c0236bd22 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor
@@ -108,5 +108,5 @@
     private string pageUrl = "/markdown";
     private string title = "Blazor Markdown Component";
     private string description = "Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages.";
-    private string imageUrl = "https://i.imgur.com/FGgEMp6.jpg"; // TODO: update
+    private string imageUrl = "https://i.imgur.com/FhN1caj.png";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.Server/appsettings.json b/BlazorBootstrap.Demo.Server/appsettings.json
index 03290f577..1f5db0e37 100644
--- a/BlazorBootstrap.Demo.Server/appsettings.json
+++ b/BlazorBootstrap.Demo.Server/appsettings.json
@@ -6,9 +6,9 @@
     }
   },
   "AllowedHosts": "*",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "release": {
-    "short_description": "New Carousel, Google Map, Image, Polar Area Chart, Radar Chart, Scatter Chart components, and other improvements!!!"
+    "short_description": "New Markdown component and other enhancements!!!"
   },
   "urls": {
     "docs": "//docs.blazorbootstrap.com/getting-started/blazor-webassembly-net-8",
diff --git a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
index 0475051b5..77d3891aa 100644
--- a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
+++ b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
@@ -1,7 +1,7 @@
 {
-  "version": "3.0.0",
+  "version": "3.1.0",
   "release": {
-    "short_description": "New Carousel, Google Map, Image, Polar Area Chart, Radar Chart, Scatter Chart components, and other improvements!!!"
+    "short_description": "New Markdown component and other enhancements!!!"
   },
   "urls": {
     "docs": "//docs.blazorbootstrap.com/getting-started/blazor-webassembly-net-8",
diff --git a/README.md b/README.md
index 6b2d2adce..ca0d8936b 100644
--- a/README.md
+++ b/README.md
@@ -41,7 +41,7 @@
 
 ## Install
 
-Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.0.0`
+Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.0`
 
 ## Install Blazor Bootstrap templates
 
@@ -80,6 +80,7 @@ Install [Blazor Bootstrap templates](https://github.com/vikramlearning/blazorboo
 | Grid | [Docs](https://docs.blazorbootstrap.com/components/grid) | [Demos](https://demos.blazorbootstrap.com/grid) |
 | Icons | [Docs](https://docs.blazorbootstrap.com/content/icons) | [Demos](https://demos.blazorbootstrap.com/icons) |
 | Images | [Docs](https://docs.blazorbootstrap.com/content/images) | [Demos](https://demos.blazorbootstrap.com/images) |
+| Markdown | [Docs](https://docs.blazorbootstrap.com/content/markdown) | [Demos](https://demos.blazorbootstrap.com/markdown) |
 | Modals | [Docs](https://docs.blazorbootstrap.com/components/modal) | [Demos](https://demos.blazorbootstrap.com/modals) |
 | Number Input | [Docs](https://docs.blazorbootstrap.com/forms/number-input) | [Demos](https://demos.blazorbootstrap.com/form/number-input) |
 | Offcanvas | [Docs](https://docs.blazorbootstrap.com/components/offcanvas) | [Demos](https://demos.blazorbootstrap.com/offcanvas) |
@@ -178,6 +179,9 @@ Blazor Bootstrap's documentation, which is included in this repository's root di
 ### Blazor Bootstrap - Image
 ![Blazor Bootstrap - Image](https://i.imgur.com/eiSTmvO.png "Blazor Bootstrap - Image")
 
+### Blazor Bootstrap - Markdown
+![Blazor Bootstrap - Markdown](https://i.imgur.com/FhN1caj.png "Blazor Bootstrap - Markdown")
+
 ### Blazor Bootstrap - Modal
 ![Blazor Bootstrap - Modal](https://i.imgur.com/n0m4Fhq.jpg "Blazor Bootstrap - Modal")
 
diff --git a/blazorbootstrap/BlazorBootstrap.csproj b/blazorbootstrap/BlazorBootstrap.csproj
index 7d0120794..48b19bdcf 100644
--- a/blazorbootstrap/BlazorBootstrap.csproj
+++ b/blazorbootstrap/BlazorBootstrap.csproj
@@ -3,14 +3,14 @@
   
 
     Blazor.Bootstrap
-    3.0.0
-    3.0.0
+    3.1.0
+    3.1.0
 
     
     Apache-2.0
     https://docs.blazorbootstrap.com/
     https://github.com/vikramlearning/blazorbootstrap
-    Blazor, WebAssembly, BlazorWebAssembly, Bootstrap, Bootstrap5, BlazorBootstrap, BlazorAlert, BlazorAutoComplete, BlazorButtons, BlazorCallout, BlazorCharts, BlazorConfirmDialog, BlazorGrid, BlazorIcon, BlazorImage, BlazorModal, BlazorCurrencyInput, BlazorNumberInput, BlazorInput, BlazorNumber, BlazorDate, BlazorDateInput, BlazorDatePicker, BlazorTime, BlazorTimeInput, BlazorTimePicker, BlazorOffcanvas, BlazorPagination, BlazorPdfViewer, BlazorPlaceholders, BlazorPreload, BlazorProgress, BlazorRibbon, BlazorScriptLoader, BlazorSidebar, BlazorSidebar2, BlazorSortableList, BlazorSwitch, BlazorSpinners, BlazorTabs, BlazorToasts, BlazorTooltips, BlazorTooltips, BlazorBarChart, BlazorDoughnutChart, BlazorLineChart, BlazorPieChart, BlazorPolarAreaChart, BlazorRadarChart, BlazorScatterChart
+    Blazor, WebAssembly, BlazorWebAssembly, Bootstrap, Bootstrap5, BlazorBootstrap, BlazorAlert, BlazorAutoComplete, BlazorButtons, BlazorCallout, BlazorCharts, BlazorConfirmDialog, BlazorGrid, BlazorIcon, BlazorImage, BlazorModal, BlazorCurrencyInput, BlazorNumberInput, BlazorInput, BlazorNumber, BlazorDate, BlazorDateInput, BlazorDatePicker, BlazorTime, BlazorTimeInput, BlazorTimePicker, BlazorOffcanvas, BlazorPagination, BlazorPdfViewer, BlazorPlaceholders, BlazorPreload, BlazorProgress, BlazorRibbon, BlazorScriptLoader, BlazorSidebar, BlazorSidebar2, BlazorSortableList, BlazorSwitch, BlazorSpinners, BlazorTabs, BlazorToasts, BlazorTooltips, BlazorTooltips, BlazorBarChart, BlazorDoughnutChart, BlazorLineChart, BlazorPieChart, BlazorPolarAreaChart, BlazorRadarChart, BlazorScatterChart, BlazorMarkdown
     Blazor Bootstrap is a component library built on top of Blazor and Bootstrap5 CSS framework.
     Vikram Reddy
     
diff --git a/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs b/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs
index ab33601c9..cc8c1ec77 100644
--- a/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs
+++ b/blazorbootstrap/Components/AI/Chat/AIChat.razor.cs
@@ -64,6 +64,7 @@ public async Task ChartCompletetionsStreamJs(string content, bool done)
             currentCompletion = "";
             await InvokeAsync(StateHasChanged);
             await JSRuntime.InvokeVoidAsync(BlazorBootstrapInterop.ScrollToElementBottom, Id);
+
             return;
         }
 
@@ -112,15 +113,19 @@ private async Task SendPromptAsync()
     #region Properties, Indexers
 
     protected override string? ClassNames =>
-        BuildClassNames(Class,
-            (BootstrapClass.Container, true));
+        BuildClassNames(
+            Class,
+            (BootstrapClass.Container, true)
+        );
 
     protected override string? StyleNames =>
-        BuildStyleNames(Style,
+        BuildStyleNames(
+            Style,
             //("min-height:200px", true),
             //("max-height:400px", true),
             ("overflow-x:hidden", true),
-            ("overflow-y:auto", true));
+            ("overflow-y:auto", true)
+        );
 
     /// 
     /// The maximum number of tokens to generate shared between the prompt and completion.
@@ -149,7 +154,3 @@ private async Task SendPromptAsync()
 
     #endregion
 }
-
-
-
-
diff --git a/blazorbootstrap/Components/Markdown/Markdown.razor.cs b/blazorbootstrap/Components/Markdown/Markdown.razor.cs
index 23ca85f32..df8a60c45 100644
--- a/blazorbootstrap/Components/Markdown/Markdown.razor.cs
+++ b/blazorbootstrap/Components/Markdown/Markdown.razor.cs
@@ -1,43 +1,22 @@
 using Microsoft.AspNetCore.Components.Rendering;
-using System.Text.RegularExpressions;
 
 namespace BlazorBootstrap;
 
 public partial class Markdown : BlazorBootstrapComponentBase
 {
-    private string? html;
+    #region Fields and Constants
 
     private const string CODE_HIGHLIGHTING_LINE_SEPERATOR = " $$CHLS$$ ";
     private const string PATTERN_ORDERED_LIST = @"^\s*\d+\.\s";
     private const string PATTERN_UNORDERED_LIST = @"^\s*\-\s";
     private const string PATTERN_HORIZONTAL_RULES = @"^\-{3,}$";
     private const string PATTERN_BLOCKQUOTES = @"^>{1,}\s(.*)";
-
-    #region Properties, Indexers
-
-    /// 
-    /// Gets or sets the content to be rendered within the component.
-    /// 
-    /// 
-    /// Default value is .
-    /// 
-    [Parameter]
-    public RenderFragment? ChildContent { get; set; }
-
-    /// 
-    /// Gets or sets the CSS class for table.
-    /// 
-    [Parameter]
-    public string? TableCssClass { get; set; } = "table";
-
-    /// 
-    /// Gets or sets the CSS class for blockquotes.
-    /// 
-    [Parameter]
-    public string? BlockquotesCssClass { get; set; } = "blockquote";
+    private string? html;
 
     #endregion
 
+    #region Methods
+
     protected override void OnInitialized()
     {
         ParseMarkdown();
@@ -53,65 +32,6 @@ protected override void OnParametersSet()
         base.OnParametersSet();
     }
 
-    private void ParseMarkdown()
-    {
-        var lines = GetLines();
-        if (lines is null)
-            return;
-
-        // NOTE: do not change the sequence of these two lines
-        var markup = string.Join("\n", lines);
-        markup = ConvertMakdownHeadersToHtml(markup);
-        markup = ConvertMarkdownBlockquotesToHtml(markup);
-        markup = ConvertMarkdownHorizontalRulesToHtml(markup);
-        markup = ConvertMarkdownEmphasisToHtml(markup);
-        markup = ConvertMarkdownCodeHighlightingToHtml(markup);
-        markup = ConvertMarkdownListToHtml(markup);
-        markup = ConvertMarkdownTableToHtml(markup);
-        markup = ConvertMarkdownParagraphsToHtml(markup);
-        markup = ConvertMarkdownLineBreaksToHtml(markup);
-        markup = ConvertMarkdownImageToHtml(markup);
-        markup = ConvertMarkdownLinksToHtml(markup);
-        markup = ConvertMarkdownInlineCodeToHtml(markup);
-        html = markup.Replace(CODE_HIGHLIGHTING_LINE_SEPERATOR, "\n");
-    }
-
-    List GetLines()
-    {
-        var inputs = new List();
-
-        if (ChildContent is not null)
-        {
-            var builder = new RenderTreeBuilder();
-            ChildContent.Invoke(builder);
-
-            var frames = builder.GetFrames().Array;
-            foreach (var frame in frames)
-            {
-                if (frame.MarkupContent is not null)
-                {
-                    var lines = frame.MarkupContent.Split("\r\n").ToList();
-
-                    if (lines.Any())
-                        inputs.AddRange(lines);
-                }
-            }
-        }
-
-        if (inputs.Any())
-        {
-            // remove first blank line
-            if (string.IsNullOrWhiteSpace(inputs[0]))
-                inputs.RemoveAt(0);
-
-            // remove last blank line
-            if (string.IsNullOrWhiteSpace(inputs[^1]))
-                inputs.RemoveAt(inputs.Count - 1);
-        }
-
-        return inputs;
-    }
-
     // Headers
     private string ConvertMakdownHeadersToHtml(string markup)
     {
@@ -124,6 +44,7 @@ private string ConvertMakdownHeadersToHtml(string markup)
             {
                 parsedLines.Add(line);
                 parsedLines.Add("\n");
+
                 continue;
             }
 
@@ -174,7 +95,8 @@ private string ConvertMarkdownBlockquotesToHtml(string markup)
         foreach (var line in lines)
         {
             var trimmerLine = line.Trim();
-            var indentLevel = trimmerLine.TakeWhile((c) => c == '>').Count();
+            var indentLevel = trimmerLine.TakeWhile(c => c == '>').Count();
+
             if (Regex.IsMatch(trimmerLine, PATTERN_BLOCKQUOTES))
             {
                 if (listStack.Count == 0 || indentStack.Peek() < indentLevel)
@@ -241,32 +163,40 @@ private string ConvertMarkdownBlockquotesToHtml(string markup)
         return string.Join("", htmlLines);
     }
 
-    // HorizontalRules
-    private string ConvertMarkdownHorizontalRulesToHtml(string markup)
+    // Code Highlighting
+    private string ConvertMarkdownCodeHighlightingToHtml(string markup)
     {
         var lines = markup.Split("\n");
         var parsedLines = new List();
+        var isCodeBlockInprogress = false;
 
-        foreach (var line in lines)
-        {
-            if (string.IsNullOrWhiteSpace(line))
+        for (var i = 0; i < lines.Count(); i++)
+            if (Regex.IsMatch(lines[i].Trim(), @"\```(\w+)"))
             {
-                parsedLines.Add(line);
-                parsedLines.Add("\n");
-                continue;
+                if (!isCodeBlockInprogress)
+                    isCodeBlockInprogress = true;
+
+                lines[i] = Regex.Replace(lines[i].Trim(), @"\```(\w+)", "
    ");
+                parsedLines.Add(lines[i]);
             }
+            else if (Regex.IsMatch(lines[i].Trim().Trim(), @"```"))
+            {
+                if (isCodeBlockInprogress)
+                    isCodeBlockInprogress = false;
 
-            if (Regex.IsMatch(line.Trim(), PATTERN_HORIZONTAL_RULES))
+                lines[i] = Regex.Replace(lines[i].Trim(), @"```", "
    ");
+                parsedLines.Add(lines[i]);
+            }
+            else if (isCodeBlockInprogress)
             {
-                RemoveLastLineBreak(parsedLines);
-                parsedLines.Add(Regex.Replace(line.Trim(), PATTERN_HORIZONTAL_RULES, "
    "));
+                parsedLines.Add(lines[i]);
+                parsedLines.Add($"{CODE_HIGHLIGHTING_LINE_SEPERATOR}");
             }
             else
             {
-                parsedLines.Add(line);
+                parsedLines.Add(lines[i]);
                 parsedLines.Add("\n");
             }
-        }
 
         RemoveLastLineBreak(parsedLines);
 
@@ -284,6 +214,7 @@ private string ConvertMarkdownEmphasisToHtml(string markup)
             if (string.IsNullOrWhiteSpace(lines[i]))
             {
                 parsedLines.Add(lines[i]);
+
                 continue;
             }
 
@@ -306,39 +237,30 @@ private string ConvertMarkdownEmphasisToHtml(string markup)
         return string.Join("\n", parsedLines);
     }
 
-    // Code Highlighting
-    private string ConvertMarkdownCodeHighlightingToHtml(string markup)
+    // HorizontalRules
+    private string ConvertMarkdownHorizontalRulesToHtml(string markup)
     {
         var lines = markup.Split("\n");
         var parsedLines = new List();
-        var isCodeBlockInprogress = false;
 
-        for (var i = 0; i < lines.Count(); i++)
+        foreach (var line in lines)
         {
-            if (Regex.IsMatch(lines[i].Trim(), @"\```(\w+)"))
+            if (string.IsNullOrWhiteSpace(line))
             {
-                if (!isCodeBlockInprogress)
-                    isCodeBlockInprogress = true;
+                parsedLines.Add(line);
+                parsedLines.Add("\n");
 
-                lines[i] = Regex.Replace(lines[i].Trim(), @"\```(\w+)", "
    ");
-                parsedLines.Add(lines[i]);
+                continue;
             }
-            else if (Regex.IsMatch(lines[i].Trim().Trim(), @"```"))
-            {
-                if (isCodeBlockInprogress)
-                    isCodeBlockInprogress = false;
 
-                lines[i] = Regex.Replace(lines[i].Trim(), @"```", "
    ");
-                parsedLines.Add(lines[i]);
-            }
-            else if (isCodeBlockInprogress)
+            if (Regex.IsMatch(line.Trim(), PATTERN_HORIZONTAL_RULES))
             {
-                parsedLines.Add(lines[i]);
-                parsedLines.Add($"{CODE_HIGHLIGHTING_LINE_SEPERATOR}");
+                RemoveLastLineBreak(parsedLines);
+                parsedLines.Add(Regex.Replace(line.Trim(), PATTERN_HORIZONTAL_RULES, "
    "));
             }
             else
             {
-                parsedLines.Add(lines[i]);
+                parsedLines.Add(line);
                 parsedLines.Add("\n");
             }
         }
@@ -348,6 +270,87 @@ private string ConvertMarkdownCodeHighlightingToHtml(string markup)
         return string.Join("", parsedLines);
     }
 
+    // Image
+    private string ConvertMarkdownImageToHtml(string markup)
+    {
+        // Pattern to match Markdown image syntax: ![alt text](url "optional title" =WIDTHxHEIGHT)
+        var pattern = @"!\[(.*?)\]\((.*?)(\s*""[^""]*"")?(\s*=\s*(\d*)x?(\d*))?\)";
+
+        // Replace Markdown image syntax with HTML  tag
+        var html = Regex.Replace(
+            markup,
+            pattern,
+            match =>
+            {
+                var altText = match.Groups[1].Value;
+                var url = match.Groups[2].Value;
+                var title = match.Groups[3].Value;
+                var width = match.Groups[5].Value;
+                var height = match.Groups[6].Value;
+
+                var imgTag = $"\"{altText}\""; tag
+        var html = Regex.Replace(
+            markup,
+            pattern,
+            match =>
+            {
+                var codeText = match.Groups[1].Value;
+
+                return $"{codeText}";
+            }
+        );
+
+        return html;
+    }
+
+    // Line breaks
+    private string ConvertMarkdownLineBreaksToHtml(string markup) => markup.Replace("\n", "
    ");
+
+    // Links
+    private string ConvertMarkdownLinksToHtml(string markup)
+    {
+        // Pattern to match Markdown link syntax: [Link Text](Link URL)
+        var pattern = @"\[(.*?)\]\((.*?)\)";
+
+        // Replace Markdown link syntax with HTML  tag
+        var html = Regex.Replace(
+            markup,
+            pattern,
+            match =>
+            {
+                var linkText = match.Groups[1].Value;
+                var linkUrl = match.Groups[2].Value;
+
+                return $"{linkText}";
+            }
+        );
+
+        return html;
+    }
+
     // Lists
     private string ConvertMarkdownListToHtml(string markup)
     {
@@ -386,6 +389,7 @@ private string ConvertMarkdownListToHtml(string markup)
                             indentStack.Push(indentLevel);
                         }
                     }
+
                     htmlLines.Add($"
  • {Regex.Replace(line, PATTERN_ORDERED_LIST, "")}");
                 }
                 else if (indentStack.Peek() > indentLevel)
@@ -426,6 +430,7 @@ private string ConvertMarkdownListToHtml(string markup)
                             indentStack.Push(indentLevel);
                         }
                     }
+
                     htmlLines.Add($"
  • {Regex.Replace(line, PATTERN_UNORDERED_LIST, "")}");
                 }
                 else if (indentStack.Peek() > indentLevel)
@@ -462,19 +467,39 @@ private string ConvertMarkdownListToHtml(string markup)
         }
 
         // Close any open list items
-        for (int i = 0; i < htmlLines.Count; i++)
-        {
+        for (var i = 0; i < htmlLines.Count; i++)
             if (htmlLines[i].StartsWith("
  • ") && (i == htmlLines.Count - 1 || htmlLines[i + 1].StartsWith("
  • ") || htmlLines[i + 1].StartsWith("";
-            }
-        }
 
         RemoveLastLineBreak(htmlLines);
 
         return string.Join("", htmlLines);
     }
 
+    // Paragraphs
+    private string ConvertMarkdownParagraphsToHtml(string markup)
+    {
+        var lines = markup.Split("\n\n\n");
+        var parsedLines = new List();
+
+        if (lines.Length == 1)
+            return markup;
+
+        foreach (var line in lines)
+        {
+            if (string.IsNullOrWhiteSpace(line))
+            {
+                parsedLines.Add(line);
+
+                continue;
+            }
+
+            parsedLines.Add($"
    {line}
    ");
+        }
+
+        return string.Join("", parsedLines);
+    }
+
     // Tables
     private string ConvertMarkdownTableToHtml(string markup)
     {
@@ -491,11 +516,13 @@ private string ConvertMarkdownTableToHtml(string markup)
             if (string.IsNullOrWhiteSpace(line))
             {
                 parsedLines.Add(line);
+
                 continue;
             }
 
             // Trim row with spaces
             var trimmedLine = line.Trim();
+
             if (trimmedLine.StartsWith("| "))
             {
                 if (!isTableStart)
@@ -553,105 +580,63 @@ private string ConvertMarkdownTableToHtml(string markup)
         return string.Join("\n", parsedLines);
     }
 
-    // Paragraphs
-    private string ConvertMarkdownParagraphsToHtml(string markup)
+    private List GetLines()
     {
-        var lines = markup.Split("\n\n\n");
-        var parsedLines = new List();
-
-        if (lines.Length == 1)
-            return markup;
-
-        foreach (var line in lines)
-        {
-            if (string.IsNullOrWhiteSpace(line))
-            {
-                parsedLines.Add(line);
-                continue;
-            }
-
-            parsedLines.Add($"
    {line}
    ");
-        }
-
-        return string.Join("", parsedLines);
-    }
-
-    // Line breaks
-    private string ConvertMarkdownLineBreaksToHtml(string markup) => markup.Replace("\n", "
    ");
-
-    // Image
-    private string ConvertMarkdownImageToHtml(string markup)
-    {
-        // Pattern to match Markdown image syntax: ![alt text](url "optional title" =WIDTHxHEIGHT)
-        var pattern = @"!\[(.*?)\]\((.*?)(\s*""[^""]*"")?(\s*=\s*(\d*)x?(\d*))?\)";
+        var inputs = new List();
 
-        // Replace Markdown image syntax with HTML  tag
-        var html = Regex.Replace(markup, pattern, match =>
+        if (ChildContent is not null)
         {
-            var altText = match.Groups[1].Value;
-            var url = match.Groups[2].Value;
-            var title = match.Groups[3].Value;
-            var width = match.Groups[5].Value;
-            var height = match.Groups[6].Value;
-
-            var imgTag = $"\"{altText}\""; tag
-        var html = Regex.Replace(markup, pattern, match =>
+        if (inputs.Any())
         {
-            var linkText = match.Groups[1].Value;
-            var linkUrl = match.Groups[2].Value;
+            // remove first blank line
+            if (string.IsNullOrWhiteSpace(inputs[0]))
+                inputs.RemoveAt(0);
 
-            return $"{linkText}";
-        });
+            // remove last blank line
+            if (string.IsNullOrWhiteSpace(inputs[^1]))
+                inputs.RemoveAt(inputs.Count - 1);
+        }
 
-        return html;
+        return inputs;
     }
 
-    // Inline code
-    private string ConvertMarkdownInlineCodeToHtml(string markup)
+    private void ParseMarkdown()
     {
-        // Pattern to match inline Markdown code syntax: `code`
-        var pattern = @"`([^`]+)`";
-
-        // Replace inline Markdown code syntax with HTML  tag
-        var html = Regex.Replace(markup, pattern, match =>
-        {
-            var codeText = match.Groups[1].Value;
+        var lines = GetLines();
 
-            return $"{codeText}";
-        });
+        if (lines is null)
+            return;
 
-        return html;
+        // NOTE: do not change the sequence of these two lines
+        var markup = string.Join("\n", lines);
+        markup = ConvertMakdownHeadersToHtml(markup);
+        markup = ConvertMarkdownBlockquotesToHtml(markup);
+        markup = ConvertMarkdownHorizontalRulesToHtml(markup);
+        markup = ConvertMarkdownEmphasisToHtml(markup);
+        markup = ConvertMarkdownCodeHighlightingToHtml(markup);
+        markup = ConvertMarkdownListToHtml(markup);
+        markup = ConvertMarkdownTableToHtml(markup);
+        markup = ConvertMarkdownParagraphsToHtml(markup);
+        markup = ConvertMarkdownLineBreaksToHtml(markup);
+        markup = ConvertMarkdownImageToHtml(markup);
+        markup = ConvertMarkdownLinksToHtml(markup);
+        markup = ConvertMarkdownInlineCodeToHtml(markup);
+        html = markup.Replace(CODE_HIGHLIGHTING_LINE_SEPERATOR, "\n");
     }
 
     //private string ConvertMarkdownChecklistToHtml(string markup)
@@ -674,7 +659,6 @@ private string ConvertMarkdownInlineCodeToHtml(string markup)
     //    return html;
     //}
 
-
     // Emoji
 
     // Mathematical notation and characters
@@ -687,4 +671,31 @@ private static void RemoveLastLineBreak(List htmlLines)
         if (htmlLines.Any() && htmlLines[^1] == "\n")
             htmlLines.RemoveAt(htmlLines.Count - 1);
     }
+
+    #endregion
+
+    #region Properties, Indexers
+
+    /// 
+    /// Gets or sets the CSS class for blockquotes.
+    /// 
+    [Parameter]
+    public string? BlockquotesCssClass { get; set; } = "blockquote";
+
+    /// 
+    /// Gets or sets the content to be rendered within the component.
+    /// 
+    /// 
+    /// Default value is .
+    /// 
+    [Parameter]
+    public RenderFragment? ChildContent { get; set; }
+
+    /// 
+    /// Gets or sets the CSS class for table.
+    /// 
+    [Parameter]
+    public string? TableCssClass { get; set; } = "table";
+
+    #endregion
 }
diff --git a/blazorbootstrap/Usings.cs b/blazorbootstrap/Usings.cs
index d7bab412e..47a2a1d9d 100644
--- a/blazorbootstrap/Usings.cs
+++ b/blazorbootstrap/Usings.cs
@@ -3,9 +3,8 @@
 global using Microsoft.AspNetCore.Components.Routing;
 global using Microsoft.AspNetCore.Components.Web;
 global using Microsoft.JSInterop;
-global using System.Buffers;
 global using System.Drawing;
 global using System.Globalization;
 global using System.Linq.Expressions;
-global using System.Text;
 global using System.Text.Json.Serialization;
+global using System.Text.RegularExpressions;
\ No newline at end of file
diff --git a/docs/blog/2024-10-21-blazorbootstrap-3.1.0.md b/docs/blog/2024-10-21-blazorbootstrap-3.1.0.md
new file mode 100644
index 000000000..f53cb3f5b
--- /dev/null
+++ b/docs/blog/2024-10-21-blazorbootstrap-3.1.0.md
@@ -0,0 +1,30 @@
+---
+title: Blazor Bootstrap v3.1.0
+authors:
+  name: Vikram Reddy
+  title: Creator
+  url: https://github.com/gvreddy04
+  image_url: https://avatars.githubusercontent.com/u/2337067
+tags: [v3.1.0, blazor, bootstrap, blazorbootstrap, charts, dropdown, googlemap, grid, linechart, markdown]
+---
+
+We are excited to release version 3.1.0, which includes new Markdown component and other enhancements!!!
+
+![image](https://i.imgur.com/FhN1caj.png "Blazor Bootstrap: Markdown Component")
+
+
+
+## What's new
+- `Markdown` component
+
+## What's changed
+- Dark mode support added
+- Grid enum filter - select text translation support added
+- Line Chart - Fill support added
+- Dropdown - Docs updated
+- Google Map - Docs updated
+
+
+## Links
+- [Docs Website - Blazor Bootstrap](https://docs.blazorbootstrap.com/)
+- [Demos Website - Blazor Bootstrap](https://demos.blazorbootstrap.com/)
diff --git a/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx b/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
index 93382206d..8fff1a014 100644
--- a/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx b/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
index f2a354eae..2553a8b84 100644
--- a/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx b/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
index 7256013c1..b012d6fe0 100644
--- a/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
@@ -20,7 +20,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ### Add CSS references
@@ -87,7 +87,7 @@ The default Blazor template includes demonstration code and Bootstrap. To remove
 Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ### Register services
diff --git a/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx b/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
index 46c3a26ab..30926ba29 100644
--- a/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx b/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
index 8e83087b9..c96c1c503 100644
--- a/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx b/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
index ae03dd92c..4965f597e 100644
--- a/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx b/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
index c155f4432..b38384a6f 100644
--- a/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx b/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
index 9fee3b1ee..de1623c07 100644
--- a/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
+++ b/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx b/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
index e6bd4b0d9..e436525ad 100644
--- a/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
+++ b/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.0.0
+Install-Package Blazor.Bootstrap -Version 3.1.0
 ```
 
 ## Add CSS references
diff --git a/docs/docs/05-components/markdown.mdx b/docs/docs/05-components/markdown.mdx
index dc7d426bc..41951fba3 100644
--- a/docs/docs/05-components/markdown.mdx
+++ b/docs/docs/05-components/markdown.mdx
@@ -19,6 +19,7 @@ Use Blazor Bootstrap Markdown component to add formatting, tables, images, and m
 
 | Name | Type | Default | Required | Description | Added Version |
 |:--|:--|:--|:--|:--|:--|
+| ChildContent | RenderFragment | null | ✔️ | Gets or sets the content to be rendered within the component. | 3.1.0 |
 | TableCssClass | string? | `table` | | Gets or sets the CSS class for table. | 3.1.0 |
 | BlockquotesCssClass | string? | `blockquote` | | Gets or sets the CSS class for blockquotes. | 3.1.0 |
 
diff --git a/docs/package.json b/docs/package.json
index 762fe6e4c..a45b71997 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "blazorbootstrap",
-  "version": "3.0.0",
+  "version": "3.1.0",
   "private": true,
   "scripts": {
     "docusaurus": "docusaurus",
diff --git a/nuget/README.md b/nuget/README.md
index fce0624bd..7658f212c 100644
--- a/nuget/README.md
+++ b/nuget/README.md
@@ -18,7 +18,7 @@
 Get started any way you want
 
 - Clone the repo: `git clone https://github.com/vikramlearning/blazorbootstrap.git`
-- Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.0.0`
+- Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.0`
 - Install [Blazor Bootstrap templates](https://github.com/vikramlearning/blazorbootstrap-project-templates) with **.NET CLI**: `dotnet new install Blazor.Bootstrap.Templates::1.10.0`
 
   ![image](https://user-images.githubusercontent.com/2337067/233800604-43986ae7-27dd-4f17-9af6-c2f1a6f07097.png)
@@ -59,6 +59,7 @@ Get started any way you want
 | Grid | [Docs](https://docs.blazorbootstrap.com/components/grid) | [Demos](https://demos.blazorbootstrap.com/grid) |
 | Icons | [Docs](https://docs.blazorbootstrap.com/content/icons) | [Demos](https://demos.blazorbootstrap.com/icons) |
 | Images | [Docs](https://docs.blazorbootstrap.com/content/images) | [Demos](https://demos.blazorbootstrap.com/images) |
+| Markdown | [Docs](https://docs.blazorbootstrap.com/components/markdown) | [Demos](https://demos.blazorbootstrap.com/markdown) |
 | Modals | [Docs](https://docs.blazorbootstrap.com/components/modal) | [Demos](https://demos.blazorbootstrap.com/modals) |
 | Number Input | [Docs](https://docs.blazorbootstrap.com/forms/number-input) | [Demos](https://demos.blazorbootstrap.com/form/number-input) |
 | Offcanvas | [Docs](https://docs.blazorbootstrap.com/components/offcanvas) | [Demos](https://demos.blazorbootstrap.com/offcanvas) |

From a75bf63bea580954835e77ed29a9643a833d0029 Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Mon, 21 Oct 2024 22:49:22 +0530
Subject: [PATCH 07/23] pipeline artifacts version upgrade

---
 .github/workflows/web-app.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/web-app.yml b/.github/workflows/web-app.yml
index e41ec7400..67382e676 100644
--- a/.github/workflows/web-app.yml
+++ b/.github/workflows/web-app.yml
@@ -32,7 +32,7 @@ jobs:
         run: dotnet publish ./BlazorBootstrap.Demo.Server/BlazorBootstrap.Demo.Server.csproj -c Release -o ${{env.DOTNET_ROOT}}/myapp
 
       - name: Upload artifact for deployment job
-        uses: actions/upload-artifact@v2
+        uses: actions/upload-artifact@v3
         with:
           name: .net-app
           path: ${{env.DOTNET_ROOT}}/myapp

From 50fa067c5188f73733100daf00f6a8cb31b1a5dd Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Mon, 21 Oct 2024 22:52:46 +0530
Subject: [PATCH 08/23] download-artifact@v3 update

---
 .github/workflows/web-app.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/web-app.yml b/.github/workflows/web-app.yml
index 67382e676..c4b0bba7a 100644
--- a/.github/workflows/web-app.yml
+++ b/.github/workflows/web-app.yml
@@ -47,7 +47,7 @@ jobs:
 
     steps:
       - name: Download artifact from build job
-        uses: actions/download-artifact@v2
+        uses: actions/download-artifact@v3
         with:
           name: .net-app
 

From a618c68d9ce95f0b4d093a72b54bb028a81beb2a Mon Sep 17 00:00:00 2001
From: Neovex <69359890+Neovex@users.noreply.github.com>
Date: Sat, 26 Oct 2024 09:01:22 +0200
Subject: [PATCH 09/23] Removed unnecessary data iteration. (#916)

GridDataProvider iterated twice over data source when paging is active - this has been optimized.

Co-authored-by: Neovex 
---
 .../Models/GridDataProviderRequest.cs            | 16 ++++++----------
 1 file changed, 6 insertions(+), 10 deletions(-)

diff --git a/blazorbootstrap/Models/GridDataProviderRequest.cs b/blazorbootstrap/Models/GridDataProviderRequest.cs
index 42672bbf6..d326c4549 100644
--- a/blazorbootstrap/Models/GridDataProviderRequest.cs
+++ b/blazorbootstrap/Models/GridDataProviderRequest.cs
@@ -43,15 +43,15 @@ public GridDataProviderResult ApplyTo(IEnumerable data)
                 if (index == 1)
                 {
                     orderedData = sortItem.SortDirection == SortDirection.Ascending
-                                      ? resultData.OrderBy(sortItem.SortKeySelector.Compile())
-                                      : resultData.OrderByDescending(sortItem.SortKeySelector.Compile());
+                                    ? resultData.OrderBy(sortItem.SortKeySelector.Compile())
+                                    : resultData.OrderByDescending(sortItem.SortKeySelector.Compile());
                 }
                 else
                 {
                     if (orderedData != null)
                         orderedData = sortItem.SortDirection == SortDirection.Ascending
-                                          ? orderedData.ThenBy(sortItem.SortKeySelector.Compile())
-                                          : orderedData.ThenByDescending(sortItem.SortKeySelector.Compile());
+                                        ? orderedData.ThenBy(sortItem.SortKeySelector.Compile())
+                                        : orderedData.ThenByDescending(sortItem.SortKeySelector.Compile());
                 }
 
                 index++;
@@ -61,15 +61,11 @@ public GridDataProviderResult ApplyTo(IEnumerable data)
         }
 
         // apply paging
-        var skip = 0;
-        var take = data.Count();
         var totalCount = resultData!.Count(); // before paging
-
         if (PageNumber > 0 && PageSize > 0)
         {
-            skip = (PageNumber - 1) * PageSize;
-            take = PageSize;
-            resultData = resultData!.Skip(skip).Take(take);
+            int skip = (PageNumber - 1) * PageSize;
+            resultData = resultData!.Skip(skip).Take(PageSize);
         }
 
         return new GridDataProviderResult { Data = resultData, TotalCount = totalCount };

From a9d12638def9eb06c18c446f37841a6273b2dfa4 Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Wed, 30 Oct 2024 12:06:04 +0530
Subject: [PATCH 10/23] blazor bootstrap layout component + theme switcher -
 preview version (#922)

blazor bootstrap layout component + theme switcher - preview version
---
 .../Components/Layout/MainLayout.razor        |  93 ++++++----
 .../BlazorBootstrapLayoutComponentBase.cs     | 165 ++++++++++++++++++
 .../Layout/BlazorBootstrapLayout.razor        |  27 +++
 .../Layout/BlazorBootstrapLayout.razor.cs     |  24 +++
 .../Layout/BlazorBootstrapLayout.razor.css    |   0
 .../ThemeSwitcher/ThemeSwitcher.razor         |  24 +++
 .../ThemeSwitcher/ThemeSwitcher.razor.cs      |  28 +++
 .../ThemeSwitcher/ThemeSwitcher.razor.css     |   0
 .../ThemeSwitcher/ThemeSwitcherJsInterop.cs   |  50 ++++++
 blazorbootstrap/Config.cs                     |   1 +
 blazorbootstrap/wwwroot/blazor.bootstrap.css  |  11 ++
 .../blazor.bootstrap.theme-switcher.js        |  99 +++++++++++
 12 files changed, 492 insertions(+), 30 deletions(-)
 create mode 100644 blazorbootstrap/Components/Core/BlazorBootstrapLayoutComponentBase.cs
 create mode 100644 blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor
 create mode 100644 blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs
 create mode 100644 blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.css
 create mode 100644 blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor
 create mode 100644 blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs
 create mode 100644 blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.css
 create mode 100644 blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs
 create mode 100644 blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js

diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
index 2298ef346..25b9d8b0a 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
@@ -1,40 +1,73 @@
 @namespace BlazorBootstrap.Demo.RCL
 @inherits MainLayoutBase
 
-
    
+
+    
+        
+    
+    
+        
+    
 
-    
+    
+        @Body
 
-    
    
-        
    
-            @Body
+        
+            
+                
+                If you like Blazor Bootstrap, give it a star on GitHub!
+                
+            
+        
+    
 
-            
-                
-                    
-                    If you like Blazor Bootstrap, give it a star on GitHub!
-                    
+    
+        
    
+            
    
+                
+                    Blazor Bootstrap
+                    Blazor Bootstrap
                 
-            
+                
      
+                    
    • Designed and built with all the love in the world by the Blazor Bootstrap team with the help of our contributors.
      • 
+                    
    • Code licensed Apache License 2.0.
      • 
+                    
    • Currently @Version.
      • 
+                
    
+            
    
+            
    
+                
    Links
    
+                
+            
    
+            
    
+                
    Guides
    
+                
+            
    
+            
    
+                
    Community
    
+                
+            
    
+            
    
         
    
-
-        
-
-    
    
-
    
+    
+
 
 
diff --git a/blazorbootstrap/Components/Core/BlazorBootstrapLayoutComponentBase.cs b/blazorbootstrap/Components/Core/BlazorBootstrapLayoutComponentBase.cs
new file mode 100644
index 000000000..d4fd797d5
--- /dev/null
+++ b/blazorbootstrap/Components/Core/BlazorBootstrapLayoutComponentBase.cs
@@ -0,0 +1,165 @@
+using Microsoft.Extensions.Configuration;
+
+namespace BlazorBootstrap;
+
+public abstract class BlazorBootstrapLayoutComponentBase : LayoutComponentBase, IDisposable, IAsyncDisposable
+{
+    #region Fields and Constants
+
+    private bool isAsyncDisposed;
+
+    private bool isDisposed;
+
+    #endregion
+
+    #region Methods
+
+    /// 
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        IsRenderComplete = true;
+
+        await base.OnAfterRenderAsync(firstRender);
+    }
+
+    /// 
+    protected override void OnInitialized()
+    {
+        Id ??= IdUtility.GetNextId();
+
+        base.OnInitialized();
+    }
+
+    public static string BuildClassNames(params (string? cssClass, bool when)[] cssClassList)
+    {
+        var list = new HashSet();
+
+        if (cssClassList is not null && cssClassList.Any())
+            foreach (var (cssClass, when) in cssClassList)
+                if (!string.IsNullOrWhiteSpace(cssClass) && when)
+                    list.Add(cssClass);
+
+        if (list.Any())
+            return string.Join(" ", list);
+
+        return string.Empty;
+    }
+
+    public static string BuildClassNames(string? userDefinedCssClass, params (string? cssClass, bool when)[] cssClassList)
+    {
+        var list = new HashSet();
+
+        if (cssClassList is not null && cssClassList.Any())
+            foreach (var (cssClass, when) in cssClassList)
+                if (!string.IsNullOrWhiteSpace(cssClass) && when)
+                    list.Add(cssClass);
+
+        if (!string.IsNullOrWhiteSpace(userDefinedCssClass))
+            list.Add(userDefinedCssClass.Trim());
+
+        if (list.Any())
+            return string.Join(" ", list);
+
+        return string.Empty;
+    }
+
+    public static string BuildStyleNames(string? userDefinedCssStyle, params (string? cssStyle, bool when)[] cssStyleList)
+    {
+        var list = new HashSet();
+
+        if (cssStyleList is not null && cssStyleList.Any())
+            foreach (var (cssStyle, when) in cssStyleList)
+                if (!string.IsNullOrWhiteSpace(cssStyle) && when)
+                    list.Add(cssStyle);
+
+        if (!string.IsNullOrWhiteSpace(userDefinedCssStyle))
+            list.Add(userDefinedCssStyle.Trim());
+
+        if (list.Any())
+            return string.Join(';', list);
+
+        return string.Empty;
+    }
+
+    /// 
+    /// 
+    public void Dispose()
+    {
+        Dispose(true);
+        GC.SuppressFinalize(this);
+    }
+
+    /// 
+    /// 
+    public async ValueTask DisposeAsync()
+    {
+        await DisposeAsyncCore(true).ConfigureAwait(false);
+
+        Dispose(false);
+        GC.SuppressFinalize(this);
+    }
+
+    protected virtual void Dispose(bool disposing)
+    {
+        if (!isDisposed)
+        {
+            if (disposing)
+            {
+                // cleanup
+            }
+
+            isDisposed = true;
+        }
+    }
+
+    protected virtual ValueTask DisposeAsyncCore(bool disposing)
+    {
+        if (!isAsyncDisposed)
+        {
+            if (disposing)
+            {
+                // cleanup
+            }
+
+            isAsyncDisposed = true;
+        }
+
+        return ValueTask.CompletedTask;
+    }
+
+    #endregion
+
+    #region Properties, Indexers
+
+    [Parameter(CaptureUnmatchedValues = true)] public Dictionary AdditionalAttributes { get; set; } = default!;
+
+    [Parameter] public string? Class { get; set; }
+
+    protected virtual string? ClassNames => Class;
+
+    [Inject] protected IConfiguration Configuration { get; set; } = default!;
+
+    public ElementReference Element { get; set; }
+
+    [Parameter] public string? Id { get; set; }
+
+    protected bool IsRenderComplete { get; private set; }
+
+    [Inject] protected IJSRuntime JSRuntime { get; set; } = default!;
+
+    [Parameter] public string? Style { get; set; }
+
+    protected virtual string? StyleNames => Style;
+
+    #endregion
+
+    #region Other
+
+    ~BlazorBootstrapLayoutComponentBase()
+    {
+        Dispose(false);
+    }
+
+    #endregion
+}
diff --git a/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor
new file mode 100644
index 000000000..fbc86571f
--- /dev/null
+++ b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor
@@ -0,0 +1,27 @@
+@namespace BlazorBootstrap
+@inherits BlazorBootstrapLayoutComponentBase
+
+
    
+
+    @SidebarSection
+
+    
    
+        @if (HeaderSection is not null)
+        {
+            
    
+                @HeaderSection
+            
    
+        }
+
+        
    
+            @ContentSection
+        
    
+
+        @if (FooterSection is not null)
+        {
+            
    
+                @FooterSection
+            
    
+        }
+    
    
+
    
\ No newline at end of file
diff --git a/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs
new file mode 100644
index 000000000..f9dc56f8c
--- /dev/null
+++ b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs
@@ -0,0 +1,24 @@
+namespace BlazorBootstrap;
+
+public partial class BlazorBootstrapLayout : BlazorBootstrapLayoutComponentBase
+{
+    #region Properties, Indexers
+
+    protected override string? ClassNames => BuildClassNames(Class, ("bb-page", true));
+
+    [Parameter] public RenderFragment? ContentSection { get; set; }
+    [Parameter] public string? ContentSectionCssClass { get; set; }
+    protected string? ContentSectionCssClassNames => BuildClassNames(ContentSectionCssClass, ("p-4", true));
+
+    [Parameter] public RenderFragment? FooterSection { get; set; }
+    [Parameter] public string? FooterSectionCssClass { get; set; } = "bg-body-tertiary";
+    protected string? FooterSectionCssClassNames => BuildClassNames(FooterSectionCssClass, ("bb-footer p-4", true));
+    
+    [Parameter] public RenderFragment? HeaderSection { get; set; }
+    [Parameter] public string? HeaderSectionCssClass { get; set; } = "d-flex justify-content-end";
+    protected string? HeaderSectionCssClassNames => BuildClassNames(HeaderSectionCssClass, ("bb-top-row px-4", true));
+
+    [Parameter] public RenderFragment? SidebarSection { get; set; }
+
+    #endregion
+}
diff --git a/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.css b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor
new file mode 100644
index 000000000..ebbd52192
--- /dev/null
+++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor
@@ -0,0 +1,24 @@
+@namespace BlazorBootstrap
+@inherits BlazorBootstrapComponentBase
+
+
+
      
+    
    • 
+        
+    
      • 
+    
    • 
+        
+    
      • 
+    
    • 
+        
+    
      • 
+
    
\ No newline at end of file
diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs
new file mode 100644
index 000000000..07ef82085
--- /dev/null
+++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs
@@ -0,0 +1,28 @@
+namespace BlazorBootstrap;
+
+public partial class ThemeSwitcher : BlazorBootstrapComponentBase
+{
+    #region Methods
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (firstRender)
+            await ThemeSwitcherJsInterop.InitializeAsync();
+
+        await base.OnAfterRenderAsync(firstRender);
+    }
+
+    internal Task SetAutoTheme() => ThemeSwitcherJsInterop.SetAutoThemeAsync();
+
+    internal Task SetDarkTheme() => ThemeSwitcherJsInterop.SetDarkThemeAsync();
+
+    internal Task SetLightTheme() => ThemeSwitcherJsInterop.SetLightThemeAsync();
+
+    #endregion
+
+    #region Properties, Indexers
+
+    [Inject] private ThemeSwitcherJsInterop ThemeSwitcherJsInterop { get; set; } = default!;
+
+    #endregion
+}
diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.css b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.css
new file mode 100644
index 000000000..e69de29bb
diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs
new file mode 100644
index 000000000..6bef7b702
--- /dev/null
+++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs
@@ -0,0 +1,50 @@
+namespace BlazorBootstrap;
+
+public class ThemeSwitcherJsInterop : IAsyncDisposable
+{
+    #region Fields and Constants
+
+    private readonly Lazy> moduleTask;
+
+    #endregion
+
+    #region Constructors
+
+    public ThemeSwitcherJsInterop(IJSRuntime jsRuntime)
+    {
+        moduleTask = new Lazy>(() => jsRuntime.InvokeAsync("import", "./_content/Blazor.Bootstrap/blazor.bootstrap.theme-switcher.js").AsTask());
+    }
+
+    #endregion
+
+    #region Methods
+
+    public async ValueTask DisposeAsync()
+    {
+        if (moduleTask.IsValueCreated)
+        {
+            var module = await moduleTask.Value;
+            await module.DisposeAsync();
+        }
+    }
+
+    public async Task InitializeAsync()
+    {
+        var module = await moduleTask.Value;
+        await module.InvokeVoidAsync("initializeTheme");
+    }
+
+    internal Task SetAutoThemeAsync() => SetThemeAsync("system");
+
+    internal Task SetDarkThemeAsync() => SetThemeAsync("dark");
+
+    internal Task SetLightThemeAsync() => SetThemeAsync("light");
+
+    internal async Task SetThemeAsync(string themeName)
+    {
+        var module = await moduleTask.Value;
+        await module.InvokeVoidAsync("setTheme", themeName);
+    }
+
+    #endregion
+}
diff --git a/blazorbootstrap/Config.cs b/blazorbootstrap/Config.cs
index fe8146e37..0a26e404a 100644
--- a/blazorbootstrap/Config.cs
+++ b/blazorbootstrap/Config.cs
@@ -21,6 +21,7 @@ public static IServiceCollection AddBlazorBootstrap(this IServiceCollection serv
 
         services.AddScoped();
         services.AddScoped();
+        services.AddScoped();
 
         return services;
     }
diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.css b/blazorbootstrap/wwwroot/blazor.bootstrap.css
index 5e532d082..047277b75 100644
--- a/blazorbootstrap/wwwroot/blazor.bootstrap.css
+++ b/blazorbootstrap/wwwroot/blazor.bootstrap.css
@@ -627,3 +627,14 @@ main {
 .pdf-viewer-dropdown-toggle::after {
     content: inherit !important;
 }
+
+/* layout */
+.bb-footer a {
+    color: var(--bs-body-color);
+    text-decoration: none
+}
+
+.bb-footer a:hover, .bb-footer a:focus {
+    color: var(--bs-link-hover-color);
+    text-decoration: underline;
+}
diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js b/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js
new file mode 100644
index 000000000..67e9c9710
--- /dev/null
+++ b/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js
@@ -0,0 +1,99 @@
+// THEMES
+const STORAGE_KEY = "blazorbootstrap-theme";
+const DEFAULT_THEME = "light";
+const SYSTEM_THEME = "system";
+
+const state = {
+    chosenTheme: SYSTEM_THEME, // light|dark|system
+    appliedTheme: DEFAULT_THEME // light|dark
+};
+
+const showActiveTheme = () => {
+    let $themeIndicator = document.querySelector(".blazorbootstrap-theme-indicator>i");
+    if ($themeIndicator) {
+        if (state.appliedTheme === "light") {
+            $themeIndicator.className = "bi bi-sun-fill";
+        } else if (state.appliedTheme === "dark") {
+            $themeIndicator.className = "bi bi-moon-stars-fill";
+        } else {
+            $themeIndicator.className = "bi bi-circle-half";
+        }
+    }
+
+    let $themeSwitchers = document.querySelectorAll(".blazorbootstrap-theme-item>button");
+    if ($themeSwitchers) {
+        $themeSwitchers.forEach((el) => {
+            const bsThemeValue = el.dataset.bsThemeValue;
+            const iEl = el.querySelector(".bi.bi-check2");
+            if (state.chosenTheme === bsThemeValue) {
+                el.classList.add("active");
+                if (iEl)
+                    iEl.classList.remove("d-none");
+            } else {
+                el.classList.remove("active");
+                if (iEl)
+                    iEl.classList.add("d-none");
+            }
+        });
+    }
+};
+
+export function setTheme(theme, save = true) {
+    state.chosenTheme = theme;
+    state.appliedTheme = theme;
+
+    if (theme === SYSTEM_THEME) {
+        state.appliedTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    }
+
+    document.documentElement.setAttribute("data-bs-theme", state.appliedTheme);
+    if (save) {
+        window.localStorage.setItem(STORAGE_KEY, state.chosenTheme);
+    }
+    showActiveTheme();
+    updateDemoCodeThemeCss(state.appliedTheme);
+};
+
+export function initializeTheme() {
+    const localTheme = window.localStorage.getItem(STORAGE_KEY);
+    if (localTheme) {
+        setTheme(localTheme, false);
+    } else {
+        setTheme(SYSTEM_THEME);
+    }
+
+    // register events
+    window
+        .matchMedia("(prefers-color-scheme: dark)")
+        .addEventListener("change", (event) => {
+            const theme = event.matches ? "dark" : "light";
+            setTheme(theme);
+        });
+}
+
+export function updateDemoCodeThemeCss(theme) {
+    if (theme === "dark") {
+        let prismThemeLightLinkEl = document.getElementById('prismThemeLightLink');
+        if (prismThemeLightLinkEl)
+            prismThemeLightLinkEl?.remove();
+
+        let prismThemeDarkLinkEl = document.createElement("link");
+        prismThemeDarkLinkEl.setAttribute("rel", "stylesheet");
+        prismThemeDarkLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vsc-dark-plus.min.css");
+        prismThemeDarkLinkEl.setAttribute("id", "prismThemeDarkLink");
+
+        document.head.append(prismThemeDarkLinkEl);
+    }
+    else if (theme === "light") {
+        let prismThemeDarkLinkEl = document.getElementById('prismThemeDarkLink');
+        if (prismThemeDarkLinkEl)
+            prismThemeDarkLinkEl?.remove();
+
+        let prismThemeLightLinkEl = document.createElement("link");
+        prismThemeLightLinkEl.setAttribute("rel", "stylesheet");
+        prismThemeLightLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vs.min.css");
+        prismThemeLightLinkEl.setAttribute("id", "prismThemeLightLink");
+
+        document.head.append(prismThemeLightLinkEl);
+    }
+}
\ No newline at end of file

From 178a64ae890a6d042fb0e00af42a2fed98bae00e Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Thu, 31 Oct 2024 17:32:26 +0530
Subject: [PATCH 11/23] GridDetailView / EmptyDataTemplate / LoadingTemplate
 not showing - fixed. (#926)

---
 blazorbootstrap/Components/Grid/GridDetailView.razor.cs        | 2 +-
 blazorbootstrap/Components/Grid/GridEmptyDataTemplate.razor.cs | 2 +-
 blazorbootstrap/Components/Grid/GridLoadingTemplate.razor.cs   | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/blazorbootstrap/Components/Grid/GridDetailView.razor.cs b/blazorbootstrap/Components/Grid/GridDetailView.razor.cs
index b24999b06..88a761bbd 100644
--- a/blazorbootstrap/Components/Grid/GridDetailView.razor.cs
+++ b/blazorbootstrap/Components/Grid/GridDetailView.razor.cs
@@ -29,6 +29,6 @@ protected override async Task OnInitializedAsync()
             builder.AddContent(100, ChildContent, rowData);
         };
 
-    [CascadingParameter] 
+    [CascadingParameter(Name = "Parent")]
     public Grid Parent { get; set; } = default!;
 }
diff --git a/blazorbootstrap/Components/Grid/GridEmptyDataTemplate.razor.cs b/blazorbootstrap/Components/Grid/GridEmptyDataTemplate.razor.cs
index 7cb0c3341..81ea04f3c 100644
--- a/blazorbootstrap/Components/Grid/GridEmptyDataTemplate.razor.cs
+++ b/blazorbootstrap/Components/Grid/GridEmptyDataTemplate.razor.cs
@@ -29,6 +29,6 @@ protected override async Task OnInitializedAsync()
             builder.AddContent(100, ChildContent);
         };
 
-    [CascadingParameter]
+    [CascadingParameter(Name = "Parent")]
     public Grid Parent { get; set; } = default!;
 }
diff --git a/blazorbootstrap/Components/Grid/GridLoadingTemplate.razor.cs b/blazorbootstrap/Components/Grid/GridLoadingTemplate.razor.cs
index 53329b9a9..51ac498cd 100644
--- a/blazorbootstrap/Components/Grid/GridLoadingTemplate.razor.cs
+++ b/blazorbootstrap/Components/Grid/GridLoadingTemplate.razor.cs
@@ -29,6 +29,6 @@ protected override async Task OnInitializedAsync()
             builder.AddContent(100, ChildContent);
         };
 
-    [CascadingParameter]
+    [CascadingParameter(Name = "Parent")]
     public Grid Parent { get; set; } = default!;
 }

From 38037a71207bf90fc7cd72e421420ac5e5a66531 Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Sat, 2 Nov 2024 15:13:45 +0530
Subject: [PATCH 12/23] 3.1.1 release updates (#928)

---
 .../Client/wwwroot/appsettings.json           |  2 +-
 BlazorBootstrap.Demo.Server/appsettings.json  |  2 +-
 .../wwwroot/appsettings.json                  |  2 +-
 README.md                                     |  2 +-
 blazorbootstrap/BlazorBootstrap.csproj        |  4 ++--
 docs/blog/2024-11-02-blazorbootstrap-3.1.1.md | 23 +++++++++++++++++++
 ...01-a-getting-started-webassembly-NET-8.mdx |  2 +-
 ...ing-started-webapp-server-global-NET-8.mdx |  2 +-
 ...tting-started-webapp-auto-global-NET-8.mdx |  2 +-
 ...01-d-getting-started-maui-blazor-NET-8.mdx |  2 +-
 ...02-a-getting-started-webassembly-NET-7.mdx |  2 +-
 .../02-b-getting-started-server-NET-7.mdx     |  2 +-
 ...02-c-getting-started-maui-blazor-NET-7.mdx |  2 +-
 ...03-a-getting-started-webassembly-NET-6.mdx |  2 +-
 .../03-b-getting-started-server-NET-6.mdx     |  2 +-
 docs/package.json                             |  2 +-
 nuget/README.md                               |  2 +-
 17 files changed, 40 insertions(+), 17 deletions(-)
 create mode 100644 docs/blog/2024-11-02-blazorbootstrap-3.1.1.md

diff --git a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json
index 2ab437181..a55633d1d 100644
--- a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json
+++ b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json
@@ -1,5 +1,5 @@
 {
-  "version": "3.1.0",
+  "version": "3.1.1",
   "release": {
     "short_description": "New Markdown component and other enhancements!!!"
   },
diff --git a/BlazorBootstrap.Demo.Server/appsettings.json b/BlazorBootstrap.Demo.Server/appsettings.json
index 1f5db0e37..54620a75f 100644
--- a/BlazorBootstrap.Demo.Server/appsettings.json
+++ b/BlazorBootstrap.Demo.Server/appsettings.json
@@ -6,7 +6,7 @@
     }
   },
   "AllowedHosts": "*",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "release": {
     "short_description": "New Markdown component and other enhancements!!!"
   },
diff --git a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
index 77d3891aa..a6f4631bf 100644
--- a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
+++ b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json
@@ -1,5 +1,5 @@
 {
-  "version": "3.1.0",
+  "version": "3.1.1",
   "release": {
     "short_description": "New Markdown component and other enhancements!!!"
   },
diff --git a/README.md b/README.md
index ca0d8936b..e14ec003b 100644
--- a/README.md
+++ b/README.md
@@ -41,7 +41,7 @@
 
 ## Install
 
-Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.0`
+Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.1`
 
 ## Install Blazor Bootstrap templates
 
diff --git a/blazorbootstrap/BlazorBootstrap.csproj b/blazorbootstrap/BlazorBootstrap.csproj
index 48b19bdcf..19cb62caa 100644
--- a/blazorbootstrap/BlazorBootstrap.csproj
+++ b/blazorbootstrap/BlazorBootstrap.csproj
@@ -3,8 +3,8 @@
   
 
     Blazor.Bootstrap
-    3.1.0
-    3.1.0
+    3.1.1
+    3.1.1
 
     
     Apache-2.0
diff --git a/docs/blog/2024-11-02-blazorbootstrap-3.1.1.md b/docs/blog/2024-11-02-blazorbootstrap-3.1.1.md
new file mode 100644
index 000000000..7ccf4ea5d
--- /dev/null
+++ b/docs/blog/2024-11-02-blazorbootstrap-3.1.1.md
@@ -0,0 +1,23 @@
+---
+title: Blazor Bootstrap v3.1.1
+authors:
+  name: Vikram Reddy
+  title: Creator
+  url: https://github.com/gvreddy04
+  image_url: https://avatars.githubusercontent.com/u/2337067
+tags: [v3.1.1, blazor, bootstrap, blazorbootstrap, charts, dropdown, googlemap, grid, linechart, markdown]
+---
+
+Blazor Bootstrap v3.1.1 has been released, including a fix for the grid detail view bug.
+
+![image](https://i.imgur.com/eetvhBB.png "Blazor Bootstrap: Grid Component")
+
+
+
+## What's changed
+- Grid: GridDetailView Template not showing #923
+- Grid: GridDetailView closes immediately after opening #920
+
+## Links
+- [Docs Website - Blazor Bootstrap](https://docs.blazorbootstrap.com/)
+- [Demos Website - Blazor Bootstrap](https://demos.blazorbootstrap.com/)
diff --git a/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx b/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
index 8fff1a014..97cb0e82a 100644
--- a/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-a-getting-started-webassembly-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx b/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
index 2553a8b84..ccbdbf630 100644
--- a/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-b-getting-started-webapp-server-global-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx b/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
index b012d6fe0..b31685684 100644
--- a/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-c-getting-started-webapp-auto-global-NET-8.mdx
@@ -87,7 +87,7 @@ The default Blazor template includes demonstration code and Bootstrap. To remove
 Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ### Register services
diff --git a/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx b/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
index 30926ba29..99ffcec97 100644
--- a/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
+++ b/docs/docs/01-getting-started/01-d-getting-started-maui-blazor-NET-8.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx b/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
index c96c1c503..eba629475 100644
--- a/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-a-getting-started-webassembly-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx b/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
index 4965f597e..b963f09e4 100644
--- a/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-b-getting-started-server-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx b/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
index b38384a6f..691e252e5 100644
--- a/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
+++ b/docs/docs/01-getting-started/02-c-getting-started-maui-blazor-NET-7.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx b/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
index de1623c07..80f5071d5 100644
--- a/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
+++ b/docs/docs/01-getting-started/03-a-getting-started-webassembly-NET-6.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx b/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
index e436525ad..bf02e027a 100644
--- a/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
+++ b/docs/docs/01-getting-started/03-b-getting-started-server-NET-6.mdx
@@ -18,7 +18,7 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o
 Looking to quickly add **Blazor Bootstrap** to your project? Use NuGet package manager.
 
 ```shell
-Install-Package Blazor.Bootstrap -Version 3.1.0
+Install-Package Blazor.Bootstrap -Version 3.1.1
 ```
 
 ## Add CSS references
diff --git a/docs/package.json b/docs/package.json
index a45b71997..3ff7eb3e3 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "blazorbootstrap",
-  "version": "3.1.0",
+  "version": "3.1.1",
   "private": true,
   "scripts": {
     "docusaurus": "docusaurus",
diff --git a/nuget/README.md b/nuget/README.md
index 7658f212c..c99526ccc 100644
--- a/nuget/README.md
+++ b/nuget/README.md
@@ -18,7 +18,7 @@
 Get started any way you want
 
 - Clone the repo: `git clone https://github.com/vikramlearning/blazorbootstrap.git`
-- Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.0`
+- Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.1`
 - Install [Blazor Bootstrap templates](https://github.com/vikramlearning/blazorbootstrap-project-templates) with **.NET CLI**: `dotnet new install Blazor.Bootstrap.Templates::1.10.0`
 
   ![image](https://user-images.githubusercontent.com/2337067/233800604-43986ae7-27dd-4f17-9af6-c2f1a6f07097.png)

From 8e44b84b7332d1b45058ac2535445d8c07bb304c Mon Sep 17 00:00:00 2001
From: Vikram Reddy 
Date: Mon, 4 Nov 2024 23:10:57 +0530
Subject: [PATCH 13/23] ThemeSwitcher component (#929)

* ThemeSwitcher updates
* RCL - Shared components updated
* Route constants added
---
 .../Components/Layout/EmptyLayout.razor       |  24 +-
 .../Components/Layout/MainLayout.razor        |  27 +-
 .../Components/Layout/MainLayout.razor.cs     |   9 +-
 .../Components/Layout/MainLayoutBase.cs       |  16 -
 .../Pages/AI/AIChat/AIChatDocumentation.razor |  31 +-
 .../Accordion/AccordionDocumentation.razor    | 189 ++++++------
 .../Pages/Alerts/AlertDocumentation.razor     |  68 +++--
 .../Pages/Badge/BadgeDocumentation.razor      | 103 ++++---
 .../Breadcrumb/BreadcrumbDocumentation.razor  |  41 +--
 .../Pages/Buttons/ButtonDocumentation.razor   | 188 ++++++------
 .../Pages/Callout/CalloutDocumentation.razor  |  46 +--
 .../Pages/Card/CardDocumentation.razor        | 194 ++++++------
 .../Carousel/CarouselDocumentation.razor      | 151 +++++-----
 .../BarCharts/BarChartDocumentation.razor     |  38 +--
 .../Pages/Charts/ChartsDocumentation.razor    |  75 ++---
 .../DoughnutChartDocumentation.razor          |  65 ++--
 .../LineCharts/LineChartDocumentation.razor   | 104 ++++---
 .../PieCharts/PieChartDocumentation.razor     |  76 ++---
 .../PolarAreaChartDocumentation.razor         |  54 ++--
 .../RadarCharts/RadarChartDocumentation.razor |  55 ++--
 .../ScatterChartDocumentation.razor           |  74 ++---
 .../Collapse/CollapseDocumentation.razor      |  90 +++---
 .../ConfirmDialogDocumentation.razor          | 129 ++++----
 .../Dropdowns/DropdownDocumentation.razor     | 280 +++++++++---------
 .../AutoCompleteDocumentation.razor           | 107 ++++---
 .../CurrencyInputDocumentation.razor          | 174 ++++++-----
 .../DateInput/DateInputDocumentation.razor    | 133 +++++----
 .../NumberInputDocumentation.razor            | 118 ++++----
 .../RangeInput/RangeInputDocumentation.razor  | 118 ++++----
 .../Form/Switch/SwitchDocumentation.razor     |  80 ++---
 .../TimeInput/TimeInputDocumentation.razor    | 127 ++++----
 .../GettingStartedDocumentation.razor         |  72 ++---
 .../Grid_Overview_Documentation.razor         |  35 ++-
 .../Grid_DataBinding_Documentation.razor      |  53 ++--
 .../Grid_Filters_Documentation.razor          | 106 ++++---
 .../04-paging/Grid_Paging_Documentation.razor |  51 ++--
 .../Grid_Sorting_Documentation.razor          |  54 ++--
 .../Grid_Selection_Documentation.razor        |  87 +++---
 .../Grid_Alignment_Documentation.razor        |  35 ++-
 .../Grid_GridSettings_Documentation.razor     |  32 +-
 .../Grid_CustomCSSClass_Documentation.razor   |  56 ++--
 .../10-events/Grid_Events_Documentation.razor |  35 ++-
 .../Grid_Translations_Documentation.razor     |  28 +-
 .../Grid_FixedHeader_Documentation.razor      |  39 +--
 .../Grid_FreezeColumns_Documentation.razor    |  38 ++-
 .../Grid_DetailView_Documentation.razor       |  35 ++-
 .../Grid_Nested_Documentation.razor           |  28 +-
 .../99-other/Grid_Other_Documentation.razor   |  58 ++--
 .../Pages/Icons/IconDocumentation.razor       |  98 +++---
 .../Pages/Images/ImageDocumentation.razor     |  59 ++--
 .../Components/Pages/Index.razor              |   2 +-
 .../server/LayoutServerDocumentation.razor    |  62 ++--
 .../LayoutWebAssemblyDocumentation.razor      |  63 ++--
 .../Pages/Maps/GoogleMapDocumentation.razor   | 120 ++++----
 .../Markdown/MarkdownDocumentation.razor      | 228 +++++++-------
 .../Pages/Modal/ModalDocumentation.razor      | 121 ++++----
 .../Offcanvas/OffcanvasDocumentation.razor    | 105 ++++---
 .../Pagination/PaginationDocumentation.razor  |  60 ++--
 .../PdfViewer/PdfViewerDocumentation.razor    |  59 ++--
 .../PlaceholderDocumentation.razor            |  68 +++--
 .../Pages/Preload/PreloadDocumentation.razor  |  80 ++---
 .../Progress/ProgressDocumentation.razor      |  90 +++---
 .../Pages/Ribbon/RibbonDocumentation.razor    |  44 +--
 .../ScriptLoaderDocumentation.razor           |  68 +++--
 .../ModalServiceDocumentation.razor           |  63 ++--
 .../Pages/Sidebar/SidebarDocumentation.razor  | 123 ++++----
 .../Sidebar2/Sidebar2Documentation.razor      |  87 +++---
 .../SortableListDocumentation.razor           | 153 +++++-----
 .../Spinners/SpinnersDocumentation.razor      | 107 ++++---
 .../Pages/Tabs/TabsDocumentation.razor        | 190 ++++++------
 .../Pages/Toasts/ToastsDocumentation.razor    | 108 ++++---
 .../Tooltips/TooltipsDocumentation.razor      |  71 +++--
 .../ColorUtil/ColorUtilDocumentation.razor    |  45 +--
 .../Components/Shared/PageHero.razor          |   7 +
 .../Components/Shared/PageHero.razor.cs       |  10 +
 .../{MetaTags.razor => PageMetaTags.razor}    |   3 +
 ...etaTags.razor.cs => PageMetaTags.razor.cs} |  46 ++-
 .../Components/Shared/Section.razor           |  48 +++
 .../Components/Shared/Section.razor.cs        |  56 ++++
 .../Components/Shared/SectionHeading.razor    |  32 --
 .../Components/Shared/SectionHeading.razor.cs |  39 ---
 .../Constants/RouteConstants.cs               | 104 +++++++
 .../Shared => }/Enums/LanguageCode.cs         |   0
 .../Shared => }/Extensions/EnumExtensions.cs  |   0
 .../wwwroot/js/blazorbootstrap.demo.rcl.js    |  92 ++----
 .../ThemeSwitcher/ThemeSwitcher.razor         |  44 +--
 .../ThemeSwitcher/ThemeSwitcher.razor.cs      |  36 ++-
 .../ThemeSwitcher/ThemeSwitcherJsInterop.cs   |  14 +-
 .../blazor.bootstrap.theme-switcher.js        |  58 ++--
 89 files changed, 3681 insertions(+), 3008 deletions(-)
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor.cs
 rename BlazorBootstrap.Demo.RCL/Components/Shared/{MetaTags.razor => PageMetaTags.razor} (94%)
 rename BlazorBootstrap.Demo.RCL/Components/Shared/{MetaTags.razor.cs => PageMetaTags.razor.cs} (57%)
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor
 create mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor.cs
 delete mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor
 delete mode 100644 BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor.cs
 create mode 100644 BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs
 rename BlazorBootstrap.Demo.RCL/{Components/Shared => }/Enums/LanguageCode.cs (100%)
 rename BlazorBootstrap.Demo.RCL/{Components/Shared => }/Extensions/EnumExtensions.cs (100%)

diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor
index c2ad8e129..03fd94491 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor
@@ -67,28 +67,8 @@
                         
    
                         
    
                     
    • 
-                    
  • 
-                        
-                        
      
-                            
    • 
-                                
-                            
      • 
-                            
    • 
-                                
-                            
      • 
-                            
    • 
-                                
-                            
      • 
-                        
    
+                    
  • 
+                        
                     
    • 
                 
             
    
diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
index 25b9d8b0a..bd03d2ce0 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor
@@ -3,7 +3,30 @@
 
 
     
-        
+        
    
+            
+                
+            
+        
    
+        
    
+            
+                
+            
+        
    
+        
    
+            
+                
+            
+        
    
+        
    
+            
+                
+            
+        
    
+        
    
+            
    
+        
    
+        
         
     
         
+                  WidthUnit="Unit.Px" />
     
 
     
diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs
index d4797337d..7ceae60b7 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs
+++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs
@@ -17,7 +17,7 @@ internal override IEnumerable GetNavItems()
             new (){ Id = "301", Text = "Images", Href = "/images", IconName = IconName.Image, ParentId = "3" },
 
             new (){ Id = "4", Text = "Forms", IconName = IconName.InputCursorText, IconColor = IconColor.Success },
-            new (){ Id = "400", Text = "Auto Complete", Href = "/autocomplete", IconName = IconName.InputCursorText, ParentId = "4" },
+            new (){ Id = "400", Text = "Auto Complete", Href = "/form/autocomplete", IconName = IconName.InputCursorText, ParentId = "4" },
             new (){ Id = "401", Text = "Currency Input", Href = "/form/currency-input", IconName = IconName.CurrencyDollar, ParentId = "4" },
             new (){ Id = "402", Text = "Date Input", Href = "/form/date-input", IconName = IconName.CalendarDate, ParentId = "4" },
             new (){ Id = "403", Text = "Number Input", Href = "/form/number-input", IconName = IconName.InputCursor, ParentId = "4" },
@@ -90,7 +90,7 @@ internal override IEnumerable GetNavItems()
             new (){ Id = "605", Text = "Scatter Chart", Href = "/charts/scatter-chart", IconName = IconName.GraphUpArrow, ParentId = "6", Match = NavLinkMatch.All },
 
             new(){ Id = "7", Text = "Services", IconName = IconName.WrenchAdjustableCircleFill, IconColor = IconColor.Success },
-            new (){ Id = "700", Text = "Modal Service", Href = "/modal-service", IconName = IconName.WindowStack, ParentId = "7" },
+            new (){ Id = "700", Text = "Modal Service", Href = "/services/modal-service", IconName = IconName.WindowStack, ParentId = "7" },
 
             new(){ Id = "19", Text = "Utilities", IconName = IconName.GearWideConnected, IconColor = IconColor.Info },
             new (){ Id = "1900", Text = "Color Utility", Href = "/utils/color-utility", IconName = IconName.Palette2, ParentId = "19" },
@@ -98,4 +98,9 @@ internal override IEnumerable GetNavItems()
 
         return navItems;
     }
+
+    private void OnThemeChanged(string themeName)
+    {
+        JS.InvokeVoidAsync("updateDemoCodeThemeCss", themeName);
+    }
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs
index 92ce935ec..38c42ce5f 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs
+++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs
@@ -20,14 +20,6 @@ public class MainLayoutBase : LayoutComponentBase
 
     [Inject] protected IJSRuntime JS { get; set; } = default!;
 
-    protected override async Task OnAfterRenderAsync(bool firstRender)
-    {
-        if (firstRender)
-            await JS.InvokeVoidAsync("initializeTheme");
-
-        await base.OnAfterRenderAsync(firstRender);
-    }
-
     protected override void OnInitialized()
     {
         version = $"v{Configuration["version"]}"; // example: v0.6.1
@@ -43,14 +35,6 @@ protected override void OnInitialized()
         base.OnInitialized();
     }
 
-    internal Task SetAutoTheme() => SetTheme("system");
-
-    internal Task SetDarkTheme() => SetTheme("dark");
-
-    internal Task SetLightTheme() => SetTheme("light");
-
-    internal async Task SetTheme(string themeName) => await JS.InvokeVoidAsync("setTheme", themeName);
-
     internal virtual async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request)
     {
         if (navItems is null)
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor
index 559e797cd..fffd2c360 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/AI/AIChat/AIChatDocumentation.razor
@@ -1,21 +1,26 @@
-@page "/ai/open-ai-chat"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Open AI Chat
    
-
    Provide contextual feedback messages for typical user actions with a handful of available and flexible alert messages.
    
+
+    @pageDescription
+
 
 
 
-
-
    Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight colors.
    
-
+
    
+    
    Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight colors.
    
+    
+
    
 
 @code{
-    private string pageUrl = "/ai/open-ai-chat";
-    private string title = "Blazor Open AI Chat Component";
-    private string description = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages."; // TODO: update
-    private string imageUrl = "https://i.imgur.com/FGgEMp6.jpg"; // TODO: update
+    private const string pageUrl = RouteConstants.Demos_AI_Chat_Documentation;
+    private const string pageTitle = "Blazor Open AI Chat Component";
+    private const string pageDescription = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages."; // TODO: update
+    private const string metaTitle = "Blazor Open AI Chat Component";
+    private const string metaDescription = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages."; // TODO: update
+    private const string imageUrl = "https://i.imgur.com/FGgEMp6.jpg"; // TODO: update
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Accordion/AccordionDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Accordion/AccordionDocumentation.razor
index eae3166b3..2aa5f2dea 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Accordion/AccordionDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Accordion/AccordionDocumentation.razor
@@ -1,111 +1,122 @@
-@page "/accordion"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Accordion
    
-
    
-    Build vertically collapsing accordions in combination with our Collapse component.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    The Accordion component uses the Collapse component internally to make it collapsible.
-
    
+
    
+    
    
+        The Accordion component uses the Collapse component internally to make it collapsible.
+    
    
+
    
 
 
     The animation effect of this component is dependent on the prefers-reduced-motion media query. 
    
     See the reduced motion section of our accessibility documentation.
     
 
-
-
    
-    Click the accordions below to expand/collapse the accordion content.
-
    
-
+
    
+    
    
+        Click the accordions below to expand/collapse the accordion content.
+    
    
+    
+
    
 
-
-
    
-    To customize the accordion title, use TitleTemplate, as shown in the below example.
-
    
-
+
    
+    
    
+        To customize the accordion title, use TitleTemplate, as shown in the below example.
+    
    
+    
+
    
 
-
-
    
-    Set the Flush parameter to true to remove borders and rounded corners to render accordions edge-to-edge with their parent container.
-
    
-
+
    
+    
    
+        Set the Flush parameter to true to remove borders and rounded corners to render accordions edge-to-edge with their parent container.
+    
    
+    
+
    
 
-
-
    
-    Set the Active parameter to true to keep the accordion item open by default.
-
    
-
+
    
+    
    
+        Set the Active parameter to true to keep the accordion item open by default.
+    
    
+    
+
    
 
-
-
    
-    Set the AlwaysOpen parameter to true to keep accordion items open when another item is opened.
-
    
-
+
    
+    
    
+        Set the AlwaysOpen parameter to true to keep accordion items open when another item is opened.
+    
    
+    
+
    
 
-
-
    
-    You can show and hide individual accordion items in several ways.
-    
      
-        
    • To show an accordion item, use predefined methods ShowFirstAccordionItemAsync, ShowLastAccordionItemAsync, ShowAccordionItemByNameAsync, and ShowAccordionItemByIndexAsync.
      • 
-        
    • To hide an accordion item, use predefined methods HideFirstAccordionItemAsync, HideLastAccordionItemAsync, HideAccordionItemByNameAsync, and HideAccordionItemByIndexAsync.
      • 
-    
    
-
    
-
+
    
+    
    
+        You can show and hide individual accordion items in several ways.
+        
      
+            
    • To show an accordion item, use predefined methods ShowFirstAccordionItemAsync, ShowLastAccordionItemAsync, ShowAccordionItemByNameAsync, and ShowAccordionItemByIndexAsync.
      • 
+            
    • To hide an accordion item, use predefined methods HideFirstAccordionItemAsync, HideLastAccordionItemAsync, HideAccordionItemByNameAsync, and HideAccordionItemByIndexAsync.
      • 
+        
    
+    
    
+    
+
    
 
-
-
    
-    When the AlwaysOpen parameter is set to true, you can show all accordion items simultaneously using the ShowAllAccordionItemsAsync method.
+
    
+    
    
+        When the AlwaysOpen parameter is set to true, you can show all accordion items simultaneously using the ShowAllAccordionItemsAsync method.
         The HideAllAccordionItemsAsync method will hide all accordion items, regardless of the value of AlwaysOpen.
-
    
-
+    
    
+    
+
 
-
-
    
-    Blazor Bootstrap Accordion component exposes a few events for hooking into accordion functionality.
-    
-        
-            
-                
-                
-            
-        
-        
-            
-                
-                
-            
-            
-                
-                
-            
-            
-                
-                
-            
-            
-                
-                
-            
-        
-    
    Event NameDescription
    OnHidingThis event is fired immediately when the hide method has been called.
    OnHiddenThis event is fired when a accordion item has been hidden from the user (will wait for CSS transitions to complete).
    OnShowingThis event fires immediately when the show method is called.
    OnShownThis event is fired when a accordion item has been made visible to the user (will wait for CSS transitions to complete).
    
-    
-        If no accordion item is active, then the OnHiding and OnHidden events will not be fired.
-    
-
    
-
+
    
+    
    
+        Blazor Bootstrap Accordion component exposes a few events for hooking into accordion functionality.
+        
+            
+                
+                    
+                    
+                
+            
+            
+                
+                    
+                    
+                
+                
+                    
+                    
+                
+                
+                    
+                    
+                
+                
+                    
+                    
+                
+            
+        
    Event NameDescription
    OnHidingThis event is fired immediately when the hide method has been called.
    OnHiddenThis event is fired when a accordion item has been hidden from the user (will wait for CSS transitions to complete).
    OnShowingThis event fires immediately when the show method is called.
    OnShownThis event is fired when a accordion item has been made visible to the user (will wait for CSS transitions to complete).
    
+        
+            If no accordion item is active, then the OnHiding and OnHidden events will not be fired.
+        
+    
    
+    
+
    
 
 @code {
-    private string pageUrl = "/accordion";
-    private string title = "Blazor Accordion Component";
-    private string description = "Build vertically collapsing accordions in combination with our Collapse component.";
-    private string imageUrl = "https://i.imgur.com/g4zpMXp.png";
+    private const string pageUrl = RouteConstants.Demos_Accordion_Documentation;
+    private const string pageTitle = "Blazor Accordion";
+    private const string pageDescription = "Build vertically collapsing accordions in combination with our Collapse component.";
+    private const string metaTitle = "Blazor Accordion Component";
+    private const string metaDescription = "Build vertically collapsing accordions in combination with our Collapse component.";
+    private const string imageUrl = "https://i.imgur.com/g4zpMXp.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Alerts/AlertDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Alerts/AlertDocumentation.razor
index b4e3cb65b..d49284a36 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Alerts/AlertDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Alerts/AlertDocumentation.razor
@@ -1,48 +1,58 @@
-@page "/alerts"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Alerts
    
-
    Provide contextual feedback messages for typical user actions with a handful of available and flexible alert messages.
    
+
+    @pageDescription
+
 
 
 
-
-
    Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight colors.
    
-
+
    
+    
    Alerts are available for any length of text, as well as an optional close button. For proper styling, use one of the eight colors.
    
+    
+
    
 
-
-
    Use the alert-link css class to quickly provide matching colored links within any alert.
    
-
+
    
+    
    Use the alert-link css class to quickly provide matching colored links within any alert.
    
+    
+
    
 
-
-
    Alerts can also contain additional HTML elements like headings, paragraphs and dividers.
    
-
+
    
+    
    Alerts can also contain additional HTML elements like headings, paragraphs and dividers.
    
+    
+
    
 
-
-
    Similarly, you can use Bootstrap Icons to create alerts with icons.
    
-
+
    
+    
    Similarly, you can use Bootstrap Icons to create alerts with icons.
    
+    
+
    
 
-
-
    1. Using the Dismissable="true", it’s possible to dismiss any alert inline.
    
-
+
    
+    
    1. Using the Dismissable="true", it’s possible to dismiss any alert inline.
    
+    
 
-
    2. Manually we can close an alert with button click.
    
-
+    
    2. Manually we can close an alert with button click.
    
+    
+
    
 
 
     When an alert is dismissed, the element is completely removed from the page structure. If a keyboard user dismisses the alert using the close button, their focus will suddenly be lost and, depending on the browser, reset to the start of the page/document.
     For this reason, we recommend subscribing to the OnClosed callback event and programmatically sets focus to the most appropriate location on the page.
 
 
-
-
+
    
+    
+
    
 
 @code{
-    private string pageUrl = "/alerts";
-    private string title = "Blazor Alert Component";
-    private string description = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages.";
-    private string imageUrl = "https://i.imgur.com/FGgEMp6.jpg";
+    private const string pageUrl = RouteConstants.Demos_Alerts_Documentation;
+    private const string pageTitle = "Blazor Alert";
+    private const string pageDescription = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages.";
+    private const string metaTitle = "Blazor Alert Component";
+    private const string metaDescription = "Provide contextual feedback messages for typical user actions with the handful of available and flexible Blazor Bootstrap alert messages.";
+    private const string imageUrl = "https://i.imgur.com/FGgEMp6.jpg";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Badge/BadgeDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Badge/BadgeDocumentation.razor
index 36b957c54..1ac1ad314 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Badge/BadgeDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Badge/BadgeDocumentation.razor
@@ -1,61 +1,70 @@
-@page "/badge"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Badge
    
-
    
-    The Blazor Bootstrap Badge component shows the small count and labels.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Badges scale to match the size of the immediate parent element by using relative font sizing and em units.
-    As of now, badges no longer have focus or hover styles for links.
-
    
-
+
    
+    
    
+        Badges scale to match the size of the immediate parent element by using relative font sizing and em units.
+        As of now, badges no longer have focus or hover styles for links.
+    
    
+    
+
    
+
+
    
+    
+
    
 
-
-
 
     Using color to add meaning only provides a visual indication, which will not be conveyed to users of assistive technologies – such as screen readers.
     Ensure that information denoted by the color is either obvious from the content itself (e.g., the visible text) or is included through alternative means, such as additional text hidden with the VisuallyHiddenText parameter.
 
 
-
-
    
-    Use the IndicatorType parameter to make badges more rounded with a larger border-radius.
-
    
-
-
-
-
    
-    Badges can be used as part of links or buttons to provide a counter.
-
    
-
-
    
-    
    Note that depending on how they are used, badges may be confusing for users of screen readers and similar assistive technologies. While the styling of badges provides a visual cue as to their purpose, these users will simply be presented with the content of the badge. Depending on the specific situation, these badges may seem like random additional words or numbers at the end of a sentence, link, or button.
    
-    
    Unless the context is clear (as with the “Notifications” example, where it is understood that the “4” is the number of notifications), consider including additional context with a visually hidden piece of additional text.
    
-
    
-
-
-
    
-    Use Position and Placement parameters to position it in the corner of a link or button.
-
    
-
-
-
-
    
-    You can also replace the badge with a generic indicator without the count.
-
    
-
+
    
+    
    
+        Use the IndicatorType parameter to make badges more rounded with a larger border-radius.
+    
    
+    
+
    
+
+
    
+    
    
+        Badges can be used as part of links or buttons to provide a counter.
+    
    
+    
+    
    
+        
    Note that depending on how they are used, badges may be confusing for users of screen readers and similar assistive technologies. While the styling of badges provides a visual cue as to their purpose, these users will simply be presented with the content of the badge. Depending on the specific situation, these badges may seem like random additional words or numbers at the end of a sentence, link, or button.
    
+        
    Unless the context is clear (as with the “Notifications” example, where it is understood that the “4” is the number of notifications), consider including additional context with a visually hidden piece of additional text.
    
+    
    
+
    
+
+
    
+    
    
+        Use Position and Placement parameters to position it in the corner of a link or button.
+    
    
+    
+
    
+
+
    
+    
    
+        You can also replace the badge with a generic indicator without the count.
+    
    
+    
+
    
 
 @code {
-    private string pageUrl = "/badge";
-    private string title = "Blazor Badge Component";
-    private string description = "The Blazor Bootstrap Badge component shows the small count and labels.";
-    private string imageUrl = "https://i.imgur.com/ux0sTs9.png";
+    private const string pageUrl = RouteConstants.Demos_Badge_Documentation;
+    private const string pageTitle = "Blazor Badge";
+    private const string pageDescription = "The Blazor Bootstrap Badge component shows the small count and labels.";
+    private const string metaTitle = "Blazor Badge Component";
+    private const string metaDescription = "The Blazor Bootstrap Badge component shows the small count and labels.";
+    private const string imageUrl = "https://i.imgur.com/ux0sTs9.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Breadcrumb/BreadcrumbDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Breadcrumb/BreadcrumbDocumentation.razor
index 4c07d3e26..2afe81ab4 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Breadcrumb/BreadcrumbDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Breadcrumb/BreadcrumbDocumentation.razor
@@ -1,28 +1,33 @@
-@page "/breadcrumb"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Breadcrumb
    
-
    
-    Indicate the current page's location within a navigational hierarchy that automatically adds separators.
-
    
+
+    @pageDescription
+
 
 
 
-
-
+
    
+    
+
    
 
-
-
+
    
+    
+
    
 
-
-
+
    
+    
+
    
 
 @code {
-    private string pageUrl = "/breadcrumb";
-    private string title = "Blazor Breadcrumb Component";
-    private string description = "Indicate the current page's location within a navigational hierarchy that automatically adds separators.";
-    private string imageUrl = "https://i.imgur.com/hO90HoC.jpg";
+    private const string pageUrl = RouteConstants.Demos_Breadcrumb_Documentation;
+    private const string pageTitle = "Blazor Breadcrumb";
+    private const string pageDescription = "Indicate the current page's location within a navigational hierarchy that automatically adds separators.";
+    private const string metaTitle = "Blazor Breadcrumb Component";
+    private const string metaDescription = "Indicate the current page's location within a navigational hierarchy that automatically adds separators.";
+    private const string imageUrl = "https://i.imgur.com/hO90HoC.jpg";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Buttons/ButtonDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Buttons/ButtonDocumentation.razor
index a64ee925a..0ac15eb22 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Buttons/ButtonDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Buttons/ButtonDocumentation.razor
@@ -1,94 +1,110 @@
-@page "/buttons"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Buttons
    
-
    
-    Use Blazor Bootstrap button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.
    
-
-
-
-
-
-
-
-
-
-    Some of the button styles use a relatively light foreground color, and should only be used on a dark background in order to have sufficient contrast.
-
-
-
-
    Fancy larger or smaller buttons? Add Size="ButtonSize.Large" or Size="ButtonSize.Small" for additional sizes.
    
-
-
-
-
-
-
    Make buttons look inactive by adding the Disabled="true" boolean parameter to any Button component. Disabled buttons have pointer-events: none applied to, preventing hover and active states from triggering.
    
-
-
-    Disabled buttons using the Type="ButtonType.Link" parameter behave a bit different.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
    Use spinners within buttons to indicate an action is currently processing or taking place. You may also swap the text out of the spinner element and utilize button text as needed.
    
-
-
-
-
-
-
-
    
-    Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left.
-
    
-
-
-
-
-
-
-
    
-    Blazor Bootstrap includes several predefined tooltip styles, each serving its own semantic purpose.
-    The TooltipColor parameter can be used to customize the color of the tooltip.
-
    
-
-
-
-    Support for HTML tooltips is not available at this moment.
-
-
-
-
-
-
+
    
+    
    Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
+    
+        Some of the button styles use a relatively light foreground color, and should only be used on a dark background in order to have sufficient contrast.
+    
+
    
+
+
    
+    
    Fancy larger or smaller buttons? Add Size="ButtonSize.Large" or Size="ButtonSize.Small" for additional sizes.
    
+    
+    
+    
+
    
+
+
    
+    
    Make buttons look inactive by adding the Disabled="true" boolean parameter to any Button component. Disabled buttons have pointer-events: none applied to, preventing hover and active states from triggering.
    
+
+    
+        Disabled buttons using the Type="ButtonType.Link" parameter behave a bit different.
+    
+
+    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+    
+    
+    
+
    
+
+
    
+    
+    
+
    
+
+
    
+    
    Use spinners within buttons to indicate an action is currently processing or taking place. You may also swap the text out of the spinner element and utilize button text as needed.
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
    
+        Hover over the buttons below to see the four tooltips directions: top, right, bottom, and left.
+    
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
    
+        Blazor Bootstrap includes several predefined tooltip styles, each serving its own semantic purpose.
+        The TooltipColor parameter can be used to customize the color of the tooltip.
+    
    
+    
+
+    
+        Support for HTML tooltips is not available at this moment.
+    
+
    
+
+
    
+    
+    
+    
+
    
 
 @code {
-    private string pageUrl = "/buttons";
-    private string title = "Blazor Button Component";
-    private string description = "Use Blazor Bootstrap button styles for actions in forms, dialogs, and more with support for multiple sizes, states, etc.";
-    private string imageUrl = "https://i.imgur.com/Ne7FJ5H.jpg";
+    private const string pageUrl = RouteConstants.Demos_Buttons_Documentation;
+    private const string pageTitle = "Blazor Button";
+    private const string pageDescription = "Use Blazor Bootstrap button styles for actions in forms, dialogs, and more with support for multiple sizes, states, etc.";
+    private const string metaTitle = "Blazor Button Component";
+    private const string metaDescription = "Use Blazor Bootstrap button styles for actions in forms, dialogs, and more with support for multiple sizes, states, etc.";
+    private const string imageUrl = "https://i.imgur.com/Ne7FJ5H.jpg";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Callout/CalloutDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Callout/CalloutDocumentation.razor
index 56694fec9..61564e389 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Callout/CalloutDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Callout/CalloutDocumentation.razor
@@ -1,31 +1,37 @@
-@page "/callout"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Callout
    
-
    
-    Blazor Bootstrap callout component provides presentation of content in a visually distinct manner. Includes a heading, icon and typically text-based content.
-
    
+
+    @pageDescription
+
 
 
 
-
-
+
    
+    
+
    
 
-
-
+
    
+    
+
    
 
-
-
+
    
+    
+
    
 
-
-
+
    
+    
+
    
 
 @code {
-    private string pageUrl = "/callout";
-    private string title = "Blazor Callout Component";
-    private string description = "Blazor Bootstrap callout component provides content presentation in a visually distinct manner.";
-    private string imageUrl = "https://i.imgur.com/y2jI9ix.png";
+    private const string pageUrl = RouteConstants.Demos_Callout_Documentation;
+    private const string pageTitle = "Blazor Callout";
+    private const string pageDescription = "Blazor Bootstrap callout component provides content presentation in a visually distinct manner.";
+    private const string metaTitle = "Blazor Callout Component";
+    private const string metaDescription = "Blazor Bootstrap callout component provides content presentation in a visually distinct manner.";
+    private const string imageUrl = "https://i.imgur.com/y2jI9ix.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Card/CardDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Card/CardDocumentation.razor
index 8e219ac78..1537aeabf 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Card/CardDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Card/CardDocumentation.razor
@@ -1,97 +1,113 @@
-@page "/card"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Card
    
-
    
-    BootstrapBootstrap's cards provide a flexible and extensible content container with multiple variants and options.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.
-
    
-
-
-
    
-    Below is an example of a basic card with mixed content and a fixed width.
-    Cards have no fixed width to start, so they'll naturally fill the full width of its parent element.
-
    
-
-
-
-
    
-    Cards support a wide variety of content, including images, text, list groups, links, and more.
-    Below are examples of what’s supported.
-
    
-
-
-
    
-    The building block of a card is the CardBody. Use it whenever you need a padded section within a card.
-
    
-
-
-
-
-
-
-
-
-
-
    
-    Create lists of content in a card with a flush list group.
-
    
-
-
-
-
    
-    Mix and match multiple content types to create the card you need, or throw everything in there.
-    Shown below are image styles, blocks, text styles, and a list group—all wrapped in a fixed-width card.
-
    
-
-
-
-
    
-    Add an optional header and/or footer within a card.
-
    
-
-
-
-
    
-    Cards assume no specific width to start, so they’ll be 100% wide unless otherwise stated.
-    You can change this as needed with custom CSS, grid classes, grid Sass mixins, or utilities.
-
    
-
-
-
-
    
-    You can quickly change the text alignment of any card—in its entirety or specific parts—with our TextAlignment parameter.
-
    
-
-
-
-
-
-
-
    
-    Use card groups to render cards as a single, attached element with equal width and height columns. 
-    Card groups start off stacked and use display: flex; to become attached with uniform dimensions starting at the sm breakpoint.
-
    
-
-
-
-
    
-    When using card groups with footers, their content will automatically line up.
-
    
-
+
    
+    
    
+        A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.
+    
    
+
    
+
+
    
+    
    
+        Below is an example of a basic card with mixed content and a fixed width.
+        Cards have no fixed width to start, so they'll naturally fill the full width of its parent element.
+    
    
+    
+
    
+
+
    
+    
    
+        Cards support a wide variety of content, including images, text, list groups, links, and more.
+        Below are examples of what’s supported.
+    
    
+
    
+
+
    
+    
    
+        The building block of a card is the CardBody. Use it whenever you need a padded section within a card.
+    
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
    
+        Create lists of content in a card with a flush list group.
+    
    
+    
+
    
+
+
    
+    
    
+        Mix and match multiple content types to create the card you need, or throw everything in there.
+        Shown below are image styles, blocks, text styles, and a list group—all wrapped in a fixed-width card.
+    
    
+    
+
    
+
+
    
+    
    
+        Add an optional header and/or footer within a card.
+    
    
+    
+
    
+
+
    
+    
    
+        Cards assume no specific width to start, so they’ll be 100% wide unless otherwise stated.
+        You can change this as needed with custom CSS, grid classes, grid Sass mixins, or utilities.
+    
    
+    
+
    
+
+
    
+    
    
+        You can quickly change the text alignment of any card—in its entirety or specific parts—with our TextAlignment parameter.
+    
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
    
+        Use card groups to render cards as a single, attached element with equal width and height columns. 
+        Card groups start off stacked and use display: flex; to become attached with uniform dimensions starting at the sm breakpoint.
+    
    
+    
+
    
+
+
    
+    
    
+        When using card groups with footers, their content will automatically line up.
+    
    
+    
+
    
 
 @code {
-    private string pageUrl = "/card";
-    private string title = "Blazor Card Component";
-    private string description = "BootstrapBootstrap's cards provide a flexible and extensible content container with multiple variants and options.";
-    private string imageUrl = "https://i.imgur.com/RhytwPa.png";
+    private const string pageUrl = RouteConstants.Demos_Card_Documentation;
+    private const string pageTitle = "Blazor Card";
+    private const string pageDescription = "BootstrapBootstrap's cards provide a flexible and extensible content container with multiple variants and options.";
+    private const string metaTitle = "Blazor Card Component";
+    private const string metaDescription = "BootstrapBootstrap's cards provide a flexible and extensible content container with multiple variants and options.";
+    private const string imageUrl = "https://i.imgur.com/RhytwPa.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Carousel/CarouselDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Carousel/CarouselDocumentation.razor
index 68900b6be..ec55ccdce 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Carousel/CarouselDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Carousel/CarouselDocumentation.razor
@@ -1,81 +1,91 @@
-@page "/carousel"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Carousel
    
-
    Blazor Carousel component is a slideshow component that cycles through elements, images, or slides of text.
    
+
+    @pageDescription
+
 
 
 
-
-
    Here is a basic example of a carousel with three slides.
    
-
+
    
+    
    Here is a basic example of a carousel with three slides.
    
+    
+
    
 
-
-
    
-    You can add indicators to the carousel, alongside the previous/next controls.
-    The indicators allow users to jump directly to a particular slide.
-    Set ShowIndicators to true to show the indicators.
-
    
-
+
    
+    
    
+        You can add indicators to the carousel, alongside the previous/next controls.
+        The indicators allow users to jump directly to a particular slide.
+        Set ShowIndicators to true to show the indicators.
+    
    
+    
+
    
 
-
-
    
-    You can add captions to your slides with the CarouselCaption component within any CarouselItem.
-    They can be easily hidden on smaller viewports.
-
    
-
+
    
+    
    
+        You can add captions to your slides with the CarouselCaption component within any CarouselItem.
+        They can be easily hidden on smaller viewports.
+    
    
+    
+
    
 
-
-
    
-    To animate slides with a fading transition instead of sliding, set Crossfade to true.
-
    
-
+
    
+    
    
+        To animate slides with a fading transition instead of sliding, set Crossfade to true.
+    
    
+    
+
    
 
-
-
    
-    You can make your carousels autoplay on page load by setting the Autoplay parameter to CarouselAutoPlay.StartOnPageLoad.
-    Autoplaying carousels automatically pause while hovered with the mouse.
-
    
-
-
    
-    When the Autoplay parameter is set to CarouselAutoPlay.StartAfterUserInteraction, the carousel won’t automatically start to cycle on page load.
-    Instead, it will only start after the first user interaction.
-
    
-
+
    
+    
    
+        You can make your carousels autoplay on page load by setting the Autoplay parameter to CarouselAutoPlay.StartOnPageLoad.
+        Autoplaying carousels automatically pause while hovered with the mouse.
+    
    
+    
+    
    
+        When the Autoplay parameter is set to CarouselAutoPlay.StartAfterUserInteraction, the carousel won’t automatically start to cycle on page load.
+        Instead, it will only start after the first user interaction.
+    
    
+    
+
    
 
-
-
    
-    Add Interval parameter to a CarouselItem component to change the amount of time to delay between automatically cycling to the next item.
-
    
-
+
    
+    
    
+        Add Interval parameter to a CarouselItem component to change the amount of time to delay between automatically cycling to the next item.
+    
    
+    
+
    
 
-
-
    
-    Hide the controls by setting ShowPreviousNextControls parameter to false.
-
    
-
+
    
+    
    
+        Hide the controls by setting ShowPreviousNextControls parameter to false.
+    
    
+    
+
    
 
-
-
    
-    Carousels support swiping left/right on touchscreen devices to move between slides.
-    This can be disabled by setting the Touch option to false.
-
    
-
+
    
+    
    
+        Carousels support swiping left/right on touchscreen devices to move between slides.
+        This can be disabled by setting the Touch option to false.
+    
    
+    
+
    
 
-
-
    
-    Blazor Bootstrap Carousel component exposes a two events for hooking into Carousel functionality.
-    
-        
+
    
+    
    
+        Blazor Bootstrap Carousel component exposes a two events for hooking into Carousel functionality.
+        
    
+            
-        
-        
+            
+            
@@ -84,18 +94,21 @@
                 
-        
-    
    
             
    
                 Event Name
                 Description
             
    
             
    
                 Onslide
                 Fires immediately when the slide instance method is invoked.Onslid
                 Fired when the carousel has completed its slide transition.
             
    
-
    
-
+            
+        
+    
    
+    
+
 
 
     NOTE: All of the images were generated using Microsoft Designer.
 
 
 @code {
-    private string pageUrl = "/carousel";
-    private string title = "Blazor Carousel Component";
-    private string description = "Blazor Carousel component is a slideshow component that cycles through elements, images, or slides of text.";
-    private string imageUrl = "https://i.imgur.com/YoZd9Hy.png";
+    private const string pageUrl = RouteConstants.Demos_Carousel_Documentation;
+    private const string pageTitle = "Blazor Carousel";
+    private const string pageDescription = "Blazor Carousel component is a slideshow component that cycles through elements, images, or slides of text.";
+    private const string metaTitle = "Blazor Carousel Component";
+    private const string metaDescription = "Blazor Carousel component is a slideshow component that cycles through elements, images, or slides of text.";
+    private const string imageUrl = "https://i.imgur.com/YoZd9Hy.png";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/BarCharts/BarChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/BarCharts/BarChartDocumentation.razor
index fc7545311..45adfccd6 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/BarCharts/BarChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/BarCharts/BarChartDocumentation.razor
@@ -1,22 +1,22 @@
-@page "/charts/bar-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Bar Chart
    
-
    
-    A Blazor Bootstrap bar chart component is used to represent data values as vertical bars. It is sometimes used to show trend data and to compare multiple data sets side by side.
-
    
+
+    @pageDescription
+
 
 
 
-
+
    
 
    
     Refer to the getting started guide for setting up charts.
 
    
 
-
+
    
 
    
     In the following example, a categorical 12-color palette is used.
 
    
@@ -26,25 +26,27 @@
 
 
 
-
+
    
 
 
-
+
    
 
 
-
+
    
 
    
     By default, the chart is using the default locale of the platform on which it is running.
     In the following example, you will see the chart in the German locale (de_DE).
 
    
 
 
-
+
    
 
 
 @code {
-    private string pageUrl = "/charts/bar-chart";
-    private string title = "Blazor Bar Chart";
-    private string description = "A Blazor Bootstrap bar chart component is used to represent data values as vertical bars. It is sometimes used to show trend data and to compare multiple data sets side by side.";
-    private string imageUrl = "https://i.imgur.com/IX3bajc.png";
+    private const string pageUrl = RouteConstants.Demos_BarChart_Documentation;
+    private const string pageTitle = "Blazor Bar Chart";
+    private const string pageDescription = "A Blazor Bootstrap bar chart component is used to represent data values as vertical bars. It is sometimes used to show trend data and to compare multiple data sets side by side.";
+    private const string metaTitle = "Blazor Bar Chart Component";
+    private const string metaDescription = "A Blazor Bootstrap bar chart component is used to represent data values as vertical bars. It is sometimes used to show trend data and to compare multiple data sets side by side.";
+    private const string imageUrl = "https://i.imgur.com/IX3bajc.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ChartsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ChartsDocumentation.razor
index 72500efca..211eb96f0 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ChartsDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ChartsDocumentation.razor
@@ -1,43 +1,48 @@
-@page "/charts"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Charts
    
-
    
-    Blazor Bootstrap charts are well-designed chart components on top of Chart.js to visualize data. It contains a rich UI gallery of charts that cater to all charting scenarios. Its high performance helps render large amounts of data quickly.
-
    
+
+    @pageDescription
+
 
 
 
-
-
-
-
-
    At this moment we are supporting seven blazor chart types.
    
-
      
-    
    1. Bar Chart
      2. 
-    
    2. Doughnut Chart
      3. 
-    
    3. Line Chart
      4. 
-    
    4. Pie Chart
      5. 
-    
    5. Polar Area Chart
      6. 
-    
    6. Radar Chart
      7. 
-    
    7. Scatter Chart
      8. 
-
    
-
-
-    We will add Bubble Chart and Mixed Chart support in the subsequent versions.
-
-
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
+
    
+    
+
    
+
+
    
+    
    At this moment we are supporting seven blazor chart types.
    
+    
      
+        
    1. Bar Chart
      2. 
+        
    2. Doughnut Chart
      3. 
+        
    3. Line Chart
      4. 
+        
    4. Pie Chart
      5. 
+        
    5. Polar Area Chart
      6. 
+        
    6. Radar Chart
      7. 
+        
    7. Scatter Chart
      8. 
+    
    
+
+    
+        We will add Bubble Chart and Mixed Chart support in the subsequent versions.
+    
+
    
+
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
 
 @code {
-    private string pageUrl = "/charts";
-    private string title = "Blazor Charts";
-    private string description = "Blazor Bootstrap charts are well-designed chart components on top of Chart.js to visualize data. It contains a rich UI gallery of charts that cater to all charting scenarios. Its high performance helps render large amounts of data quickly.";
-    private string imageUrl = "https://i.imgur.com/IX3bajc.png";
+    private const string pageUrl = RouteConstants.Demos_Charts_Documentation;
+    private const string pageTitle = "Blazor Charts";
+    private const string pageDescription = "Blazor Bootstrap charts are well-designed chart components on top of Chart.js to visualize data. It contains a rich UI gallery of charts that cater to all charting scenarios. Its high performance helps render large amounts of data quickly.";
+    private const string metaTitle = "Blazor Chart Components";
+    private const string metaDescription = "Blazor Bootstrap charts are well-designed chart components on top of Chart.js to visualize data. It contains a rich UI gallery of charts that cater to all charting scenarios. Its high performance helps render large amounts of data quickly.";
+    private const string imageUrl = "https://i.imgur.com/IX3bajc.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/DoughnutCharts/DoughnutChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/DoughnutCharts/DoughnutChartDocumentation.razor
index 9ad629541..9b8b9897d 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/DoughnutCharts/DoughnutChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/DoughnutCharts/DoughnutChartDocumentation.razor
@@ -1,39 +1,42 @@
-@page "/charts/doughnut-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Doughnut Chart
    
-
    
-    A Blazor Bootstrap donut chart component is a circular chart that shows the proportional values of different categories. 
-    It is similar to a pie chart, but the center of the donut chart is hollow. 
-    This makes it easier to see the individual values of each category.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
-
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
-
-
-
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
+
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+
    
+
+
    
+    
+
    
 
 @code {
-    private string pageUrl = "/charts/doughnut-chart";
-    private string title = "Blazor Doughnut Charts";
-    private string description = "A Blazor donut chart component is a circular chart that shows the proportional values of different categories. It is similar to a pie chart, but the center of the donut chart is hollow. This makes it easier to see the individual values of each category.";
-    private string imageUrl = "https://i.imgur.com/xEPhAsW.png";
+    private const string pageUrl = RouteConstants.Demos_DoughnutChart_Documentation;
+    private const string pageTitle = "Blazor Doughnut Chart";
+    private const string pageDescription = "A Blazor donut chart component is a circular chart that shows the proportional values of different categories. It is similar to a pie chart, but the center of the donut chart is hollow. This makes it easier to see the individual values of each category.";
+    private const string metaTitle = "Blazor Doughnut Chart Component";
+    private const string metaDescription = "A Blazor donut chart component is a circular chart that shows the proportional values of different categories. It is similar to a pie chart, but the center of the donut chart is hollow. This makes it easier to see the individual values of each category.";
+    private const string imageUrl = "https://i.imgur.com/xEPhAsW.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/LineCharts/LineChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/LineCharts/LineChartDocumentation.razor
index 42c108642..441b7f087 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/LineCharts/LineChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/LineCharts/LineChartDocumentation.razor
@@ -1,56 +1,64 @@
-@page "/charts/line-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Line Chart
    
-
    
-    A Blazor Bootstrap line chart component is a graphical representation of data that uses a series of connected points to show how the data changes over time.
-    It is a type of x-y chart, where the x-axis represents the independent variable, such as time, and the y-axis represents the dependent variable, such as the value.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
-
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
-
    
-
-
-
-
    
-    By default, the chart is using the default locale of the platform on which it is running.
-    In the following example, you will see the chart in the German locale (de_DE).
-
    
-
-
-
-
-
-
-
-
-
-
-
-
-
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
+
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+    
    
+    
+
    
+
+
    
+    
    
+        By default, the chart is using the default locale of the platform on which it is running.
+        In the following example, you will see the chart in the German locale (de_DE).
+    
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
    
 
 @code {
-    private readonly string pageUrl = "/charts/line-chart";
-    private readonly string title = "Blazor Line Chart";
-    private readonly string description = "A Blazor Bootstrap line chart component is a graphical representation of data that uses a series of connected points to show how the data changes over time. It is a type of x-y chart, where the x-axis represents the independent variable, such as time, and the y-axis represents the dependent variable, such as the value.";
-    private readonly string imageUrl = "https://i.imgur.com/8b7jH0D.png";
+    private const string pageUrl = RouteConstants.Demos_LineChart_Documentation;
+    private const string pageTitle = "Blazor Line Chart";
+    private const string pageDescription = "A Blazor Bootstrap line chart component is a graphical representation of data that uses a series of connected points to show how the data changes over time. It is a type of x-y chart, where the x-axis represents the independent variable, such as time, and the y-axis represents the dependent variable, such as the value.";
+    private const string metaTitle = "Blazor Line Chart Component";
+    private const string metaDescription = "A Blazor Bootstrap line chart component is a graphical representation of data that uses a series of connected points to show how the data changes over time. It is a type of x-y chart, where the x-axis represents the independent variable, such as time, and the y-axis represents the dependent variable, such as the value.";
+    private const string imageUrl = "https://i.imgur.com/8b7jH0D.png";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PieCharts/PieChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PieCharts/PieChartDocumentation.razor
index 48d98f22b..3434be298 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PieCharts/PieChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PieCharts/PieChartDocumentation.razor
@@ -1,43 +1,49 @@
-@page "/charts/pie-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Pie Chart
    
-
    
-    A Blazor Bootstrap pie chart component is a circular chart that shows the proportional values of different categories.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
-
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
-
-
-
-
-
-
    
-    This sample demonstrates how to change the position of the chart legend.
-
    
-
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
+
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
    
+        This sample demonstrates how to change the position of the chart legend.
+    
    
+    
+
    
 
 @code {
-    private string pageUrl = "/charts/pie-chart";
-    private string title = "Blazor Pie Chart";
-    private string description = "A Blazor Bootstrap pie chart component is a circular chart that shows the proportional values of different categories.";
-    private string imageUrl = "https://i.imgur.com/ieBupT2.png";
+    private const string pageUrl = RouteConstants.Demos_PieChart_Documentation;
+    private const string pageTitle = "Blazor Pie Chart";
+    private const string pageDescription = "A Blazor Bootstrap pie chart component is a circular chart that shows the proportional values of different categories.";
+    private const string metaTitle = "Blazor Pie Chart";
+    private const string metaDescription = "A Blazor Bootstrap pie chart component is a circular chart that shows the proportional values of different categories.";
+    private const string imageUrl = "https://i.imgur.com/ieBupT2.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor
index dd35946f6..99f094b0c 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor
@@ -1,34 +1,38 @@
-@page "/charts/polar-area-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Polar Area Chart
    
-
    
-    A Blazor Bootstrap polar area charts are similar to pie charts, but each segment has the same angle - the radius of the segment differs depending on the value.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
 
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+
    
 
 @code {
-    private string pageUrl = "/charts/polar-area-chart";
-    private string title = "Blazor Polar Area Chart";
-    private string description = "A Blazor Bootstrap polar area charts are similar to pie charts, but each segment has the same angle - the radius of the segment differs depending on the value.";
-    private string imageUrl = "https://i.imgur.com/xLAqwGi.png";
+    private const string pageUrl = RouteConstants.Demos_PolarAreaChart_Documentation;
+    private const string pageTitle = "Blazor Polar Area Chart";
+    private const string pageDescription = "A Blazor Bootstrap polar area charts are similar to pie charts, but each segment has the same angle - the radius of the segment differs depending on the value.";
+    private const string metaTitle = "Blazor Polar Area Chart Component";
+    private const string metaDescription = "A Blazor Bootstrap polar area charts are similar to pie charts, but each segment has the same angle - the radius of the segment differs depending on the value.";
+    private const string imageUrl = "https://i.imgur.com/xLAqwGi.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor
index 9b0913fb6..fd7c9fc7f 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor
@@ -1,35 +1,38 @@
-@page "/charts/radar-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Radar Chart
    
-
    
-    A Blazor Bootstrap radar chart component is a way of showing multiple data points and the variation between them.
-    They are often useful for comparing the points of two or more different data sets.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
 
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+
    
 
 @code {
-    private readonly string pageUrl = "/charts/radar-chart";
-    private readonly string title = "Blazor Radar Chart";
-    private readonly string description = "A Blazor Bootstrap radar chart component is a way of showing multiple data points and the variation between them. They are often useful for comparing the points of two or more different data sets.";
-    private readonly string imageUrl = "https://i.imgur.com/Urrb79M.png";
+    private const string pageUrl = RouteConstants.Demos_RadarChart_Documentation;
+    private const string pageTitle = "Blazor Radar Chart";
+    private const string pageDescription = "A Blazor Bootstrap radar chart component is a way of showing multiple data points and the variation between them. They are often useful for comparing the points of two or more different data sets.";
+    private const string metaTitle = "Blazor Radar Chart Component";
+    private const string metaDescription = "A Blazor Bootstrap radar chart component is a way of showing multiple data points and the variation between them. They are often useful for comparing the points of two or more different data sets.";
+    private const string imageUrl = "https://i.imgur.com/Urrb79M.png";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor
index 84558339f..5dd3dbe73 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor
@@ -1,43 +1,47 @@
-@page "/charts/scatter-chart"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Scatter Chart
    
-
    
-    A Blazor Bootstrap scatter chart components are based on basic line charts with the x-axis changed to a linear axis. 
-    To use a scatter chart, data must be passed as objects containing X and Y properties.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    Refer to the getting started guide for setting up charts.
-
    
-
-
-
    
-    In the following example, a categorical 12-color palette is used.
-
    
-
-    For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
-    These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
-
-
-
-
-
    
-    In the following example, you can randomize the data and datasets dynamically. 
-    Along with this, the ScatterChartOptions are updated. With these changes, the scatter chart is responsive, and when hovered over, the points' radius increases for better visibility to the end-user.
-    Additionally, the data is grouped and displayed in a tooltip by index.
-
    
-
+
    
+    
    
+        Refer to the getting started guide for setting up charts.
+    
    
+
    
+
+
    
+    
    
+        In the following example, a categorical 12-color palette is used.
+    
    
+    
+        For data visualization, you can use the predefined palettes ColorUtility.CategoricalTwelveColors for a 12-color palette and ColorUtility.CategoricalSixColors for a 6-color palette.
+        These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations.
+    
+    
+
    
+
+
    
+    
    
+        In the following example, you can randomize the data and datasets dynamically. 
+        Along with this, the ScatterChartOptions are updated. With these changes, the scatter chart is responsive, and when hovered over, the points' radius increases for better visibility to the end-user.
+        Additionally, the data is grouped and displayed in a tooltip by index.
+    
    
+    
+
    
 
 @code {
-    private readonly string pageUrl = "/charts/scatter-chart";
-    private readonly string title = "Blazor Scatter Chart";
-    private readonly string description = "A Blazor Bootstrap scatter chart components are based on basic line charts with the x-axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties.";
-    private readonly string imageUrl = "https://i.imgur.com/GEox0tS.png";
+    private const string pageUrl = RouteConstants.Demos_ScatterChart_Documentation;
+    private const string pageTitle = "Blazor Scatter Chart";
+    private const string pageDescription = "A Blazor Bootstrap scatter chart components are based on basic line charts with the x-axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties.";
+    private const string metaTitle = "Blazor Scatter Chart Component";
+    private const string metaDescription = "A Blazor Bootstrap scatter chart components are based on basic line charts with the x-axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties.";
+    private const string imageUrl = "https://i.imgur.com/GEox0tS.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Collapse/CollapseDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Collapse/CollapseDocumentation.razor
index 461210bb5..f1aaa1d56 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Collapse/CollapseDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Collapse/CollapseDocumentation.razor
@@ -1,50 +1,53 @@
-@page "/collapse"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Collapse
    
-
    
-    Toggle the visibility of content across your project with the Blazor Bootstrap Collapse component.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-    The Collapse component is used to show and hide content. Use ShowAsync, HideAsync, and ToggleAsync methods to toggle the content.
-    Collapsing an element will animate the height from its current value to 0.
-
    
+
    
+    
    
+        The Collapse component is used to show and hide content. Use ShowAsync, HideAsync, and ToggleAsync methods to toggle the content.
+        Collapsing an element will animate the height from its current value to 0.
+    
    
 
-
-    The animation effect of this component is dependent on the prefers-reduced-motion media query. 
    
-    See the reduced motion section of our accessibility documentation.
-    
+    
+        The animation effect of this component is dependent on the prefers-reduced-motion media query. 
    
+        See the reduced motion section of our accessibility documentation.
+        
+
    
 
-
-
    
-    Click the buttons below to show and hide the content.
-
    
-
+
    
+    
    
+        Click the buttons below to show and hide the content.
+    
    
+    
+
    
 
-
-
    
-    The Collapse component supports horizontal collapsing. Set the Horizontal parameter to true to enable horizontal collapsing.
-
    
-
+
    
+    
    
+        The Collapse component supports horizontal collapsing. Set the Horizontal parameter to true to enable horizontal collapsing.
+    
    
+    
+
    
 
-
-
    
-    Blazor Bootstrap Collapse component exposes a few events for hooking into collapse functionality.
-    
-        
+
    
+    
    
+        Blazor Bootstrap Collapse component exposes a few events for hooking into collapse functionality.
+        
    
+            
-        
-        
+            
+            
@@ -61,14 +64,17 @@
                 
-        
-    
    
             
    
                 Event Name
                 Description
             
    
             
    
                 OnHiding
                 This event is fired immediately when the hide method has been called.OnShown
                 This event is fired when a collapse component has been made visible to the user (will wait for CSS transitions to complete).
             
    
-
    
-
+            
+        
+    
    
+    
+
 
 @code {
-    private string pageUrl = "/collapse";
-    private string title = "Blazor Collapse Component";
-    private string description = "Toggle the visibility of content across your project with the Blazor Bootstrap Collapse component.";
-    private string imageUrl = "https://i.imgur.com/8A0emQe.png";
+    private const string pageUrl = RouteConstants.Demos_Collapse_Documentation;
+    private const string pageTitle = "Blazor Collapse";
+    private const string pageDescription = "Toggle the visibility of content across your project with the Blazor Bootstrap Collapse component.";
+    private const string metaTitle = "Blazor Collapse Component";
+    private const string metaDescription = "Toggle the visibility of content across your project with the Blazor Bootstrap Collapse component.";
+    private const string imageUrl = "https://i.imgur.com/8A0emQe.png";
 }
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ConfirmDialog/ConfirmDialogDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ConfirmDialog/ConfirmDialogDocumentation.razor
index d3671d7cc..6b967413c 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/ConfirmDialog/ConfirmDialogDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ConfirmDialog/ConfirmDialogDocumentation.razor
@@ -1,74 +1,83 @@
-@page "/confirm-dialog"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Confirm Dialog
    
-
    
-    Use Blazor Bootstrap confirm dialog component if you want the user to verify or accept something.
-
    
+
+    @pageDescription
+
 
 
 
-
-
    
-
+
    
+    
    
+    
+
    
 
-
-
    
-    Render different components dynamically within the confirm dialog without iterating through possible types or using conditional logic.
-
    
-
    
-    If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value.
-
    
-
    
-    In the below example, we used Toast Service to show the user confirmation.
-
    
-
-EmployeeDemoComponent.razor
-
+
    
+    
    
+        Render different components dynamically within the confirm dialog without iterating through possible types or using conditional logic.
+    
    
+    
    
+        If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value.
+    
    
+    
    
+        In the below example, we used Toast Service to show the user confirmation.
+    
    
+    
+    EmployeeDemoComponent.razor
+    
+
    
 
-
-
    
-    Use ConfirmDialogOptions to change the text and color of the button.
-
    
-
+
    
+    
    
+        Use ConfirmDialogOptions to change the text and color of the button.
+    
    
+    
+
    
 
-
-
    
-    Confirm dialog have three optional sizes. These sizes kick in at certain breakpoints to avoid horizontal scrollbars on narrower viewports.
-
    
-
+
    
+    
    
+        Confirm dialog have three optional sizes. These sizes kick in at certain breakpoints to avoid horizontal scrollbars on narrower viewports.
+    
    
+    
+
    
 
-
-
    
-    When dialogs become too long for the user's viewport or device, they scroll independent of the page itself. Try the demo below to see what we mean.
-
    
-
-
    You can also create a scrollable dialog that allows scroll the dialog body by updating DialogOptions.IsScrollable="true".
    
-
+
    
+    
    
+        When dialogs become too long for the user's viewport or device, they scroll independent of the page itself. Try the demo below to see what we mean.
+    
    
+    
+    
    You can also create a scrollable dialog that allows scroll the dialog body by updating DialogOptions.IsScrollable="true".
    
+    
+
    
 
-
-
    
-    Add DialogOptions.IsVerticallyCentered="true" to vertically center the confirm dialog.
-
    
-
-
    
-
+
    
+    
    
+        Add DialogOptions.IsVerticallyCentered="true" to vertically center the confirm dialog.
+    
    
+    
+    
    
+    
+
    
 
-
-
-    By default, auto focus on the "Yes" button is enabled.
-
-
    
-    To disabe the autofocus, set AutoFocusYesButton = false on the ConfirmDialogOptions.
-
    
-
+
    
+    
+        By default, auto focus on the "Yes" button is enabled.
+    
+    
    
+        To disabe the autofocus, set AutoFocusYesButton = false on the ConfirmDialogOptions.
+    
    
+    
+
    
 
 @code {
-    private string pageUrl = "/confirm-dialog";
-    private string title = "Blazor Confirm Dialog Component";
-    private string description = "Use Blazor Bootstrap confirm dialog component if you want the user to verify or accept something.";
-    private string imageUrl = "https://i.imgur.com/chdLk3D.jpg";
+    private const string pageUrl = RouteConstants.Demos_ConfirmDialog_Documentation;
+    private const string pageTitle = "Blazor Confirm Dialog";
+    private const string pageDescription = "Use Blazor Bootstrap confirm dialog component if you want the user to verify or accept something.";
+    private const string metaTitle = "Blazor Confirm Dialog Component";
+    private const string metaDescription = "Use Blazor Bootstrap confirm dialog component if you want the user to verify or accept something.";
+    private const string imageUrl = "https://i.imgur.com/chdLk3D.jpg";
 }
\ No newline at end of file
diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Dropdowns/DropdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Dropdowns/DropdownDocumentation.razor
index 293fd34dc..af7d67f04 100644
--- a/BlazorBootstrap.Demo.RCL/Components/Pages/Dropdowns/DropdownDocumentation.razor
+++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Dropdowns/DropdownDocumentation.razor
@@ -1,124 +1,134 @@
-@page "/dropdown"
+@attribute [Route(pageUrl)]
 
-@title
+
 
-
-
-
    Blazor Dropdown
    
-
    
-    Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They are toggled by clicking, not by hovering; this is an intentional design decision'by bootstrap.
-
    
+
+    @pageDescription
+
 
 
 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
    
-    To trigger DropdownMenu above elements, add the Direction="DropdownDirection.Dropup" to the Dropdown component.
-
    
-
-
-
-
    
-    To center the DropdownMenu above the toggle, add the Direction="DropdownDirection.DropupCentered" to the Dropdown component.
-
    
-
-
-
-
    
-    To trigger DropdownMenu at the right of elements, add the Direction="DropdownDirection.Dropend" to the Dropdown component.
-
    
-
-
-
-
    
-    To trigger DropdownMenu at the left of elements, you can add the Direction="DropdownDirection.Dropstart" to the Dropdown component.
-
    
-
-
-
-
    
-    To style DropdownItem as active, add the Active="true" parameter to the DropdownItem element in the DropdownMenu.
-
    
-
-
-
-
    
-    To disable the dropdown, set the Disabled parameter to true on the Dropdown component.
-
    
-
-
    
-    To style a dropdown item as disabled, set the Disabled parameter to true on the DropdownItem element in the DropdownMenu component.
-
    
-
-
-
-
    
-    
    
-        By default, a DropdownMenu is automatically positioned at 100% from the top and along the left side of its parent.
-        You can change this with the Position parameter.
-    
    
-    
    
-        To right-align a DropdownMenu, add the Position="DropdownMenuPosition.End" parameter to the DropdownMenu component.
-        Directions are mirrored when using Bootstrap in RTL.
-    
    
-
    
-
-
-
-
-
-
    Add a header to label sections of actions in any dropdown menu.
    
-
-
-
-
    Separate groups of related menu items with a divider.
    
-
-
-
-
    
-    Place any freeform text within a dropdown menu with text and use spacing utilities. 
-    Note that youll likely need additional sizing styles to constrain the menu width.
-
    
-
-
-
-
    
-    Put a form within a dropdown menu, or make it into a dropdown menu, and use margin or padding utilities to give it the negative space you require.
-
    
-
-
-
-
    
-    By default, the DropdownMenu is closed when clicking either inside or outside the DropdownMenu.
-    You can use the AutoClose and AutoCloseBehavior parameters to change this behavior of the Dropdown.
-
    
-
-
-
-
    
-    
-        
+
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+
    
+
+
    
+    
+    
+
    
+
+
    
+
    
+    
    
+        To trigger DropdownMenu above elements, add the Direction="DropdownDirection.Dropup" to the Dropdown component.
+    
    
+    
+
    
+
    
+    
    
+        To center the DropdownMenu above the toggle, add the Direction="DropdownDirection.DropupCentered" to the Dropdown component.
+    
    
+    
+
    
+
    
+    
    
+        To trigger DropdownMenu at the right of elements, add the Direction="DropdownDirection.Dropend" to the Dropdown component.
+    
    
+    
+
    
+
    
+    
    
+        To trigger DropdownMenu at the left of elements, you can add the Direction="DropdownDirection.Dropstart" to the Dropdown component.
+    
    
+    
+
    
+
    
+    
    
+        To style DropdownItem as active, add the Active="true" parameter to the DropdownItem element in the DropdownMenu.
+    
    
+    
+
    
+
    
+    
    
+        To disable the dropdown, set the Disabled parameter to true on the Dropdown component.
+    
    
+    
+    
    
+        To style a dropdown item as disabled, set the Disabled parameter to true on the DropdownItem element in the DropdownMenu component.
+    
    
+    
+
    
+
+
    
+    
    
+        
    
+            By default, a DropdownMenu is automatically positioned at 100% from the top and along the left side of its parent.
+            You can change this with the Position parameter.
+        
    
+        
    
+            To right-align a DropdownMenu, add the Position="DropdownMenuPosition.End" parameter to the DropdownMenu component.
+            Directions are mirrored when using Bootstrap in RTL.
+        
    
+    
    
+    
+
    
+
+
    
+
+
    
+    
    Add a header to label sections of actions in any dropdown menu.
    
+    
+
    
+
+
    
+    
    Separate groups of related menu items with a divider.
    
+    
+
    
+
+
    
+    
    
+        Place any freeform text within a dropdown menu with text and use spacing utilities. 
+        Note that youll likely need additional sizing styles to constrain the menu width.
+    
    
+    
+
    
+
+
    
+    
    
+        Put a form within a dropdown menu, or make it into a dropdown menu, and use margin or padding utilities to give it the negative space you require.
+    
    
+    
+
    
+
+
    
+    
    
+        By default, the DropdownMenu is closed when clicking either inside or outside the DropdownMenu.
+        You can use the AutoClose and AutoCloseBehavior parameters to change this behavior of the Dropdown.
+    
    
+    
+
    
+
+
    
+    
    
+        
    
+            
-        
-        
+            
+            
@@ -135,23 +145,24 @@
                 
-        
-    
    
             
    
                 Method
                 Description
             
    
             
    
                 HideAsync
                  Hides the dropdown menu of a given navbar or tabbed navigation.UpdateAsync
                 Updates the position of an element’s dropdown.
             
    
-
    
-
-
-
-
    
-    All dropdown events are fired at the toggling element and then bubbled up.
-
-    
-        
+            
+        
    
+    
    
+    
+
+
+
    
+    
    
+        All dropdown events are fired at the toggling element and then bubbled up.
+
+        
+            
-        
-        
+            
+            
@@ -168,14 +179,17 @@
                 
-        
-    
    
             
    
                 Event type
                 Description
             
    
             
    
                 OnHiding
                 This event is fired immediately when the hide method has been called.OnShown
                 This event is fired when an dropdown element has been made visible to the user (will wait for CSS transitions to complete).
             
    
-
    
-
+            
+        
+
    + + @code { - private string pageUrl = "/dropdown"; - private string title = "Blazor Dropdown Component"; - private string description = "Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They are toggled by clicking, not by hovering; this is an intentional design decision'by bootstrap."; - private string imageUrl = "https://i.imgur.com/beAr31J.png"; + private const string pageUrl = RouteConstants.Demos_Dropdown_Documentation; + private const string pageTitle = "Blazor Dropdown"; + private const string pageDescription = "Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They are toggled by clicking, not by hovering; this is an intentional design decision'by bootstrap."; + private const string metaTitle = "Blazor Dropdown Component"; + private const string metaDescription = "Dropdowns are toggleable, contextual overlays for displaying lists of links and more. They are toggled by clicking, not by hovering; this is an intentional design decision'by bootstrap."; + private const string imageUrl = "https://i.imgur.com/beAr31J.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/AutoComplete/AutoCompleteDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/AutoComplete/AutoCompleteDocumentation.razor index 40eb7b515..4c0f008b9 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/AutoComplete/AutoCompleteDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/AutoComplete/AutoCompleteDocumentation.razor @@ -1,50 +1,56 @@ @page "/autocomplete" -@page "/form/autocomplete" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Auto Complete

    -
    - Blazor Bootstrap autocomplete component is a textbox that offers the users suggestions as they type from the data source. And it supports client-side and server-side filtering. -
    + + @pageDescription + - - +
    + +
    - -
    In the below example, StringComparision.Ordinal is used to make the filter case-sensitive.
    - - -
    By default, StringComparison.OrdinalIgnoreCase is used to compare culture-agnostic and case-insensitive string matching.
    -     +
    +
    In the below example, StringComparision.Ordinal is used to make the filter case-sensitive.
    + + +
    By default, StringComparison.OrdinalIgnoreCase is used to compare culture-agnostic and case-insensitive string matching.
    +     +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - -
    - Blazor Bootstrap autocomplete component supports the following keyboard shortcuts to initiate various actions. -
    -
    -
    - - +
    +
    + Blazor Bootstrap autocomplete component supports the following keyboard shortcuts to initiate various actions. +
    +
    +
    +
    + - - + + @@ -69,26 +75,31 @@ - -
    Key Description
    Esc Closes the popup list when it is in an open state.Enter Selects the currently focused item.
    + + +
    -
    + - -
    Use the Disabled parameter to disable the AutoComplete.
    - -
    Also, use Enable() and Disable() methods to enable and disable the AutoComplete.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - +
    +
    Use the Disabled parameter to disable the AutoComplete.
    + +
    Also, use Enable() and Disable() methods to enable and disable the AutoComplete.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    - - +
    + +
    @code { - private string pageUrl = "/autocomplete"; - private string title = "Blazor AutoComplete Component"; - private string description = "Blazor Bootstrap autocomplete component is a textbox that offers the users suggestions as they type from the data source. And it supports client-side and server-side filtering."; - private string imageUrl = "https://i.imgur.com/36RsWZ3.png"; + private const string pageUrl = RouteConstants.Demos_AutoComplete_Documentation; + private const string pageTitle = "Blazor AutoComplete"; + private const string pageDescription = "Blazor Bootstrap autocomplete component is a textbox that offers the users suggestions as they type from the data source. And it supports client-side and server-side filtering."; + private const string metaTitle = "Blazor AutoComplete Component"; + private const string metaDescription = "Blazor Bootstrap autocomplete component is a textbox that offers the users suggestions as they type from the data source. And it supports client-side and server-side filtering."; + private const string imageUrl = "https://i.imgur.com/36RsWZ3.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/CurrencyInput/CurrencyInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/CurrencyInput/CurrencyInputDocumentation.razor index ec53dcc37..f4a2088a2 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/CurrencyInput/CurrencyInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/CurrencyInput/CurrencyInputDocumentation.razor @@ -1,89 +1,105 @@ @page "/currency-input" -@page "/form/currency-input" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Currency Input

    -
    - Use the Blazor Bootstrap CurrencyInput component to show the numbers in the user's locale format, including the currency symbol. -
    + + @pageDescription + - -
    By default, e + - are blocked. For all integral numeric types, dot . is blocked.
    - - The default locale is en-US. - - - - - - - -
    Set HideCurrencySymbol parameter value to true to hide the currency symbol.
    - - - -
    In the below example, formatting adds zeros to display minimum integers and fractions.
    - - MinimumFractionDigits and MaximumFractionDigits parameters are applicable for floating-point numeric types only. - - - - -
    In many locales, accounting format means to wrap the number with parentheses instead of appending a minus sign. You can enable this formatting by setting the CurrencySign option to Accounting. The default value is Standard.
    - - - -
    CurrencyInput is a generic component. Always specify the exact type. In the below example TValue is set to int, int?, float, float?, double, double?, decimal, and decimal?.
    - - - -
    Set EnableMinMax="true" and set the Min and Max parameters to restrict the user input between the Min and Max range.
    - - If the user tries to enter a number in the CurrencyInput field which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the Min value, then it will override with the Min value. - If the user input exceeds the Max value, it will override with the Max value. - - - - -
    You can change the text alignment according to your need. Use the TextAlignment parameter to set the alignment. In the below example, alignment is set to center and end.
    - - - -
    By default, negative numbers are not allowed. Set the AllowNegativeNumbers parameter to true to allow the negative numbers.
    - - - -
    Use the Disabled parameter to disable the CurrencyInput.
    - -
    Also, use Enable() and Disable() methods to enable and disable the CurrencyInput.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - - - -
    - Like any other blazor input components, CurrencyInput supports validations. - Add the DataAnnotations on the CurrencyInput component to validate the user input before submitting the form. - In the below example, we used Required and Range attributes. -
    - - - - - - -
    This event fires on every user keystroke that changes the CurrencyInput value.
    - +
    +
    By default, e + - are blocked. For all integral numeric types, dot . is blocked.
    + + The default locale is en-US. + + +
    + +
    + +
    + +
    +
    Set HideCurrencySymbol parameter value to true to hide the currency symbol.
    + +
    + +
    +
    In the below example, formatting adds zeros to display minimum integers and fractions.
    + + MinimumFractionDigits and MaximumFractionDigits parameters are applicable for floating-point numeric types only. + + +
    + +
    +
    In many locales, accounting format means to wrap the number with parentheses instead of appending a minus sign. You can enable this formatting by setting the CurrencySign option to Accounting. The default value is Standard.
    + +
    + +
    +
    CurrencyInput is a generic component. Always specify the exact type. In the below example TValue is set to int, int?, float, float?, double, double?, decimal, and decimal?.
    + +
    + +
    +
    Set EnableMinMax="true" and set the Min and Max parameters to restrict the user input between the Min and Max range.
    + + If the user tries to enter a number in the CurrencyInput field which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the Min value, then it will override with the Min value. + If the user input exceeds the Max value, it will override with the Max value. + + +
    + +
    +
    You can change the text alignment according to your need. Use the TextAlignment parameter to set the alignment. In the below example, alignment is set to center and end.
    + +
    + +
    +
    By default, negative numbers are not allowed. Set the AllowNegativeNumbers parameter to true to allow the negative numbers.
    + +
    + +
    +
    Use the Disabled parameter to disable the CurrencyInput.
    + +
    Also, use Enable() and Disable() methods to enable and disable the CurrencyInput.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    + +
    +
    + Like any other blazor input components, CurrencyInput supports validations. + Add the DataAnnotations on the CurrencyInput component to validate the user input before submitting the form. + In the below example, we used Required and Range attributes. +
    + +
    + +
    + +
    + +
    +
    This event fires on every user keystroke that changes the CurrencyInput value.
    + +
    @code { - private string pageUrl = "/form/currency-input"; - private string title = "Blazor CurrencyInput Component"; - private string description = "Use the Blazor Bootstrap CurrencyInput component to show the numbers in the user's locale format, including the currency symbol."; - private string imageUrl = "https://i.imgur.com/iUNBkki.png"; + private const string pageUrl = RouteConstants.Demos_CurrencyInput_Documentation; + private const string pageTitle = "Blazor CurrencyInput"; + private const string pageDescription = "Use the Blazor Bootstrap CurrencyInput component to show the numbers in the user's locale format, including the currency symbol."; + private const string metaTitle = "Blazor CurrencyInput Component"; + private const string metaDescription = "Use the Blazor Bootstrap CurrencyInput component to show the numbers in the user's locale format, including the currency symbol."; + private const string imageUrl = "https://i.imgur.com/iUNBkki.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/DateInput/DateInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/DateInput/DateInputDocumentation.razor index 02d1219f0..0e77f37d2 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/DateInput/DateInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/DateInput/DateInputDocumentation.razor @@ -1,79 +1,88 @@ @page "/date-input" -@page "/form/date-input" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Date Input

    -
    - The Blazor Bootstrap DateInput component is constructed using an HTML input of type="date" which limits user input based on pre-defined parameters. - This component enables users to input a date using a text box with validation or a special date picker interface. -
    + + @pageDescription + - - - The input UI generally varies from browser to browser. - In unsupported browsers, the control degrades gracefully to type="text". - +
    + + The input UI generally varies from browser to browser. + In unsupported browsers, the control degrades gracefully to type="text". + - + +
    - -
    -

    - The Blazor Bootstrap DateInput component supports several data types: DateOnly, DateOnly?, DateTime, and DateTime?. - This allows flexible component usage to accommodate various data types in Blazor applications. -

    -

    - In the below example, TValue is set to DateOnly, DateOnly?, DateTime, and DateTime?. -

    -
    - +
    +
    +

    + The Blazor Bootstrap DateInput component supports several data types: DateOnly, DateOnly?, DateTime, and DateTime?. + This allows flexible component usage to accommodate various data types in Blazor applications. +

    +

    + In the below example, TValue is set to DateOnly, DateOnly?, DateTime, and DateTime?. +

    +
    + +
    - -
    - Set EnableMinMax="true" and set the Max and Min parameters to restrict the user input between the Min and Max range. -
    - - If the user tries to enter a number in the DateInput field which is out of range, then it will override with Max or Min value based on the context. - If the user input exceeds the Max value, it will override with the Max value. If the user input is less than the Min value, then it will override with the Min value. - - +
    +
    + Set EnableMinMax="true" and set the Max and Min parameters to restrict the user input between the Min and Max range. +
    + + If the user tries to enter a number in the DateInput field which is out of range, then it will override with Max or Min value based on the context. + If the user input exceeds the Max value, it will override with the Max value. If the user input is less than the Min value, then it will override with the Min value. + + +
    - -
    Use the Disabled parameter to disable the DateInput.
    - -
    Also, use Enable() and Disable() methods to enable and disable the DateInput.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - +
    +
    Use the Disabled parameter to disable the DateInput.
    + +
    Also, use Enable() and Disable() methods to enable and disable the DateInput.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    - -
    - Like any other blazor input component, DateInput component supports validations. Use the DataAnnotations to validate the user input before submitting the form. In the below example, we used the Required attributes. -
    - +
    +
    + Like any other blazor input component, DateInput component supports validations. Use the DataAnnotations to validate the user input before submitting the form. In the below example, we used the Required attributes. +
    + +
    - -
    - This event fires on every user keystroke/selection that changes the DateInput value. -
    - +
    +
    + This event fires on every user keystroke/selection that changes the DateInput value. +
    + +
    - -
    - One common scenario is that the date fields are restricted based on the entry in another date field. - In the example below, we restrict the course end time based on the selection of course start date. -
    - +
    +
    + One common scenario is that the date fields are restricted based on the entry in another date field. + In the example below, we restrict the course end time based on the selection of course start date. +
    + +
    @code { - private string pageUrl = "/form/date-input"; - private string title = "Blazor DateInput Component"; - private string description = "The Blazor Bootstrap DateInput component is constructed using an HTML input of type 'date' which limits user input based on pre-defined parameters. This component enables users to input a date using a text box with validation or a special date picker interface."; - private string imageUrl = "https://i.imgur.com/1mVjqQv.png"; + private const string pageUrl = RouteConstants.Demos_DateInput_Documentation; + private const string pageTitle = "Blazor DateInput"; + private const string pageDescription = "The Blazor Bootstrap DateInput component is constructed using an HTML input of type 'date' which limits user input based on pre-defined parameters. This component enables users to input a date using a text box with validation or a special date picker interface."; + private const string metaTitle = "Blazor DateInput Component"; + private const string metaDescription = "The Blazor Bootstrap DateInput component is constructed using an HTML input of type 'date' which limits user input based on pre-defined parameters. This component enables users to input a date using a text box with validation or a special date picker interface."; + private const string imageUrl = "https://i.imgur.com/1mVjqQv.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/NumberInput/NumberInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/NumberInput/NumberInputDocumentation.razor index 7ed206b6c..819c761fc 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/NumberInput/NumberInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/NumberInput/NumberInputDocumentation.razor @@ -1,71 +1,83 @@ @page "/number-input" -@page "/form/number-input" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Number Input

    -
    - Blazor Bootstrap NumberInput component is built around HTML input of type="number" that prevents the user input based on the parameters set. -
    + + @pageDescription + - -
    By default, e + - are blocked. For all integral numeric types, dot . is blocked.
    - +
    +
    By default, e + - are blocked. For all integral numeric types, dot . is blocked.
    + +
    - -
    NumberInput is a generic component. Always specify the exact type. In the below example TValue is set to int, int?, float, float?, double, double?, decimal, and decimal?.
    - +
    +
    NumberInput is a generic component. Always specify the exact type. In the below example TValue is set to int, int?, float, float?, double, double?, decimal, and decimal?.
    + +
    - -
    - Set EnableMinMax="true" and set the Min and Max parameters to restrict the user input between the Min and Max range. -
    - - If the user tries to enter a number in the NumberInput field which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the Min value, then it will override with the Min value. - If the user input exceeds the Max value, it will override with the Max value. - - +
    +
    + Set EnableMinMax="true" and set the Min and Max parameters to restrict the user input between the Min and Max range. +
    + + If the user tries to enter a number in the NumberInput field which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the Min value, then it will override with the Min value. + If the user input exceeds the Max value, it will override with the Max value. + + +
    - -
    The Step sets the stepping interval when clicking the up and down spinner buttons. If not explicitly included, Step defaults to 1.
    - +
    +
    The Step sets the stepping interval when clicking the up and down spinner buttons. If not explicitly included, Step defaults to 1.
    + +
    - -
    You can change the text alignment according to your need. Use the TextAlignment parameter to set the alignment. In the below example, alignment is set to center and end.
    - +
    +
    You can change the text alignment according to your need. Use the TextAlignment parameter to set the alignment. In the below example, alignment is set to center and end.
    + +
    - -
    By default, negative numbers are not allowed. Set the AllowNegativeNumbers parameter to true to allow the negative numbers.
    - +
    +
    By default, negative numbers are not allowed. Set the AllowNegativeNumbers parameter to true to allow the negative numbers.
    + +
    - -
    Use the Disabled parameter to disable the NumberInput.
    - -
    Also, use Enable() and Disable() methods to enable and disable the NumberInput.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - +
    +
    Use the Disabled parameter to disable the NumberInput.
    + +
    Also, use Enable() and Disable() methods to enable and disable the NumberInput.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    - -
    - Like any other blazor input component, NumberInput supports validations. - Add the DataAnnotations on the NumberInput component to validate the user input before submitting the form. - In the below example, we used Required and Range attributes. -
    - +
    +
    + Like any other blazor input component, NumberInput supports validations. + Add the DataAnnotations on the NumberInput component to validate the user input before submitting the form. + In the below example, we used Required and Range attributes. +
    + +
    - -
    This event fires on every user keystroke that changes the NumberInput value.
    - +
    +
    This event fires on every user keystroke that changes the NumberInput value.
    + +
    @code { - private string pageUrl = "/form/number-input"; - private string title = "Blazor NumberInput Component"; - private string description = "Blazor Bootstrap NumberInput component is built around HTML input of type=\"number\" that prevents the user input based on the parameters set."; - private string imageUrl = "https://i.imgur.com/iUNBkki.png"; + private const string pageUrl = RouteConstants.Demos_NumberInput_Documentation; + private const string pageTitle = "Blazor NumberInput"; + private const string pageDescription = "Blazor Bootstrap NumberInput component is built around HTML input of type=\"number\" that prevents the user input based on the parameters set."; + private const string metaTitle = "Blazor NumberInput Component"; + private const string metaDescription = "Blazor Bootstrap NumberInput component is built around HTML input of type=\"number\" that prevents the user input based on the parameters set."; + private const string imageUrl = "https://i.imgur.com/iUNBkki.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor index 26f59729f..2aea480b1 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor @@ -1,63 +1,73 @@ @page "/range-input" -@page "/form/range-input" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Range Input

    -
    - Blazor Bootstrap RangeInput component is built around HTML input of type="range". -
    + + @pageDescription + - -
    - - - - -
    Use the Disabled parameter to disable the RangeInput.
    - -
    Also, use Enable() and Disable() methods to enable and disable the RangeInput.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - - - -
    - Set the Min and Max parameters to restrict the user input between the Min and Max range. - By default, the minimum is 0. -
    - -

    - By default the maximum is 100 for sbyte?, short?, int?, long?, float?, double? and decimal? data types. For other data types it is 0. -

    -

    - If the user tries to specify a numeric value which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the minimum value, then it will override with the Min value. - If the user input exceeds the maximum value, it will override with the Max value. -

    -     - - - -
    The Step parameter is a number that specifies the granularity that the value must adhere to. Only values that match the specified stepping interval are valid.
    - - - -
    - - - -
    - To add tick marks to a RangeInput, set the TickMarks parameter. -
    - +
    +
    + + +
    + +
    +
    Use the Disabled parameter to disable the RangeInput.
    + +
    Also, use Enable() and Disable() methods to enable and disable the RangeInput.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    + +
    +
    + Set the Min and Max parameters to restrict the user input between the Min and Max range. + By default, the minimum is 0. +
    + +

    + By default the maximum is 100 for sbyte?, short?, int?, long?, float?, double? and decimal? data types. For other data types it is 0. +

    +

    + If the user tries to specify a numeric value which is out of range, then it will override with Min or Max value based on the context. If the user input is less than the minimum value, then it will override with the Min value. + If the user input exceeds the maximum value, it will override with the Max value. +

    +     + +
    + +
    +
    The Step parameter is a number that specifies the granularity that the value must adhere to. Only values that match the specified stepping interval are valid.
    + +
    + +
    +
    + +
    + +
    +
    + To add tick marks to a RangeInput, set the TickMarks parameter. +
    + +
    + @code { - private string pageUrl = "/form/range-input"; - private string title = "Blazor RangeInput Component"; - private string description = "Blazor Bootstrap RangeInput component is built around HTML input of type=\"range\"."; - private string imageUrl = "https://i.imgur.com/rWDDHaf.png"; + private const string pageUrl = RouteConstants.Demos_RangeInput_Documentation; + private const string pageTitle = "Blazor RangeInput"; + private const string pageDescription = "Blazor Bootstrap RangeInput component is built around HTML input of type=\"range\"."; + private const string metaTitle = "Blazor RangeInput Component"; + private const string metaDescription = "Blazor Bootstrap RangeInput component is built around HTML input of type=\"range\"."; + private const string imageUrl = "https://i.imgur.com/rWDDHaf.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor index 8441e4110..13b7966c8 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor @@ -1,47 +1,55 @@ @page "/switch" -@page "/form/switch" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Switch

    -
    - Use the Blazor Bootstrap Switch component to show the consistent cross-browser and cross-device custom checkboxes. -
    + + @pageDescription + - +
    - - -
    Use the Disabled parameter to disable the Switch.
    - -
    Also, use Enable() and Disable() methods to enable and disable the Switch.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - - - -
    - Put your switches on the opposite side by using the Reverse parameter. -
    - - - -
    - This event fired when the Switch selection changed. -
    - - - - +
    + +
    +
    Use the Disabled parameter to disable the Switch.
    + +
    Also, use Enable() and Disable() methods to enable and disable the Switch.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    + +
    +
    + Put your switches on the opposite side by using the Reverse parameter. +
    + +
    + +
    +
    + This event fired when the Switch selection changed. +
    + +
    + +
    + +
    @code { - private string pageUrl = "/form/switch"; - private string title = "Blazor Switch Component"; - private string description = "Create consistent cross-browser and cross-device checkboxes with our blazor switches. A switch has the markup of a custom checkbox."; - private string imageUrl = "https://i.imgur.com/ALKzreq.png"; + private const string pageUrl = RouteConstants.Demos_Switch_Documentation; + private const string pageTitle = "Blazor Switch"; + private const string pageDescription = "Create consistent cross-browser and cross-device checkboxes with our blazor switches. A switch has the markup of a custom checkbox."; + private const string metaTitle = "Blazor Switch Component"; + private const string metaDescription = "Create consistent cross-browser and cross-device checkboxes with our blazor switches. A switch has the markup of a custom checkbox."; + private const string imageUrl = "https://i.imgur.com/ALKzreq.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor index 238d683eb..c05d9da9d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor @@ -1,76 +1,85 @@ @page "/time-input" -@page "/form/time-input" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Time Input

    -
    - The Blazor Bootstrap TimeInput component is constructed using an HTML input of type="time" which limits user input based on pre-defined parameters. - This component enables users to input a time using a text box with validation or a special time picker interface. -
    + + @pageDescription + - - - The input UI generally varies from browser to browser. - In unsupported browsers, the control degrades gracefully to type="text". - +
    + + The input UI generally varies from browser to browser. + In unsupported browsers, the control degrades gracefully to type="text". + - + +
    - -
    -

    - The Blazor Bootstrap TimeInput component supports TimeOnly and TimeOnly?. - In the below example, TValue is set to TimeOnly and TimeOnly?. -

    -
    - +
    +
    +

    + The Blazor Bootstrap TimeInput component supports TimeOnly and TimeOnly?. + In the below example, TValue is set to TimeOnly and TimeOnly?. +

    +
    + +
    - -
    - Set EnableMinMax="true" and set the Max and Min parameters to restrict the user input between the Min and Max range. -
    - - If the user tries to enter a number in the TimeInput field which is out of range, then it will override with Max or Min value based on the context. - If the user input exceeds the Max value, it will override with the Max value. If the user input is less than the Min value, then it will override with the Min value. - - +
    +
    + Set EnableMinMax="true" and set the Max and Min parameters to restrict the user input between the Min and Max range. +
    + + If the user tries to enter a number in the TimeInput field which is out of range, then it will override with Max or Min value based on the context. + If the user input exceeds the Max value, it will override with the Max value. If the user input is less than the Min value, then it will override with the Min value. + + +
    - -
    Use the Disabled parameter to disable the TimeInput.
    - -
    Also, use Enable() and Disable() methods to enable and disable the TimeInput.
    - - Do not use both the Disabled parameter and Enable() & Disable() methods. - - +
    +
    Use the Disabled parameter to disable the TimeInput.
    + +
    Also, use Enable() and Disable() methods to enable and disable the TimeInput.
    + + Do not use both the Disabled parameter and Enable() & Disable() methods. + + +
    - -
    - Like any other blazor input component, TimeInput component supports validations. Use the DataAnnotations to validate the user input before submitting the form. In the below example, we used the Required attributes. -
    - +
    +
    + Like any other blazor input component, TimeInput component supports validations. Use the DataAnnotations to validate the user input before submitting the form. In the below example, we used the Required attributes. +
    + +
    - -
    - This event fires on every user keystroke/selection that changes the TimeInput value. -
    - +
    +
    + This event fires on every user keystroke/selection that changes the TimeInput value. +
    + +
    - -
    - One common scenario is that the time fields are restricted based on the entry in another time field. - In the example below, we restrict the arrival time based on the selection of departure. -
    - +
    +
    + One common scenario is that the time fields are restricted based on the entry in another time field. + In the example below, we restrict the arrival time based on the selection of departure. +
    + +
    @code { - private string pageUrl = "/form/time-input"; - private string title = "Blazor TimeInput Component"; - private string description = "The Blazor Bootstrap TimeInput component is constructed using an HTML input of type 'time' which limits user input based on pre-defined parameters. This component enables users to input a time using a text box with validation or a special time picker interface."; - private string imageUrl = "https://i.imgur.com/1mVjqQv.png"; + private const string pageUrl = RouteConstants.Demos_TimeInput_Documentation; + private const string pageTitle = "Blazor TimeInput"; + private const string pageDescription = "The Blazor Bootstrap TimeInput component is constructed using an HTML input of type 'time' which limits user input based on pre-defined parameters. This component enables users to input a time using a text box with validation or a special time picker interface."; + private const string metaTitle = "Blazor TimeInput Component"; + private const string metaDescription = "The Blazor Bootstrap TimeInput component is constructed using an HTML input of type 'time' which limits user input based on pre-defined parameters. This component enables users to input a time using a text box with validation or a special time picker interface."; + private const string imageUrl = "https://i.imgur.com/1mVjqQv.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/GettingStarted/GettingStartedDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/GettingStarted/GettingStartedDocumentation.razor index b401c91b9..839fbd92d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/GettingStarted/GettingStartedDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/GettingStarted/GettingStartedDocumentation.razor @@ -1,31 +1,34 @@ -@page "/getting-started" -@page "/getting-started/blazor-webassembly" +@page "/getting-started/blazor-webassembly" @page "/getting-started/blazor-server" @page "/getting-started/maui-blazor" -@title +@attribute [Route(pageUrl)] - + -

    Getting started - Blazor Bootstrap

    -
    Get started with the Enterprise-class Blazor Bootstrap Component library built on the Blazor and Bootstrap CSS frameworks.
    + + @pageDescription + - -
    - Please find the getting started documentation links, corresponding to each .NET version and project type, listed below: -
    +
    +
    + Please find the getting started documentation links, corresponding to each .NET version and project type, listed below: +
    - - +
    + - - + + @@ -46,19 +49,19 @@ - -
    # .NET Version Documentation Link
    1 .NET 8.NET 8 MAUI Blazor Hybrid App (.NET 8)
    + + - - +
    + - - + + @@ -74,20 +77,19 @@ - -
    # .NET Version Documentation Link
    1 .NET 7.NET 7 MAUI Blazor Hybrid App (.NET 7)
    + + - - - +
    + - - + + @@ -98,15 +100,17 @@ - -
    # .NET Version Documentation Link
    1 .NET 6.NET 6 Blazor Server (.NET 6)
    - + + +
    @code { - private string pageUrl = "/getting-started/blazor-webassembly"; - private string title = "Getting started with Blazor Bootstrap - Blazor WebAssembly Project Setup"; - private string description = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; - private string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; + private const string pageUrl = RouteConstants.Demos_GettingStarted_Documentation; + private const string pageTitle = "Getting started with Blazor Bootstrap - Blazor Project Setup"; + private const string pageDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string metaTitle = "Getting started with Blazor Bootstrap - Blazor Project Setup"; + private const string metaDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; private string? version; [Inject] public IConfiguration Configuration { get; set; } = default!; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Overview_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Overview_Documentation.razor index 0a832a33d..adf4edaa6 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Overview_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/01-Overview/Grid_Overview_Documentation.razor @@ -1,26 +1,31 @@ -@attribute [Route(pageUrl)] -@attribute [Route(pageUrl2)] +@page "/grid" -@title +@attribute [Route(pageUrl)] - + -

    @heading

    -
    @description
    + + @pageDescription + - - +
    + +
    - - +
    + +
    @code { - private const string pageUrl = "/grid/overview"; - private const string pageUrl2 = "/grid"; - private const string title = "Blazor Grid Component"; - private const string heading = "Blazor Grid"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Overview_Documentation; + private const string pageTitle = "Blazor Grid"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/02-data-binding/Grid_DataBinding_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/02-data-binding/Grid_DataBinding_Documentation.razor index a13fba2a3..238af3097 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/02-data-binding/Grid_DataBinding_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/02-data-binding/Grid_DataBinding_Documentation.razor @@ -1,35 +1,40 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    Assign a collection to the Data parameter to render the grid dynamically. The example below will render different department employees in the individual grid.
    - +
    +
    Assign a collection to the Data parameter to render the grid dynamically. The example below will render different department employees in the individual grid.
    + +
    - -
    You can update the collection assigned to the Data parameter. In the below example, the grid will render the updated collection.
    - -

    - The Add Employee button click adds a new employee to the existing employees collection—so explicit grid refresh is required. -

    -

    - The Add Employee 2 button click creates a shallow copy of the employees collection and adds a new employee. - This new collection is assigned to the employees variable. Now, the employees variable has a new reference. So the grid will refresh automatically. An explicit grid refresh call is not required. -

    -     - +
    +
    You can update the collection assigned to the Data parameter. In the below example, the grid will render the updated collection.
    + +

    + The Add Employee button click adds a new employee to the existing employees collection—so explicit grid refresh is required. +

    +

    + The Add Employee 2 button click creates a shallow copy of the employees collection and adds a new employee. + This new collection is assigned to the employees variable. Now, the employees variable has a new reference. So the grid will refresh automatically. An explicit grid refresh call is not required. +

    +     + +
    @code { - private const string pageUrl = "/grid/data-binding"; - private const string title = "Blazor Grid Component - Data binding"; - private const string heading = "Blazor Grid - Data binding"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_DataBinding_Documentation; + private const string pageTitle = "Blazor Grid - Data binding"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Data binding"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor index 855ba0448..5b2854421 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/03-filters/Grid_Filters_Documentation.razor @@ -1,65 +1,75 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    For filtering, AllowFiltering and PropertyName parameters are required.
    -
    Add AllowFiltering="true" parameter to Grid and PropertyName parameter to all the GridColumns.
    - +
    +
    For filtering, AllowFiltering and PropertyName parameters are required.
    +
    Add AllowFiltering="true" parameter to Grid and PropertyName parameter to all the GridColumns.
    + +
    - -
    In the below example, StringComparision.Ordinal is used on the Employee Name column to make the filter case-sensitive.
    - -
    By default, StringComparison.OrdinalIgnoreCase is used to compare culture-agnostic and case-insensitive string matching.
    -     - +
    +
    In the below example, StringComparision.Ordinal is used on the Employee Name column to make the filter case-sensitive.
    + +
    By default, StringComparison.OrdinalIgnoreCase is used to compare culture-agnostic and case-insensitive string matching.
    +     + +
    - -
    - FilterOperator and FilterValue parameters are required to set the default filter. -
    -You can set the default filter on more than one GridColumn. -
    The default sorting is enabled on the Id column in the below example.
    - +
    +
    + FilterOperator and FilterValue parameters are required to set the default filter. +
    + You can set the default filter on more than one GridColumn. +
    The default sorting is enabled on the Id column in the below example.
    + +
    - -
    - Filterable parameter is required to disable the filter on a specific column. Add Filterable="false" parameter to GridColumn. The column filter is disabled on the Id column in the below example. -
    - +
    +
    + Filterable parameter is required to disable the filter on a specific column. Add Filterable="false" parameter to GridColumn. The column filter is disabled on the Id column in the below example. +
    + +
    - -
    Add FilterTextboxWidth parameter to the GridColumn to increase or decrease the filter textbox width, FilterTextboxWidth parameter is optional.
    -Filter textbox width measured in pixels. - +
    +
    Add FilterTextboxWidth parameter to the GridColumn to increase or decrease the filter textbox width, FilterTextboxWidth parameter is optional.
    + Filter textbox width measured in pixels. + - -

    - The Add Employee button click adds a new employee to the existing employees collection—so explicit grid refresh is required. -

    -

    - The Add Employee 2 button click creates a shallow copy of the employees collection and adds a new employee. - This new collection is assigned to the employees variable. Now, the employees variable has a new reference. So the grid will refresh automatically. An explicit grid refresh call is not required. -

    -     + +

    + The Add Employee button click adds a new employee to the existing employees collection—so explicit grid refresh is required. +

    +

    + The Add Employee 2 button click creates a shallow copy of the employees collection and adds a new employee. + This new collection is assigned to the employees variable. Now, the employees variable has a new reference. So the grid will refresh automatically. An explicit grid refresh call is not required. +

    +     +
    - - +
    + +
    - - +
    + +
    @code { - private const string pageUrl = "/grid/filters"; - private const string title = "Blazor Grid Component - Filters"; - private const string heading = "Blazor Grid - Filters"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Filters_Documentation; + private const string pageTitle = "Blazor Grid - Filters"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Filters"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor index 4422b0631..959fe0faf 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/04-paging/Grid_Paging_Documentation.razor @@ -1,35 +1,42 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    For paging, AllowPaging and PageSize parameters are required.
    -
    Add AllowPaging="true" and PageSize="20" parameters to the Grid. PageSize parameter is optional.
    -The default page size is 10. - +
    +
    For paging, AllowPaging and PageSize parameters are required.
    +
    Add AllowPaging="true" and PageSize="20" parameters to the Grid. PageSize parameter is optional.
    + The default page size is 10. + +
    - -
    - +
    +
    + +
    - -
    - +
    +
    + +
    - - +
    + +
    @code { - private const string pageUrl = "/grid/paging"; - private const string title = "Blazor Grid Component - Paging"; - private const string heading = "Blazor Grid - Paging"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Paging_Documentation; + private const string pageTitle = "Blazor Grid - Paging"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Paging"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/05-sorting/Grid_Sorting_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/05-sorting/Grid_Sorting_Documentation.razor index 0c204c2d0..256ed0b4d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/05-sorting/Grid_Sorting_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/05-sorting/Grid_Sorting_Documentation.razor @@ -1,34 +1,40 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    For sorting, AllowSorting and SortKeySelector parameters are required.
    -
    Add AllowSorting="true" parameter to Grid and SortKeySelector to all the GridColumns.
    - - - -
    IsDefaultSortColumn parameter is required to set the default sorting. Add IsDefaultSortColumn="true" parameter to the GridColumn.
    -
    The default sort direction will be ascending. To change the default sorting of a column, add SortDirection="SortDirection.Descending" to the GridColumn.
    -If more than one GridColumn has the IsDefaultSortColumn paramter, it will pick the first column as the default sorting column. -
    The default sorting is enabled on the Employee Name column in the below example, and the sort direction is descending.
    - - - -
    Add Sortable="false"parameter the GridColumn to disable the sorting. If sorting is disabled, then the SortKeySelector parameter is not required. The sorting is disabled on the Designation column in the below example.
    - +
    +
    For sorting, AllowSorting and SortKeySelector parameters are required.
    +
    Add AllowSorting="true" parameter to Grid and SortKeySelector to all the GridColumns.
    + +
    + +
    +
    IsDefaultSortColumn parameter is required to set the default sorting. Add IsDefaultSortColumn="true" parameter to the GridColumn.
    +
    The default sort direction will be ascending. To change the default sorting of a column, add SortDirection="SortDirection.Descending" to the GridColumn.
    + If more than one GridColumn has the IsDefaultSortColumn paramter, it will pick the first column as the default sorting column. +
    The default sorting is enabled on the Employee Name column in the below example, and the sort direction is descending.
    + +
    + +
    +
    Add Sortable="false"parameter the GridColumn to disable the sorting. If sorting is disabled, then the SortKeySelector parameter is not required. The sorting is disabled on the Designation column in the below example.
    + +
    @code { - private const string pageUrl = "/grid/sorting"; - private const string title = "Blazor Grid Component - Sorting"; - private const string heading = "Blazor Grid - Sorting"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Sorting_Documentation; + private const string pageTitle = "Blazor Grid - Sorting"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Sorting"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/06-selection/Grid_Selection_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/06-selection/Grid_Selection_Documentation.razor index 636670bf2..a2c2fc9a2 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/06-selection/Grid_Selection_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/06-selection/Grid_Selection_Documentation.razor @@ -1,50 +1,57 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    - Set AllowSelection="true" to enable the selection on the Grid. - By default, SelectionMode is Single. -
    - - - -
    - To select multiple rows, set SelectionMode="GridSelectionMode.Multiple". -
    - - -

    Selected items are removed from the selection if they are not rendered after paging, sorting, filtering, etc.

    -     - - -
    - We can disable the header checkbox or row level checkbox based on a condition. - For this, we have DisableAllRowsSelection and DisableRowSelection delegate parameters. In the below example, we disabled the header checkbox if any of the employee Id is less than 105. - Also, disable check the row level checkbox if the employee Id is less than 105. -
    - - - - -
    - These CSS variables are used to set the default colors and background color of a row when it's selected. - You can override the --bb-table-selected-row-color, --bb-table-selected-row-background-color, --bb-table-selected-row-hover-color, and --bb-table-selected-row-hover-background-color variables in the application's specific CSS file to change the selected row's appearance. Please see the following example where the row text color is set to #fff (white) and the background color is set to #4c0bce (purple) when the row is selected. -
    - +
    +
    + Set AllowSelection="true" to enable the selection on the Grid. + By default, SelectionMode is Single. +
    + +
    + +
    +
    + To select multiple rows, set SelectionMode="GridSelectionMode.Multiple". +
    + + +

    Selected items are removed from the selection if they are not rendered after paging, sorting, filtering, etc.

    +     +
    + +
    +
    + We can disable the header checkbox or row level checkbox based on a condition. + For this, we have DisableAllRowsSelection and DisableRowSelection delegate parameters. In the below example, we disabled the header checkbox if any of the employee Id is less than 105. + Also, disable check the row level checkbox if the employee Id is less than 105. +
    + +
    + +
    + +
    + These CSS variables are used to set the default colors and background color of a row when it's selected. + You can override the --bb-table-selected-row-color, --bb-table-selected-row-background-color, --bb-table-selected-row-hover-color, and --bb-table-selected-row-hover-background-color variables in the application's specific CSS file to change the selected row's appearance. Please see the following example where the row text color is set to #fff (white) and the background color is set to #4c0bce (purple) when the row is selected. +
    + +
    @code { - private const string pageUrl = "/grid/selection"; - private const string title = "Blazor Grid Component - Selection"; - private const string heading = "Blazor Grid - Selection"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Selection_Documentation; + private const string pageTitle = "Blazor Grid - Selection"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Selection"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/07-alignment/Grid_Alignment_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/07-alignment/Grid_Alignment_Documentation.razor index 97af142f5..491475b2b 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/07-alignment/Grid_Alignment_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/07-alignment/Grid_Alignment_Documentation.razor @@ -1,26 +1,31 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    Use the HeaderTextAlignment parameter to change the header column alignment. By default, HeaderTextAlignment is set to Alignment.Start. Other options you can use are Alignment.Center and Alignment.End.
    - +
    +
    Use the HeaderTextAlignment parameter to change the header column alignment. By default, HeaderTextAlignment is set to Alignment.Start. Other options you can use are Alignment.Center and Alignment.End.
    + +
    - -
    Use the TextAlignment parameter to change the cell data alignment. By default, TextAlignment is set to Alignment.Start. Other options you can use are Alignment.Center and Alignment.End.
    - +
    +
    Use the TextAlignment parameter to change the cell data alignment. By default, TextAlignment is set to Alignment.Start. Other options you can use are Alignment.Center and Alignment.End.
    + +
    @code { - private const string pageUrl = "/grid/alignment"; - private const string title = "Blazor Grid Component - Alignment"; - private const string heading = "Blazor Grid - Alignment"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Alignment_Documentation; + private const string pageTitle = "Blazor Grid - Alignment"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Alignment"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/08-grid-settings/Grid_GridSettings_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/08-grid-settings/Grid_GridSettings_Documentation.razor index 311dbe4e7..9769c0440 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/08-grid-settings/Grid_GridSettings_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/08-grid-settings/Grid_GridSettings_Documentation.razor @@ -1,24 +1,28 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    This example shows how to save/load the Grid state. The state includes the page number, page size, and filters.
    -In version 0.5.1 and above, the Grid sorting state is not included as part of GridSettings. We will add it in the subsequent releases. -Browser local storage is used to persist the Grid state. Common locations exist for persisting state are Server-side storage, URL, Browser storage, and In-memory state container service. - +
    +
    This example shows how to save/load the Grid state. The state includes the page number, page size, and filters.
    + In version 0.5.1 and above, the Grid sorting state is not included as part of GridSettings. We will add it in the subsequent releases. + Browser local storage is used to persist the Grid state. Common locations exist for persisting state are Server-side storage, URL, Browser storage, and In-memory state container service. + +
    @code { - private const string pageUrl = "/grid/settings"; - private const string title = "Blazor Grid Component - Settings"; - private const string heading = "Blazor Grid - Settings"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Settings_Documentation; + private const string pageTitle = "Blazor Grid - Settings"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Settings"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/09-custom-css-class/Grid_CustomCSSClass_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/09-custom-css-class/Grid_CustomCSSClass_Documentation.razor index c4b78f0f9..5665dd992 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/09-custom-css-class/Grid_CustomCSSClass_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/09-custom-css-class/Grid_CustomCSSClass_Documentation.razor @@ -1,38 +1,46 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    In the below example, we applied table-danger CSS class to the row where the employee is inactive and the table-success CSS class to the row where the employee designation is Architect.
    - +
    +
    In the below example, we applied table-danger CSS class to the row where the employee is inactive and the table-success CSS class to the row where the employee designation is Architect.
    + +
    - -
    In the below example, we applied table-danger CSS class to the Active column where the employee is inactive and the table-success CSS class to the Active column where the employee is active.
    - +
    +
    In the below example, we applied table-danger CSS class to the Active column where the employee is inactive and the table-success CSS class to the Active column where the employee is active.
    + +
    - -
    In the following example, the Class parameter is used to apply the CSS class to an entire grid column, including the header.
    - +
    +
    In the following example, the Class parameter is used to apply the CSS class to an entire grid column, including the header.
    + +
    - -
    - +
    +
    + +
    - -
    - +
    +
    + +
    @code { - private const string pageUrl = "/grid/custom-css-class"; - private const string title = "Blazor Grid Component - Custom CSS Class"; - private const string heading = "Blazor Grid - Custom CSS Class"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_CustomCSSClass_Documentation; + private const string pageTitle = "Blazor Grid - Custom CSS Class"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Custom CSS Class"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/10-events/Grid_Events_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/10-events/Grid_Events_Documentation.razor index bd02c9ad3..3da3389f2 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/10-events/Grid_Events_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/10-events/Grid_Events_Documentation.razor @@ -1,26 +1,31 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    - +
    +
    + +
    - -
    - +
    +
    + +
    @code { - private const string pageUrl = "/grid/events"; - private const string title = "Blazor Grid Component - Events"; - private const string heading = "Blazor Grid - Events"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Events_Documentation; + private const string pageTitle = "Blazor Grid - Events"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Events"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor index 97a474e11..7fae7fe21 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/11-translations/Grid_Translations_Documentation.razor @@ -1,22 +1,26 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    In the example below, you will see translations related to pagination and filters in Dutch.
    - +
    +
    In the example below, you will see translations related to pagination and filters in Dutch.
    + +
    @code { - private const string pageUrl = "/grid/translations"; - private const string title = "Blazor Grid Component - Translations"; - private const string heading = "Blazor Grid - Translations"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_Translations_Documentation; + private const string pageTitle = "Blazor Grid - Translations"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Translations"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/12-fixed-header/Grid_FixedHeader_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/12-fixed-header/Grid_FixedHeader_Documentation.razor index b45318bfc..7ba88932c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/12-fixed-header/Grid_FixedHeader_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/12-fixed-header/Grid_FixedHeader_Documentation.razor @@ -1,28 +1,33 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    - To set the fixed header, set the FixedHeader parameter to true. The minimum height of the grid is 320 pixels. - You can change the units to em, pt, px, or etc. by setting the Unit parameter. -
    - +
    +
    + To set the fixed header, set the FixedHeader parameter to true. The minimum height of the grid is 320 pixels. + You can change the units to em, pt, px, or etc. by setting the Unit parameter. +
    + +
    - - +
    + +
    @code { - private const string pageUrl = "/grid/fixed-header"; - private const string title = "Blazor Grid Component - Fixed header"; - private const string heading = "Blazor Grid - Fixed header"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_FixedHeader_Documentation; + private const string pageTitle = "Blazor Grid - Fixed header"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Fixed header"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/13-freeze-columns/Grid_FreezeColumns_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/13-freeze-columns/Grid_FreezeColumns_Documentation.razor index ca0ffdfb6..bc3007bfa 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/13-freeze-columns/Grid_FreezeColumns_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/13-freeze-columns/Grid_FreezeColumns_Documentation.razor @@ -1,28 +1,34 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    - +
    +
    + +
    - - +
    + +
    - - +
    + +
    @code { - private const string pageUrl = "/grid/freeze-columns"; - private const string title = "Blazor Grid Component - Freeze columns"; - private const string heading = "Blazor Grid - Freeze columns"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_FreezeColumns_Documentation; + private const string pageTitle = "Blazor Grid - Freeze columns"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Freeze columns"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor index beae70930..c7d78be9f 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_DetailView_Documentation.razor @@ -1,26 +1,31 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    To enable detail view, set the AllowDetailView parameter to true. In the following example, existing <GridColumn> tags are nested under <GridColumns> tag to distinguish them from <GridDetailView>.
    - +
    +
    To enable detail view, set the AllowDetailView parameter to true. In the following example, existing <GridColumn> tags are nested under <GridColumns> tag to distinguish them from <GridDetailView>.
    + +
    - -
    - +
    +
    + +
    @code { - private const string pageUrl = "/grid/detail-view"; - private const string title = "Blazor Grid Component - Detail View"; - private const string heading = "Blazor Grid - Detail View"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_DetailView_Documentation; + private const string pageTitle = "Blazor Grid - Detail View"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Detail View"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/eetvhBB.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/15-nested-grid/Grid_Nested_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/15-nested-grid/Grid_Nested_Documentation.razor index 6203010cd..061072d92 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/15-nested-grid/Grid_Nested_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/15-nested-grid/Grid_Nested_Documentation.razor @@ -1,22 +1,26 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    To create a nested grid, we first need to enable the detail view. To enable the detail view, set the AllowDetailView parameter to true. In the following example, existing <GridColumn> tags are nested under <GridColumns> tag to distinguish them from <GridDetailView>.
    - +
    +
    To create a nested grid, we first need to enable the detail view. To enable the detail view, set the AllowDetailView parameter to true. In the following example, existing <GridColumn> tags are nested under <GridColumns> tag to distinguish them from <GridDetailView>.
    + +
    @code { - private const string pageUrl = "/grid/nested-grid"; - private const string title = "Blazor Grid Component - Nested Grid"; - private const string heading = "Blazor Grid - Nested Grid"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_NestedGrid_Documentation; + private const string pageTitle = "Blazor Grid - Nested Grid"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Nested Grid"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/IpMhPwG.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/99-other/Grid_Other_Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/99-other/Grid_Other_Documentation.razor index 78ea5abce..df13ae1b4 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/99-other/Grid_Other_Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/99-other/Grid_Other_Documentation.razor @@ -1,39 +1,47 @@ @attribute [Route(pageUrl)] -@title + - - -

    @heading

    -
    @description
    + + @pageDescription + - -
    To format the cell data, use ToString method and format strings. Refer: How to format numbers, dates, enums, and other types in .NET
    -Example: @@context.Salary.ToString("N2"). - +
    +
    To format the cell data, use ToString method and format strings. Refer: How to format numbers, dates, enums, and other types in .NET
    + Example: @@context.Salary.ToString("N2"). + +
    - -
    To prevent text from wrapping, add TextNoWrap="true" to the GridColumn.
    - +
    +
    To prevent text from wrapping, add TextNoWrap="true" to the GridColumn.
    + +
    - -
    If there are no records to display in the Grid, by default, it will display the No records to display message. You can change this message by adding the EmptyText parameter to the Grid.
    - +
    +
    If there are no records to display in the Grid, by default, it will display the No records to display message. You can change this message by adding the EmptyText parameter to the Grid.
    + +
    - -
    Set the GridEmptyDataTemplate to customize the message displayed when the grid has no records.
    - +
    +
    Set the GridEmptyDataTemplate to customize the message displayed when the grid has no records.
    + +
    - -
    In the below example, we use <HeaderContent> and <ChildContent> tags to define custom column header and cell content. When defining header content, filters and sorting are removed from column.
    - +
    +
    In the below example, we use <HeaderContent> and <ChildContent> tags to define custom column header and cell content. When defining header content, filters and sorting are removed from column.
    + +
    @code { - private const string pageUrl = "/grid/other"; - private const string title = "Blazor Grid Component - Other examples"; - private const string heading = "Blazor Grid - Other examples"; - private const string description = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string pageUrl = RouteConstants.Demos_Grid_OtherExamples_Documentation; + private const string pageTitle = "Blazor Grid - Other examples"; + private const string pageDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; + private const string metaTitle = "Blazor Grid Component - Other examples"; + private const string metaDescription = "Use Blazor Bootstrap grid component to display tabular data from the data source. And it supports client-side and server-side filtering, paging, and sorting."; private const string imageUrl = "https://i.imgur.com/kKNgo2I.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Icons/IconDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Icons/IconDocumentation.razor index 16fe2dd63..4248bc0c2 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Icons/IconDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Icons/IconDocumentation.razor @@ -1,61 +1,75 @@ -@page "/icons" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Icons

    -
    - The Icon component will display an icon from any icon font. -
    + + @pageDescription + - - +
    + +
    - - +
    + +
    - -
    - In the following example, we used Font Awesome 6.4.2 free version icons. For Font Awesome setup, please follow the Font Awesome website. -
    - +
    +
    + In the following example, we used Font Awesome 6.4.2 free version icons. For Font Awesome setup, please follow the Font Awesome website. +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - -
    - In the following example, we used Font Awesome 6.4.2 free version icons. For Font Awesome setup, please follow the Font Awesome website. -
    - +
    +
    + In the following example, we used Font Awesome 6.4.2 free version icons. For Font Awesome setup, please follow the Font Awesome website. +
    + +
    - - +
    + +
    - - +
    + +
    @code{ - private string pageUrl = "/icons"; - private string title = "Blazor Icon Component"; - private string description = "Blazor Bootstrap icon component will display an icon from any icon font."; - private string imageUrl = "https://i.imgur.com/273TamX.png"; + private const string pageUrl = RouteConstants.Demos_Icons_Documentation; + private const string pageTitle = "Blazor Icon"; + private const string pageDescription = "Blazor Bootstrap icon component will display an icon from any icon font."; + private const string metaTitle = "Blazor Icon Component"; + private const string metaDescription = "Blazor Bootstrap icon component will display an icon from any icon font."; + private const string imageUrl = "https://i.imgur.com/273TamX.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Images/ImageDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Images/ImageDocumentation.razor index 37e14c4c0..afbd46df7 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Images/ImageDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Images/ImageDocumentation.razor @@ -1,34 +1,41 @@ -@page "/images" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Images

    -
    Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them.
    + + @pageDescription + - -
    - By default images are responsive. The default value of the IsResponsive parameter is true. -
    - - - -
    - To set the image to have a rounded 1px border appearance, set the IsThumbnail parameter to true. -
    - - - - - - +
    +
    + By default images are responsive. The default value of the IsResponsive parameter is true. +
    + +
    + +
    +
    + To set the image to have a rounded 1px border appearance, set the IsThumbnail parameter to true. +
    + +
    + +
    + + + +
    @code { - private string pageUrl = "/images"; - private string title = "Blazor Image Component"; - private string description = "Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them."; - private string imageUrl = "https://i.imgur.com/eiSTmvO.png"; + private const string pageUrl = RouteConstants.Demos_Images_Documentation; + private const string pageTitle = "Blazor Image"; + private const string pageDescription = "Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them."; + private const string metaTitle = "Blazor Image Component"; + private const string metaDescription = "Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them."; + private const string imageUrl = "https://i.imgur.com/eiSTmvO.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor index 6041f4148..172d701ea 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor @@ -356,7 +356,7 @@
    - This demo website is built using the Blazor Bootstrap library and published on the Azure Static Web App. + This demo website is built using the Blazor Bootstrap library and published on the Azure Web App. See our source code on GitHub.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/LayoutServerDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/LayoutServerDocumentation.razor index e61f9d137..6676c5df0 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/LayoutServerDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/LayoutServerDocumentation.razor @@ -1,38 +1,44 @@ -@page "/layout-setup/blazor-server" +@attribute [Route(pageUrl)] -@title + - - -

    Layout Setup - Blazor Server

    -
    Get started with the Enterprise-class Blazor Bootstrap Component library built on the Blazor and Bootstrap CSS frameworks.
    + + @pageDescription + - -
    - Assuming you followed the getting started docs for the initial setup. -
      -
    1. Blazor WebAssembly Project: Follow the getting started steps for the initial setup.
      2. -
    2. Blazor Server Project: Follow the getting started steps for the initial setup.
      3. -
    -
    - - -
    - 1. Replace MainLayout.razor page code with the below code. -
    - - Remove all the CSS content from the Shared/MainLayout.razor.css file. - - - +
    +
    + Assuming you followed the getting started docs for the initial setup. +
      +
    1. Blazor WebAssembly Project: Follow the getting started steps for the initial setup.
      2. +
    2. Blazor Server Project: Follow the getting started steps for the initial setup.
      3. +
    +
    +
    + +
    +
    + 1. Replace MainLayout.razor page code with the below code. +
    + + Remove all the CSS content from the Shared/MainLayout.razor.css file. + + + +
    @code { - private string pageUrl = "/layout-setup/blazor-server"; - private string title = "Blazor Bootstrap Layout Setup - Blazor Server"; - private string description = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; - private string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; + private const string pageUrl = "/layout-setup/blazor-server"; + private const string pageTitle = "Blazor Bootstrap Layout Setup - Blazor Server"; + private const string pageDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string metaTitle = "Blazor Bootstrap Layout Setup - Blazor Server"; + private const string metaDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; private string version = default!; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/LayoutWebAssemblyDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/LayoutWebAssemblyDocumentation.razor index edd649b98..a1b64fcbb 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/LayoutWebAssemblyDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/LayoutWebAssemblyDocumentation.razor @@ -1,39 +1,44 @@ -@page "/layout" -@page "/layout-setup/blazor-webassembly" +@attribute [Route(pageUrl)] -@title + - - -

    Layout Setup - Blazor WebAssembly

    -
    Get started with the Enterprise-class Blazor Bootstrap Component library built on the Blazor and Bootstrap CSS frameworks.
    + + @pageDescription + - -
    - Assuming you followed the getting started docs for the initial setup. -
      -
    1. Blazor WebAssembly Project: Follow the getting started steps for the initial setup.
      2. -
    2. Blazor Server Project: Follow the getting started steps for the initial setup.
      3. -
    -
    - - -
    - 1. Replace MainLayout.razor page code with the below code. -
    - - Remove all the CSS content from the Shared/MainLayout.razor.css file. - - - +
    +
    + Assuming you followed the getting started docs for the initial setup. +
      +
    1. Blazor WebAssembly Project: Follow the getting started steps for the initial setup.
      2. +
    2. Blazor Server Project: Follow the getting started steps for the initial setup.
      3. +
    +
    +
    + +
    +
    + 1. Replace MainLayout.razor page code with the below code. +
    + + Remove all the CSS content from the Shared/MainLayout.razor.css file. + + + +
    @code { - private string pageUrl = "/layout-setup/blazor-webassembly"; - private string title = "Blazor Bootstrap Layout Setup - Blazor WebAssembly"; - private string description = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; - private string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; + private const string pageUrl = "/layout-setup/blazor-webassembly"; + private const string pageTitle = "Blazor Bootstrap Layout Setup - Blazor WebAssembly"; + private const string pageDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string metaTitle = "Blazor Bootstrap Layout Setup - Blazor WebAssembly"; + private const string metaDescription = "High-performance, lightweight, and responsive blazor bootstrap components in a single package from the developers for the developers."; + private const string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; private string version = default!; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Maps/GoogleMapDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Maps/GoogleMapDocumentation.razor index 52b638cad..ecc5f8e76 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Maps/GoogleMapDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Maps/GoogleMapDocumentation.razor @@ -1,67 +1,81 @@ -@page "/google-map" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Google Map

    -
    - Blazor Bootstrap Google Map component will create maps to show locations anywhere in the world using the Google JavaScript API. -
    + + @pageDescription + - -
    - Before you start using the GoogleMap component in your project, you need an API key. - Please follow the link below for detailed steps. - Link: https://developers.google.com/maps/documentation/javascript/adding-a-google-map#key. -
    +
    +
    + Before you start using the GoogleMap component in your project, you need an API key. + Please follow the link below for detailed steps. + Link: https://developers.google.com/maps/documentation/javascript/adding-a-google-map#key. +
    +
    - -
    This example demonstrates how to use a simple Google Map component.
    - +
    +
    This example demonstrates how to use a simple Google Map component.
    + +
    - -
    This example demonstrates how to use a simple Google Map component with marker.
    - +
    +
    This example demonstrates how to use a simple Google Map component with marker.
    + +
    - - -
    To scale a marker, use the PinElement.Scale option.
    - - -
    Use the PinElement.Background option to change the background color of a marker.
    - - -
    Use the PinElement.BorderColor option to change the border color of a marker.
    - - -
    Use the PinElement.GlyphColor option to change the glyph color of a marker.
    - - -
    Set the PinElement.Glyph option to an empty string to hide a marker's glyph.
    - - -
    Use the PinElement.UseIconFonts and PinElement.Glyph options to use the icon fonts.
    - +
    +
    +
    To scale a marker, use the PinElement.Scale option.
    + +
    +
    +
    Use the PinElement.Background option to change the background color of a marker.
    + +
    +
    +
    Use the PinElement.BorderColor option to change the border color of a marker.
    + +
    +
    +
    Use the PinElement.GlyphColor option to change the glyph color of a marker.
    + +
    +
    +
    Set the PinElement.Glyph option to an empty string to hide a marker's glyph.
    + +
    +
    +
    Use the PinElement.UseIconFonts and PinElement.Glyph options to use the icon fonts.
    + +
    - - +
    + +
    - -
    - This example shows you how to make markers respond to click events. To make a marker clickable: - Set the Clickable parameter to true. -
    - +
    +
    + This example shows you how to make markers respond to click events. To make a marker clickable: + Set the Clickable parameter to true. +
    + +
    - - +
    + +
    @code { - private string pageUrl = "/google-map"; - private string title = "Blazor Google Map Component"; - private string description = "Blazor Bootstrap Google Map component will create maps to show locations anywhere in the world using the Google JavaScript API."; - private string imageUrl = "https://i.imgur.com/AbyDP51.png"; + private const string pageUrl = RouteConstants.Demos_GoogleMap_Documentation; + private const string pageTitle = "Blazor Google Map"; + private const string pageDescription = "Blazor Bootstrap Google Map component will create maps to show locations anywhere in the world using the Google JavaScript API."; + private const string metaTitle = "Blazor Google Map Component"; + private const string metaDescription = "Blazor Bootstrap Google Map component will create maps to show locations anywhere in the world using the Google JavaScript API."; + private const string imageUrl = "https://i.imgur.com/AbyDP51.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor index c0236bd22..e27df3ec0 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Markdown/MarkdownDocumentation.razor @@ -1,112 +1,132 @@ -@page "/markdown" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Markdown Preview

    -
    Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages.
    + + @pageDescription + - -
    - - - -
    - Use headers to structure your content. Start a line with # for a heading. Add more # characters for subheadings, up to six levels. -
    - - - -
    - Break your text into paragraphs or line breaks for easier reading. -
    - - - -
    - Quote text with > before it. Use more > characters to nest quotes. For blocks of text, use > at the start of each line. -
    - - - -
    - Add a horizontal rule with a line of ---. -
    - - - -
    - Emphasize text with bold, italics, or strikethrough: -
      -
    • Italics: *text* or _text_
      • -
    • Bold: **text**
      • -
    • Strikethrough: ~~text~~
      • -
    • Combine for more emphasis.
      • -
    -
    - - - -
    - - - -
    - Tables help organize structured data. -
      -
    • Use | to separate cells.
      • -
    • Escape | with \| if used within a cell.
      • -
    • Use <br /> for new lines within a cell.
      • -
    • End each row with a carriage return (CR) or line feed (LF).
      • -
    -
    - -
    - - - -
    - Use lists to organize related items: -
      -
    • Ordered lists: start with a number followed by a period.
      • -
    • Unordered lists: start with a -.
      • -
    • Begin each list item on a new line.
      • -
    -
    - -
    - - - -
    - - - -
    - -
    - -
    - - - -
    - - - -
    - - - -
    - +
    +
    + +
    + +
    +
    + Use headers to structure your content. Start a line with # for a heading. Add more # characters for subheadings, up to six levels. +
    + +
    + +
    +
    + Break your text into paragraphs or line breaks for easier reading. +
    + +
    + +
    +
    + Quote text with > before it. Use more > characters to nest quotes. For blocks of text, use > at the start of each line. +
    + +
    + +
    +
    + Add a horizontal rule with a line of ---. +
    + +
    + +
    +
    + Emphasize text with bold, italics, or strikethrough: +
      +
    • Italics: *text* or _text_
      • +
    • Bold: **text**
      • +
    • Strikethrough: ~~text~~
      • +
    • Combine for more emphasis.
      • +
    +
    + +
    + +
    +
    + +
    + +
    +
    + Tables help organize structured data. +
      +
    • Use | to separate cells.
      • +
    • Escape | with \| if used within a cell.
      • +
    • Use <br /> for new lines within a cell.
      • +
    • End each row with a carriage return (CR) or line feed (LF).
      • +
    +
    + +
    + +
    + +
    +
    + Use lists to organize related items: +
      +
    • Ordered lists: start with a number followed by a period.
      • +
    • Unordered lists: start with a -.
      • +
    • Begin each list item on a new line.
      • +
    +
    +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    + +
    + +
    + +
    + +
    +
    + +
    + +
    +
    + +
    + +
    +
    + +
    @code{ - private string pageUrl = "/markdown"; - private string title = "Blazor Markdown Component"; - private string description = "Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages."; - private string imageUrl = "https://i.imgur.com/FhN1caj.png"; + private const string pageUrl = RouteConstants.Demos_Markdown_Documentation; + private const string pageTitle = "Blazor Markdown"; + private const string pageDescription = "Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages."; + private const string metaTitle = "Blazor Markdown Component"; + private const string metaDescription = "Use Blazor Bootstrap Markdown component to add formatting, tables, images, and more to your project pages."; + private const string imageUrl = "https://i.imgur.com/FhN1caj.png"; } \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Modal/ModalDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Modal/ModalDocumentation.razor index ee779d579..dc325f92e 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Modal/ModalDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Modal/ModalDocumentation.razor @@ -1,72 +1,83 @@ -@page "/modals" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Modal

    -
    - Use Blazor Bootstrap modal component to add dialogs to your site for lightboxes, user notifications, or completely custom content. -
    + + @pageDescription + - - +
    + +
    - -
    Render different components dynamically within the modal without iterating through possible types or using conditional logic.
    -
    - If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value. -
    - -EmployeeDemoComponent1.razor - +
    +
    Render different components dynamically within the modal without iterating through possible types or using conditional logic.
    +
    + If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value. +
    + + EmployeeDemoComponent1.razor + +
    - -
    Event callbacks (EventCallback) can be passed in its parameter dictionary.
    -
    - In the following parent component example, the ShowDTMessage method assigns a string with the current time to message, and the value of message is rendered. - The parent component passes the callback method, ShowDTMessage in the parameter dictionary: -
      -
    • The string key is the callback method's name, OnClickCallback.
      • -
    • The object value is created by EventCallbackFactory.Create for the parent callback method, ShowDTMessage.
      • -
    -
    - -EmployeeDemoComponent2.razor - +
    +
    Event callbacks (EventCallback) can be passed in its parameter dictionary.
    +
    + In the following parent component example, the ShowDTMessage method assigns a string with the current time to message, and the value of message is rendered. + The parent component passes the callback method, ShowDTMessage in the parameter dictionary: +
      +
    • The string key is the callback method's name, OnClickCallback.
      • +
    • The object value is created by EventCallbackFactory.Create for the parent callback method, ShowDTMessage.
      • +
    +
    + + EmployeeDemoComponent2.razor + +
    - -
    When UseStaticBackdrop is set to true, the modal will not close when clicking outside it. Click the button below to try it.
    - +
    +
    When UseStaticBackdrop is set to true, the modal will not close when clicking outside it. Click the button below to try it.
    + +
    - -
    When modals become too long for the user’s viewport or device, they scroll independent of the page itself. Try the demo below to see what we mean.
    - +
    +
    When modals become too long for the user’s viewport or device, they scroll independent of the page itself. Try the demo below to see what we mean.
    + -
    You can also create a scrollable modal that allows scroll the modal body by adding IsScrollable="true".
    - +
    You can also create a scrollable modal that allows scroll the modal body by adding IsScrollable="true".
    + +
    - -
    Add IsVerticallyCentered="true" to vertically center the modal.
    - - +
    +
    Add IsVerticallyCentered="true" to vertically center the modal.
    + + +
    - -
    Modals have three optional sizes. These sizes kick in at certain breakpoints to avoid horizontal scrollbars on narrower viewports.
    - +
    +
    Modals have three optional sizes. These sizes kick in at certain breakpoints to avoid horizontal scrollbars on narrower viewports.
    + +
    - - +
    + +
    - -
    Blazor Bootstrap modal class exposes a few events for hooking into modal functionality.
    - +
    +
    Blazor Bootstrap modal class exposes a few events for hooking into modal functionality.
    + +
    @code { - private string pageUrl = "/modals"; - private string title = "Blazor Modal Component"; - private string description = "Use Blazor Bootstrap modal component to add dialogs to your site for lightboxes, user notifications, or completely custom content."; - private string imageUrl = "https://i.imgur.com/aWbURjD.jpg"; + private const string pageUrl = RouteConstants.Demos_Modal_Documentation; + private const string pageTitle = "Blazor Modal"; + private const string pageDescription = "Use Blazor Bootstrap modal component to add dialogs to your site for lightboxes, user notifications, or completely custom content."; + private const string metaTitle = "Blazor Modal Component"; + private const string metaDescription = "Use Blazor Bootstrap modal component to add dialogs to your site for lightboxes, user notifications, or completely custom content."; + private const string imageUrl = "https://i.imgur.com/aWbURjD.jpg"; } \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Offcanvas/OffcanvasDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Offcanvas/OffcanvasDocumentation.razor index 5fd4b28ef..b9f1dc6cc 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Offcanvas/OffcanvasDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Offcanvas/OffcanvasDocumentation.razor @@ -1,66 +1,75 @@ -@page "/offcanvas" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Offcanvas

    -
    - Build hidden sidebars into your project for navigation, shopping carts, and more with a offcanvas component. -
    + + @pageDescription + Similar to modals, only one offcanvas can be shown at a time. - - +
    + +
    - -
    Render different components dynamically within the offcanvas without iterating through possible types or using conditional logic.
    -
    - If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value. -
    - -EmployeeDemoComponent1.razor - +
    +
    Render different components dynamically within the offcanvas without iterating through possible types or using conditional logic.
    +
    + If dynamically-rendered components have component parameters, pass them as an IDictionary. The string is the parameter's name, and the object is the parameter's value. +
    + + EmployeeDemoComponent1.razor + +
    - -
    Event callbacks (EventCallback) can be passed in its parameter dictionary.
    -
    - In the following parent component example, the ShowDTMessage method assigns a string with the current time to message, and the value of message is rendered. - The parent component passes the callback method, ShowDTMessage in the parameter dictionary: -
      -
    • The string key is the callback method's name, OnClickCallback.
      • -
    • The object value is created by EventCallbackFactory.Create for the parent callback method, ShowDTMessage.
      • -
    -
    - -EmployeeDemoComponent2.razor - +
    +
    Event callbacks (EventCallback) can be passed in its parameter dictionary.
    +
    + In the following parent component example, the ShowDTMessage method assigns a string with the current time to message, and the value of message is rendered. + The parent component passes the callback method, ShowDTMessage in the parameter dictionary: +
      +
    • The string key is the callback method's name, OnClickCallback.
      • +
    • The object value is created by EventCallbackFactory.Create for the parent callback method, ShowDTMessage.
      • +
    +
    + + EmployeeDemoComponent2.razor + +
    - -
    Try the top, bottom, and left examples out below.
    - +
    +
    Try the top, bottom, and left examples out below.
    + +
    Default placement for the offcanvas component is right. - -
    When UseStaticBackdrop is set to true, the offcanvas will not close when clicking outside of it.
    - +
    +
    When UseStaticBackdrop is set to true, the offcanvas will not close when clicking outside of it.
    + +
    - -
    Set the size of the Offcanvas with the Size parameter. The default value is OffcanvasSize.Regular.
    - - +
    +
    Set the size of the Offcanvas with the Size parameter. The default value is OffcanvasSize.Regular.
    + + +
    - -
    Blazor Bootstrap offcanvas component exposes a few events for hooking into offcanvas functionality.
    - +
    +
    Blazor Bootstrap offcanvas component exposes a few events for hooking into offcanvas functionality.
    + +
    @code { - private string pageUrl = "/offcanvas"; - private string title = "Blazor Offcanvas Component"; - private string description = "Build hidden sidebars into your project for navigation, shopping carts, and more with Blazor Bootstrap offcanvas component."; - private string imageUrl = "https://i.imgur.com/1vNz5Ci.jpg"; + private const string pageUrl = RouteConstants.Demos_Offcanvas_Documentation; + private const string pageTitle = "Blazor Offcanvas"; + private const string pageDescription = "Build hidden sidebars into your project for navigation, shopping carts, and more with Blazor Bootstrap offcanvas component."; + private const string metaTitle = "Blazor Offcanvas Component"; + private const string metaDescription = "Build hidden sidebars into your project for navigation, shopping carts, and more with Blazor Bootstrap offcanvas component."; + private const string imageUrl = "https://i.imgur.com/1vNz5Ci.jpg"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Pagination/PaginationDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Pagination/PaginationDocumentation.razor index 867508b90..9f2acba7b 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Pagination/PaginationDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Pagination/PaginationDocumentation.razor @@ -1,39 +1,47 @@ -@page "/pagination" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Pagination

    -
    - Documentation and examples for showing pagination to indicate a series of related content exists across multiple pages. -
    + + @pageDescription + - -
    We use a large block of connected links for our pagination, making links hard to miss and easily scalable—all while providing large hit areas. Pagination is built with list HTML elements so screen readers can announce the number of available links.
    - +
    +
    We use a large block of connected links for our pagination, making links hard to miss and easily scalable—all while providing large hit areas. Pagination is built with list HTML elements so screen readers can announce the number of available links.
    + +
    - - +
    + +
    - - +
    + +
    - -
    Fancy larger or smaller pagination? Add Size="PaginationSize.Small" or Size="PaginationSize.Large" for additional sizes.
    - +
    +
    Fancy larger or smaller pagination? Add Size="PaginationSize.Small" or Size="PaginationSize.Large" for additional sizes.
    + +
    - - +
    + +
    - - +
    + +
    @code { - private string pageUrl = "/pagination"; - private string title = "Blazor Pagination Component"; - private string description = "Use Blazor Bootstrap pagination component to indicate a series of related content exists across multiple pages."; - private string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; + private const string pageUrl = RouteConstants.Demos_Pagination_Documentation; + private const string pageTitle = "Blazor Pagination"; + private const string pageDescription = "Use Blazor Bootstrap pagination component to indicate a series of related content exists across multiple pages."; + private const string metaTitle = "Blazor Pagination Component"; + private const string metaDescription = "Use Blazor Bootstrap pagination component to indicate a series of related content exists across multiple pages."; + private const string imageUrl = "https://i.imgur.com/SCbZVd4.jpg"; } \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor index 1fc391789..3a834d82f 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor @@ -1,35 +1,40 @@ -@page "/pdf-viewer" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor PDF Viewer

    -
    - The Blazor PDF Viewer component allows users to view PDF files directly in the browser, without relying on third-party browser tools or extensions. -
    + + @pageDescription + - - - - -
    - Set the Orientation parameter to Orientation.Landscape to change the default orientation from Portrait to Landscape. -
    - - - -
    PDF Viewer component supports base64 string as a URL.
    - - Url="@@string.Format("data:application/pdf;base64,{0}", pdfBase64String)" - - +
    + +
    + +
    +
    + Set the Orientation parameter to Orientation.Landscape to change the default orientation from Portrait to Landscape. +
    + +
    + +
    +
    PDF Viewer component supports base64 string as a URL.
    + + Url="@@string.Format("data:application/pdf;base64,{0}", pdfBase64String)" + + +
    @code { - private string pageUrl = "/pdf-viewer"; - private string title = "Blazor PDF Viewer Component"; - private string description = "The Blazor PDF Viewer component allows users to view PDF files directly in the browser, without relying on third-party browser tools or extensions."; - private string imageUrl = "https://i.imgur.com/7Vz9Efi.png"; + private const string pageUrl = RouteConstants.Demos_PDFViewer_Documentation; + private const string pageTitle = "Blazor PDF Viewer"; + private const string pageDescription = "The Blazor PDF Viewer component allows users to view PDF files directly in the browser, without relying on third-party browser tools or extensions."; + private const string metaTitle = "Blazor PDF Viewer Component"; + private const string metaDescription = "The Blazor PDF Viewer component allows users to view PDF files directly in the browser, without relying on third-party browser tools or extensions."; + private const string imageUrl = "https://i.imgur.com/7Vz9Efi.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Placeholders/PlaceholderDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Placeholders/PlaceholderDocumentation.razor index 895f57f62..e8e9b4c86 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Placeholders/PlaceholderDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Placeholders/PlaceholderDocumentation.razor @@ -1,43 +1,51 @@ -@page "/placeholders" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Placeholders

    -
    - Use Blazor Bootstrap loading placeholders for your components or pages to indicate something may still be loading. -
    + + @pageDescription + - -
    - Placeholders can be used to enhance the experience of your application. -
    +
    +
    + Placeholders can be used to enhance the experience of your application. +
    +
    - - +
    + +
    - -
    You can change the width through PlaceholderWidth, width utilities, or inline styles.
    - +
    +
    You can change the width through PlaceholderWidth, width utilities, or inline styles.
    + +
    - -
    By default, the placeholder uses currentColor. This can be overridden with the Color property of type enum.
    - +
    +
    By default, the placeholder uses currentColor. This can be overridden with the Color property of type enum.
    + +
    - -
    The size of placeholders are based on the typographic style of the parent element. Customize them with Size property of type enum.
    - +
    +
    The size of placeholders are based on the typographic style of the parent element. Customize them with Size property of type enum.
    + +
    - -
    Animate placeholders with PlaceholderAnimation.Glow or PlaceholderAnimation.Wave to better convey the perception of something being actively loaded.
    - +
    +
    Animate placeholders with PlaceholderAnimation.Glow or PlaceholderAnimation.Wave to better convey the perception of something being actively loaded.
    + +
    @code { - private string pageUrl = "/placeholders"; - private string title = "Blazor Placeholder Component"; - private string description = "Use Blazor Bootstrap loading placeholders for your components or pages to indicate something may still be loading."; - private string imageUrl = "https://i.imgur.com/JcLisSd.png"; + private const string pageUrl = RouteConstants.Demos_Placeholders_Documentation; + private const string pageTitle = "Blazor Placeholder"; + private const string pageDescription = "Use Blazor Bootstrap loading placeholders for your components or pages to indicate something may still be loading."; + private const string metaTitle = "Blazor Placeholder Component"; + private const string metaDescription = "Use Blazor Bootstrap loading placeholders for your components or pages to indicate something may still be loading."; + private const string imageUrl = "https://i.imgur.com/JcLisSd.png"; } \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor index e5c70fded..db704309b 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor @@ -1,46 +1,54 @@ -@page "/preload" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Preload

    -
    Indicate the loading state of a page with Blazor Bootstrap preload component.
    + + @pageDescription + - -
    -
      -
    • Add the Preload component to your current page or your layout page.
      • -
    • Inject PreloadService.
      • -
    • Call preloadService.Show() before you make any call to the API.
      • -
    • Call preloadService.Hide() after you get the response from the API.
      • -
    -
    - - -
    1. Add the Preload component in MainLayout.razor page as shown below.
    - -
    2. Inject PreloadService, then call the Show() and Hide() methods before and after the Service/API, respectively, as shown below.
    - - - -
    - - - -
    - Change the default spinner color by passing the SpinnerColor enum to the Show(...) method. - In the below example, we are using a global preload service, as shown in the above section. -
    - +
    +
    +
      +
    • Add the Preload component to your current page or your layout page.
      • +
    • Inject PreloadService.
      • +
    • Call preloadService.Show() before you make any call to the API.
      • +
    • Call preloadService.Hide() after you get the response from the API.
      • +
    +
    +
    + +
    +
    1. Add the Preload component in MainLayout.razor page as shown below.
    + +
    2. Inject PreloadService, then call the Show() and Hide() methods before and after the Service/API, respectively, as shown below.
    + +
    + +
    +
    + +
    + +
    +
    + Change the default spinner color by passing the SpinnerColor enum to the Show(...) method. + In the below example, we are using a global preload service, as shown in the above section. +
    + +
    @code { - private string pageUrl = "/preload"; - private string title = "Blazor Preload Component"; - private string description = "Indicate the loading state of a page with Blazor Bootstrap preload component."; - private string imageUrl = "https://i.imgur.com/2cPuqFa.png"; + private const string pageUrl = RouteConstants.Demos_Preload_Documentation; + private const string pageTitle = "Blazor Preload"; + private const string pageDescription = "Indicate the loading state of a page with Blazor Bootstrap preload component."; + private const string metaTitle = "Blazor Preload Component"; + private const string metaDescription = "Indicate the loading state of a page with Blazor Bootstrap preload component."; + private const string imageUrl = "https://i.imgur.com/2cPuqFa.png"; [Inject] PreloadService PreloadService { get; set; } = default!; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor index be31a0133..cfdbb758c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor @@ -1,55 +1,69 @@ -@page "/progress" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Progress

    -
    Documentation and examples for using the Blazor Progress component featuring support for stacked bars, animated backgrounds, and text labels.
    + + @pageDescription + - - +
    + +
    - -
    Add labels to your Blazor ProgressBar component using the Label parameter or by calling the SetLabel(...) method.
    - +
    +
    Add labels to your Blazor ProgressBar component using the Label parameter or by calling the SetLabel(...) method.
    + +
    - -
    Use IncreaseWidth() or DecreaseWidth() methods to increase or decrease the Blazor ProgressBar width.
    - +
    +
    Use IncreaseWidth() or DecreaseWidth() methods to increase or decrease the Blazor ProgressBar width.
    + +
    - -
    Set the height of the Blazor Progress by using the Height parameter. Height is measured in pixels.
    - +
    +
    Set the height of the Blazor Progress by using the Height parameter. Height is measured in pixels.
    + +
    - -
    Use the Color parameter or the SetColor(ProgressColor color) method to change the appearance of individual Blazor ProgressBar components.
    - +
    +
    Use the Color parameter or the SetColor(ProgressColor color) method to change the appearance of individual Blazor ProgressBar components.
    + +
    - -
    You can dynamically set the Blazor ProgressBar color by calling the SetColor() method.
    - +
    +
    You can dynamically set the Blazor ProgressBar color by calling the SetColor() method.
    + +
    - -
    Include multiple Blazor ProgressBar components in a Blazor Progress component if needed.
    - +
    +
    Include multiple Blazor ProgressBar components in a Blazor Progress component if needed.
    + +
    - -
    Add Type="ProgressType.Striped" to any Blazor ProgressBar component to apply a stripe.
    - +
    +
    Add Type="ProgressType.Striped" to any Blazor ProgressBar component to apply a stripe.
    + +
    - -
    The stripes can also be animated. Add Type="ProgressType.StripedAndAnimated" to the Blazor ProgressBar component to animate the stripes right to the left.
    - +
    +
    The stripes can also be animated. Add Type="ProgressType.StripedAndAnimated" to the Blazor ProgressBar component to animate the stripes right to the left.
    + +
    - - +
    + +
    @code { - private string pageUrl = "/progress"; - private string title = "Blazor Progress Component"; - private string description = "Documentation and examples for using Blazor Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels."; - private string imageUrl = "https://i.imgur.com/MK142lQ.png"; + private const string pageUrl = RouteConstants.Demos_Progress_Documentation; + private const string pageTitle = "Blazor Progress"; + private const string pageDescription = "Documentation and examples for using Blazor Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels."; + private const string metaTitle = "Blazor Progress Component"; + private const string metaDescription = "Documentation and examples for using Blazor Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels."; + private const string imageUrl = "https://i.imgur.com/MK142lQ.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor index 3bd21f10e..daded6f5a 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor @@ -1,29 +1,35 @@ -@page "/ribbon" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Ribbon

    -
    Documentation and examples for using the Blazor Bootstrap Ribbon component.
    + + @pageDescription + - -
    In the following example, you will see a ribbon similar to the one found in Outlook.
    - +
    +
    In the following example, you will see a ribbon similar to the one found in Outlook.
    + +
    - -
    In the following example, instead of icons like Bootstrap, Font Awesome, etc., we used PNG icons.
    - +
    +
    In the following example, instead of icons like Bootstrap, Font Awesome, etc., we used PNG icons.
    + - - NOTE: All the PNG icons used on this page are from Flaticon with a premium license only. - + + NOTE: All the PNG icons used on this page are from Flaticon with a premium license only. + +
    @code { - private string pageUrl = "/ribbon"; - private string title = "Blazor Ribbon Component"; - private string description = "Documentation and examples for using the Blazor Bootstrap Ribbon component."; - private string imageUrl = "https://i.imgur.com/LpZVLbF.png"; + private const string pageUrl = RouteConstants.Demos_Ribbon_Documentation; + private const string pageTitle = "Blazor Ribbon"; + private const string pageDescription = "Documentation and examples for using the Blazor Bootstrap Ribbon component."; + private const string metaTitle = "Blazor Ribbon Component"; + private const string metaDescription = "Documentation and examples for using the Blazor Bootstrap Ribbon component."; + private const string imageUrl = "https://i.imgur.com/LpZVLbF.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor index 075f4d2ea..68f5e2046 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor @@ -1,21 +1,22 @@ -@page "/script-loader" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Script Loader

    -
    - Documentation and examples for using the Blazor Bootstrap Script Loader component. -
    + + @pageDescription + - -
    - In the following example, the jQuery script is loaded using the Script Loader component. -
    - +
    +
    + In the following example, the jQuery script is loaded using the Script Loader component. +
    + +
    To test whether the jQuery script has been loaded successfully, run $('#script1')[0] in the browser console. @@ -23,17 +24,17 @@ Blazor Script Loader - Test whether the jQuery script has been loaded successfully - -
    - Blazor Bootstrap Script Loader component exposes two events. - - +
    +
    + Blazor Bootstrap Script Loader component exposes two events. +
    + - - + + @@ -42,18 +43,21 @@ - -
    Event Name Description
    OnError An event that is fired when a script loading error occurs.OnLoad An event that is fired when a script has been successfully loaded.
    -
    -
    - In the following example, an incorrect script source is specified. - This is why the OnError callback event is called, and the message is updated with the error message. -
    - + + +
    +
    + In the following example, an incorrect script source is specified. + This is why the OnError callback event is called, and the message is updated with the error message. +
    + + @code { - private string pageUrl = "/script-loader"; - private string title = "Blazor ScriptLoader Component"; - private string description = "Documentation and examples for using the Blazor Bootstrap ScriptLoader component."; - private string imageUrl = "https://i.imgur.com/sBiYPeQ.png"; + private const string pageUrl = RouteConstants.Demos_ScriptLoader_Documentation; + private const string pageTitle = "Blazor ScriptLoader"; + private const string pageDescription = "Documentation and examples for using the Blazor Bootstrap ScriptLoader component."; + private const string metaTitle = "Blazor ScriptLoader Component"; + private const string metaDescription = "Documentation and examples for using the Blazor Bootstrap ScriptLoader component."; + private const string imageUrl = "https://i.imgur.com/sBiYPeQ.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Services/ModalService/ModalServiceDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Services/ModalService/ModalServiceDocumentation.razor index 29c7ddd05..fa9cf45fb 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Services/ModalService/ModalServiceDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Services/ModalService/ModalServiceDocumentation.razor @@ -1,42 +1,55 @@ @page "/modal-service" -@title +@attribute [Route(pageUrl)] - + -

    Blazor Modal Service

    -
    Use Blazor Bootstrap modal service to show quick dialogs to your site for lightboxes, user notifications, or completely custom content.
    + + @pageDescription + - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - - +
    + +
    - -
    1. Add the Modal component in MainLayout.razor page as shown below.
    - +
    +
    1. Add the Modal component in MainLayout.razor page as shown below.
    + -
    2. Inject ModalService, then call the ShowAsync(...) method as shown below. ShowAsync method accepts ModalOption object as a parameter.
    - +
    2. Inject ModalService, then call the ShowAsync(...) method as shown below. ShowAsync method accepts ModalOption object as a parameter.
    + +
    @code { - private string pageUrl = "/modal-service"; - private string title = "Blazor Modal Service"; - private string description = "Use Blazor Bootstrap modal service to show quick dialogs to your site for lightboxes, user notifications, or completely custom content."; - private string imageUrl = "https://i.imgur.com/Tze7msN.png"; + private const string pageUrl = RouteConstants.Demos_ModalService_Documentation; + private const string pageTitle = "Blazor Modal Service"; + private const string pageDescription = "Use Blazor Bootstrap modal service to show quick dialogs to your site for lightboxes, user notifications, or completely custom content."; + private const string metaTitle = "Blazor Modal Service"; + private const string metaDescription = "Use Blazor Bootstrap modal service to show quick dialogs to your site for lightboxes, user notifications, or completely custom content."; + private const string imageUrl = "https://i.imgur.com/Tze7msN.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor index 3a2a9388e..68766d8b1 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor @@ -1,63 +1,76 @@ -@page "/sidebar" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Sidebar

    -
    - Use the Blazor Bootstrap Sidebar component to show consistent cross-browser, responsive and cross-device navigation links, additional information, or other content. -
    + + @pageDescription + - - - - -
    Use NavItem's Id and ParentId to set the parent-child relation.
    - -Currently, two levels of navigation are supported. For more than two levels, use the Sidebar2 component. - - -
    Set IconColor property to change the color.
    - - - -
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    - - - -
    Call ToggleSidebar() method to toggle the Sidebar to show the icons only.
    - - - -
    A badge is useful when displaying the application version, environment, or other information. Use the BadgeText parameter to show the badge.
    - - - -
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    - - - -
    Use the ImageSrc parameter to set the brand logo.
    - - - -
    Developers can customize the sidebar color by changing the CSS variables, as mentioned in the below example.
    - - - -
    Set the Class property of a NavItem to apply a custom CSS class.
    - - - -
    Set the Width parameter to change the sidebar width. Default value is 270px.
    - +
    + +
    + +
    +
    Use NavItem's Id and ParentId to set the parent-child relation.
    + + Currently, two levels of navigation are supported. For more than two levels, use the Sidebar2 component. +
    + +
    +
    Set IconColor property to change the color.
    + +
    + +
    +
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    + +
    + +
    +
    Call ToggleSidebar() method to toggle the Sidebar to show the icons only.
    + +
    + +
    +
    A badge is useful when displaying the application version, environment, or other information. Use the BadgeText parameter to show the badge.
    + +
    + +
    +
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    + +
    + +
    +
    Use the ImageSrc parameter to set the brand logo.
    + +
    + +
    +
    Developers can customize the sidebar color by changing the CSS variables, as mentioned in the below example.
    + +
    + +
    +
    Set the Class property of a NavItem to apply a custom CSS class.
    + +
    + +
    +
    Set the Width parameter to change the sidebar width. Default value is 270px.
    + +
    @code { - private string pageUrl = "/sidebar"; - private string title = "Blazor Sidebar Component"; - private string description = "Use the Blazor Bootstrap Sidebar component to show consistent cross-browser, responsive and cross-device navigation links, additional information, or other content."; - private string imageUrl = "https://i.imgur.com/d91Q9Zt.png"; + private const string pageUrl = RouteConstants.Demos_Sidebar_Documentation; + private const string pageTitle = "Blazor Sidebar"; + private const string pageDescription = "Use the Blazor Bootstrap Sidebar component to show consistent cross-browser, responsive and cross-device navigation links, additional information, or other content."; + private const string metaTitle = "Blazor Sidebar Component"; + private const string metaDescription = "Use the Blazor Bootstrap Sidebar component to show consistent cross-browser, responsive and cross-device navigation links, additional information, or other content."; + private const string imageUrl = "https://i.imgur.com/d91Q9Zt.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor index 7146edeef..cd3c48aaa 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor @@ -1,47 +1,56 @@ -@page "/sidebar2" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Sidebar2

    -
    - Use the Blazor Bootstrap Sidebar2 component to display consistent, cross-browser, and responsive navigation links that support more than two nested levels. -
    + + @pageDescription + - -
    - - - -
    - - -@* -
    Set IconColor property to change the color.
    - *@ - - -
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    - - - -
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    - - - -
    Use the ImageSrc parameter to set the brand logo.
    - - - -
    Set the Width parameter to change the sidebar width. Default value is 270px.
    - +
    +
    + +
    + +
    +
    + +
    + +@*
    +
    Set IconColor property to change the color.
    + +
    *@ + +
    +
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    + +
    + +
    +
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    + +
    + +
    +
    Use the ImageSrc parameter to set the brand logo.
    + +
    + +
    +
    Set the Width parameter to change the sidebar width. Default value is 270px.
    + +
    @code { - private string pageUrl = "sidebar2"; - private string title = "Blazor Sidebar2 Component"; - private string description = "Use the Blazor Bootstrap Sidebar2 component to display consistent, cross-browser, and responsive navigation links that support more than two nested levels."; - private string imageUrl = "https://i.imgur.com/U0l6wXo.png"; + private const string pageUrl = RouteConstants.Demos_Sidebar2_Documentation; + private const string pageTitle = "Blazor Sidebar2"; + private const string pageDescription = "Use the Blazor Bootstrap Sidebar2 component to display consistent, cross-browser, and responsive navigation links that support more than two nested levels."; + private const string metaTitle = "Blazor Sidebar2 Component"; + private const string metaDescription = "Use the Blazor Bootstrap Sidebar2 component to display consistent, cross-browser, and responsive navigation links that support more than two nested levels."; + private const string imageUrl = "https://i.imgur.com/U0l6wXo.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor index 15c7f96ef..7ae499349 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor @@ -1,79 +1,90 @@ -@page "/sortable-list" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Sortable List

    -
    - The Blazor Bootstrap Sortable List component, built on top of SortableJS, enables drag-and-drop reordering of lists. -
    + + @pageDescription + - -
    Before using the SortableList component, include the SortableJS script reference in your index.html/_Host.cshtml file.
    - - - -
    - - - -
    -

    To drag-and-drop an item from one list to the other and vice versa, set the Group parameter for all the lists. Providing the same Group name for the lists is what links them together.

    -

    In the below example, both lists use the same Group.

    -
    - - -
    - In the following example, all three lists use the same group. -
    - - - -
    - By setting Pull="SortableListPullMode.Clone", you can enable item cloning. Drag an item from one list to another to create a copy that stays in the original list. -
    - - - -
    - You can disable list sorting by setting AllowSorting="false". In the example below, the list cannot be sorted. -
    - - - -
    - The Handle parameter specifies the CSS class that denotes the drag handle. In the example below, items can only be sorted by dragging the handle itself. -
    - - - -
    - Try dragging the red-backgrounded item. You won't be able to, as it's disabled using the DisableItem parameter. -
    - - - - -@*
    - *@ - -
    Nested list sorting is not currently supported. We will add this feature in upcoming releases.
    -     - - -
    - - - -
    - +
    +
    Before using the SortableList component, include the SortableJS script reference in your index.html/_Host.cshtml file.
    + +
    + +
    +
    + +
    + +
    +
    +

    To drag-and-drop an item from one list to the other and vice versa, set the Group parameter for all the lists. Providing the same Group name for the lists is what links them together.

    +

    In the below example, both lists use the same Group.

    +
    + + +
    + In the following example, all three lists use the same group. +
    + +
    + +
    +
    + By setting Pull="SortableListPullMode.Clone", you can enable item cloning. Drag an item from one list to another to create a copy that stays in the original list. +
    + +
    + +
    +
    + You can disable list sorting by setting AllowSorting="false". In the example below, the list cannot be sorted. +
    + +
    + +
    +
    + The Handle parameter specifies the CSS class that denotes the drag handle. In the example below, items can only be sorted by dragging the handle itself. +
    + +
    + +
    +
    + Try dragging the red-backgrounded item. You won't be able to, as it's disabled using the DisableItem parameter. +
    + +
    + +
    + @*
    + *@ + +
    Nested list sorting is not currently supported. We will add this feature in upcoming releases.
    +     +
    + +
    +
    + +
    + +
    +
    + +
    @code { - private string pageUrl = "/sortable-list"; - private string title = "Blazor Sortable List Component"; - private string description = "The Blazor Bootstrap Sortable List component, built on top of SortableJS, enables drag-and-drop reordering of lists."; - private string imageUrl = "https://i.imgur.com/bfzP8Yi.png"; + private const string pageUrl = RouteConstants.Demos_SortableList_Documentation; + private const string pageTitle = "Blazor Sortable List"; + private const string pageDescription = "The Blazor Bootstrap Sortable List component, built on top of SortableJS, enables drag-and-drop reordering of lists."; + private const string metaTitle = "Blazor Sortable List Component"; + private const string metaDescription = "The Blazor Bootstrap Sortable List component, built on top of SortableJS, enables drag-and-drop reordering of lists."; + private const string imageUrl = "https://i.imgur.com/bfzP8Yi.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor index 8a6d1c216..a781a2259 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor @@ -1,65 +1,76 @@ -@page "/spinner" -@page "/spinners" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Spinners

    -
    - Visualize the loading state of a component or page using the Blazor Bootstrap Spinner component. -
    + + @pageDescription + - -
    Use the border spinners for a lightweight loading indicator.
    - +
    +
    Use the border spinners for a lightweight loading indicator.
    + +
    - -
    - The border spinner's border color inherits the element's color (currentColor). This means you can easily customize the spinner's color by changing the Color parameter on the standard spinner. -
    - +
    +
    + The border spinner's border color inherits the element's color (currentColor). This means you can easily customize the spinner's color by changing the Color parameter on the standard spinner. +
    + +
    - -
    - If you don't fancy a border spinner, switch to the grow spinner, while it doesn't technically spin, it does repeatedly grow! -
    - - +
    +
    + If you don't fancy a border spinner, switch to the grow spinner, while it doesn't technically spin, it does repeatedly grow! +
    + + +
    - -
    The loading dots are a special indicator for a lightweight loading indicator.
    - - +
    +
    The loading dots are a special indicator for a lightweight loading indicator.
    + + +
    - - - +
    +
    + +
    - - - - +
    +
    + + +
    - - +
    + +
    - - +
    + +
    - - - - +
    + + + +
    - - +
    + +
    @code{ - private string pageUrl = "/spinner"; - private string title = "Blazor Spinner Component"; - private string description = "Visualize the loading state of a component or page using the Blazor Bootstrap Spinner component."; - private string imageUrl = "https://i.imgur.com/G4wyEd6.png"; + private const string pageUrl = RouteConstants.Demos_Spinners_Documentation; + private const string pageTitle = "Blazor Spinner"; + private const string pageDescription = "Visualize the loading state of a component or page using the Blazor Bootstrap Spinner component."; + private const string metaTitle = "Blazor Spinner Component"; + private const string metaDescription = "Visualize the loading state of a component or page using the Blazor Bootstrap Spinner component."; + private const string imageUrl = "https://i.imgur.com/G4wyEd6.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor index 2814df67f..4c708bf0f 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor @@ -1,70 +1,80 @@ -@page "/tabs" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Tabs

    -
    - Documentation and examples for using Blazor Bootstrap Tabs components. -
    + + @pageDescription + - - - - -
    To create a fade-in effect for tabs, add the EnableFadeEffect="true" parameter. Additionally, set the IsActive="true" parameter on the first tab pane to display its content initially.
    - - - -
    To customize the tab title, use the TitleTemplate parameter, as demonstrated in the following example.
    - - - -
    Disable specific tabs by adding Disabled="true" parameter.
    - - - -
    To transform the tabs into pills, use the parameter NavStyle="NavStyle.Pills".
    - - - -
    Use the NavStyle="NavStyle.Underline" parameter to change the tabs to an underlined style.
    - - - -
    Display your tabs vertically by setting the NavStyle parameter to NavStyle.Vertical.
    - - - - - - - - - -
    You can activate individual tabs in several ways. Use predefined methods such as ShowFirstTabAsync, ShowLastTabAsync, ShowTabByIndexAsync, and ShowTabByNameAsync, as shown below.
    - - - -
    - When displaying a new tab, the events fire in the following sequence: -

    - 1. OnHiding (on the currently active tab)
    - 2. OnShowing (on the tab that is about to be displayed)
    - 3. OnHidden (on the previously active tab, which is the same one that triggered the OnHiding event)
    - 4. OnShown (on the newly activated tab that has just been displayed, which is the same one that triggered the OnShowing event)
    -

    - - +
    + +
    + +
    +
    To create a fade-in effect for tabs, add the EnableFadeEffect="true" parameter. Additionally, set the IsActive="true" parameter on the first tab pane to display its content initially.
    + +
    + +
    +
    To customize the tab title, use the TitleTemplate parameter, as demonstrated in the following example.
    + +
    + +
    +
    Disable specific tabs by adding Disabled="true" parameter.
    + +
    + +
    +
    To transform the tabs into pills, use the parameter NavStyle="NavStyle.Pills".
    + +
    + +
    +
    Use the NavStyle="NavStyle.Underline" parameter to change the tabs to an underlined style.
    + +
    + +
    +
    Display your tabs vertically by setting the NavStyle parameter to NavStyle.Vertical.
    + +
    + +
    + +
    + +
    + +
    + +
    +
    You can activate individual tabs in several ways. Use predefined methods such as ShowFirstTabAsync, ShowLastTabAsync, ShowTabByIndexAsync, and ShowTabByNameAsync, as shown below.
    + +
    + +
    +
    + When displaying a new tab, the events fire in the following sequence: +

    + 1. OnHiding (on the currently active tab)
    + 2. OnShowing (on the tab that is about to be displayed)
    + 3. OnHidden (on the previously active tab, which is the same one that triggered the OnHiding event)
    + 4. OnShown (on the newly activated tab that has just been displayed, which is the same one that triggered the OnShowing event)
    +

    +
    + - - + + @@ -81,35 +91,43 @@ - -
    Event Name Description
    OnHiding This event fires when a new tab is to be shown (and thus the previous active tab is to be hidden).OnShown This event fires on tab show after a tab has been shown.
    - - If no tab was already active, then the OnHiding and OnHidden events will not be fired. + + + + If no tab was already active, then the OnHiding and OnHidden events will not be fired. + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + +
    + + In the following example, we are deleting tabs dynamically. Ensure that the @@key parameter is added with unique value. -
    - - - - - - - - - - - - - - - - - In the following example, we are deleting tabs dynamically. Ensure that the @@key parameter is added with unique value. - - + + @code { - private string pageUrl = "/tabs"; - private string title = "Blazor Tabs Component"; - private string description = "Documentation and examples for using Blazor Bootstrap Tabs components."; - private string imageUrl = "https://i.imgur.com/ranwriJ.png"; + private const string pageUrl = RouteConstants.Demos_Tabs_Documentation; + private const string pageTitle = "Blazor Tabs"; + private const string pageDescription = "Documentation and examples for using Blazor Bootstrap Tabs components."; + private const string metaTitle = "Blazor Tabs Component"; + private const string metaDescription = "Documentation and examples for using Blazor Bootstrap Tabs components."; + private const string imageUrl = "https://i.imgur.com/ranwriJ.png"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor index d48488e8d..4aaf04b70 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor @@ -1,58 +1,70 @@ -@page "/toasts" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Toasts

    -
    Push notifications to your visitors with a toast, a lightweight and easily customizable alert message.
    + + @pageDescription +
    Blazor Toasts are lightweight notifications designed to mimic the push notifications that mobile and desktop operating systems have popularized. They're built with a flexbox, making it easy to align and position.
    - -
      -
    • Blazor Toasts will not hide automatically if you do not specify AutoHide="true".
      • -
    • Use global toasts service for the application instead of page level toasts.
      • -
    - - - - - - - - -
    Add AutoHide="true" parameter to hide the Blazor Toasts after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    - - - -
    Set AutoHide="true" property on ToastMessage to hide individual Blazor Toast message after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    -
    In the below example, AutoHide="false" for Danger and Warning messages.
    - - - -
    Change the Blazor Toasts placement according to your need. The default placement will be top right corner. Use the ToastsPlacement parameter to update the Blazor Toasts placement.
    - - - -
    Blazor Toasts component shows a maximum of 5 toasts by default. If you add a new toast to the existing list, the first toast gets deleted like FIFO (First In First Out). Change the maximum capacity according to your need by using the StackLength parameter.
    -
    In the below example, StackLength is set to 3. It shows a maximum of 3 toast messages at any time.
    - - - -
    1. Add the Toasts component in MainLayout.razor page as shown below.
    - - - Set the Toasts component parameters as per your requirement. - -
    2. Inject ToastService, then call the Notify(...) method as shown below.
    - +
    +
      +
    • Blazor Toasts will not hide automatically if you do not specify AutoHide="true".
      • +
    • Use global toasts service for the application instead of page level toasts.
      • +
    +
    + +
    + +
    + +
    + +
    + +
    +
    Add AutoHide="true" parameter to hide the Blazor Toasts after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    + +
    + +
    +
    Set AutoHide="true" property on ToastMessage to hide individual Blazor Toast message after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    +
    In the below example, AutoHide="false" for Danger and Warning messages.
    + +
    + +
    +
    Change the Blazor Toasts placement according to your need. The default placement will be top right corner. Use the ToastsPlacement parameter to update the Blazor Toasts placement.
    + +
    + +
    +
    Blazor Toasts component shows a maximum of 5 toasts by default. If you add a new toast to the existing list, the first toast gets deleted like FIFO (First In First Out). Change the maximum capacity according to your need by using the StackLength parameter.
    +
    In the below example, StackLength is set to 3. It shows a maximum of 3 toast messages at any time.
    + +
    + +
    +
    1. Add the Toasts component in MainLayout.razor page as shown below.
    + + + Set the Toasts component parameters as per your requirement. + +
    2. Inject ToastService, then call the Notify(...) method as shown below.
    + +
    @code { - private string pageUrl = "/toasts"; - private string title = "Blazor Toasts Component"; - private string description = "Push notifications to your visitors with a toast, a lightweight and easily customizable Blazor Bootstrap alert message."; - private string imageUrl = "https://i.imgur.com/VRglJqU.jpg"; + private const string pageUrl = RouteConstants.Demos_Toasts_Documentation; + private const string pageTitle = "Blazor Toasts"; + private const string pageDescription = "Push notifications to your visitors with a toast, a lightweight and easily customizable Blazor Bootstrap alert message."; + private const string metaTitle = "Blazor Toasts Component"; + private const string metaDescription = "Push notifications to your visitors with a toast, a lightweight and easily customizable Blazor Bootstrap alert message."; + private const string imageUrl = "https://i.imgur.com/VRglJqU.jpg"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor index a51a7f360..4acb07eec 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor @@ -1,51 +1,64 @@ -@page "/tooltips" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Tooltips

    + + @pageDescription + - - +
    + +
    - - +
    + +
    By default, Button supports tooltips via TooltipTitle and TooltipPlacement parameters. See Buttons - Tooltip. - - +
    + +
    @* START: Commented Examples *@ -@* - +@*
    + +
    - -*@ +
    + +
    *@ @* END: Commented Examples *@ - -
    - Blazor Bootstrap includes several predefined tooltip styles, each serving its own semantic purpose. - The Color parameter can be used to customize the color of the tooltip. -
    - +
    +
    + Blazor Bootstrap includes several predefined tooltip styles, each serving its own semantic purpose. + The Color parameter can be used to customize the color of the tooltip. +
    + +
    - - +
    + +
    - - +
    + +
    @code { - private string pageUrl = "/tooltips"; - private string title = "Blazor Tooltip Component"; - private string description = "Use Blazor Bootstrap tooltip component to add custom tooltips to your web pages."; - private string imageUrl = "https://i.imgur.com/PGlmZS3.jpg"; + private const string pageUrl = RouteConstants.Demos_Tooltips_Documentation; + private const string pageTitle = "Blazor Tooltip"; + private const string pageDescription = "Use Blazor Bootstrap tooltip component to add custom tooltips to your web pages."; + private const string metaTitle = "Blazor Tooltip Component"; + private const string metaDescription = "Use Blazor Bootstrap tooltip component to add custom tooltips to your web pages."; + private const string imageUrl = "https://i.imgur.com/PGlmZS3.jpg"; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Utils/ColorUtil/ColorUtilDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Utils/ColorUtil/ColorUtilDocumentation.razor index beb0a7057..4863b7427 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Utils/ColorUtil/ColorUtilDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Utils/ColorUtil/ColorUtilDocumentation.razor @@ -1,30 +1,33 @@ -@page "/utils/color-utility" +@attribute [Route(pageUrl)] -@title + - - -

    Blazor Bootstrap Color Utils

    -
    - For data visualization, you can use the predefined palettes ColorUtility.CategoricalSixColors for a 6-color palette and ColorUtility.CategoricalTwelveColors for a 12-color palette. - These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations. -
    + + @pageDescription + - -
    - -
    +
    +
    + +
    +
    - -
    - -
    +
    +
    + +
    +
    @code { - private string pageUrl = "/utils/color-utility"; - private string title = "Blazor Bootstrap Color Utils"; - private string description = "For data visualization, you can use the predefined palettes ColorBuilder.CategoricalTwelveColors for a 12-color palette and ColorBuilder.CategoricalSixColors for a 6-color palette. These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations."; - private string imageUrl = "https://i.imgur.com/VRglJqU.jpg"; // TODO: update this + private const string pageUrl = RouteConstants.Demos_ColorUtils_Documentation; + private const string pageTitle = "Blazor Bootstrap Color Utils"; + private const string pageDescription = "For data visualization, you can use the predefined palettes ColorBuilder.CategoricalTwelveColors for a 12-color palette and ColorBuilder.CategoricalSixColors for a 6-color palette. These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations."; + private const string metaTitle = "Blazor Bootstrap Color Utils"; + private const string metaDescription = "For data visualization, you can use the predefined palettes ColorBuilder.CategoricalTwelveColors for a 12-color palette and ColorBuilder.CategoricalSixColors for a 6-color palette. These palettes offer a range of distinct and visually appealing colors that can be applied to represent different categories or data elements in your visualizations."; + private const string imageUrl = "https://i.imgur.com/VRglJqU.jpg"; // TODO: update this } diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor new file mode 100644 index 000000000..75b7c5e49 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor @@ -0,0 +1,7 @@ +@namespace BlazorBootstrap.Demo.RCL +@inherits BlazorBootstrapComponentBase + +

    @Heading

    +
    + @LeadSection +
    \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor.cs new file mode 100644 index 000000000..ba7cf6e5c --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/PageHero.razor.cs @@ -0,0 +1,10 @@ +namespace BlazorBootstrap.Demo.RCL; + +public partial class PageHero : BlazorBootstrapComponentBase +{ + [Parameter] + public string? Heading { get; set; } + + [Parameter] + public RenderFragment? LeadSection { get; set; } +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor similarity index 94% rename from BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor rename to BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor index d848b80f4..f9f3f2edc 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor @@ -1,4 +1,7 @@ @namespace BlazorBootstrap.Demo.RCL +@inherits BlazorBootstrapComponentBase + +@title diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor.cs similarity index 57% rename from BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor.cs rename to BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor.cs index 330ecbad4..9a87ef0f6 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/MetaTags.razor.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/PageMetaTags.razor.cs @@ -1,43 +1,39 @@ namespace BlazorBootstrap.Demo.RCL; -public partial class MetaTags : ComponentBase +public partial class PageMetaTags : BlazorBootstrapComponentBase { - #region Members - - private string siteName => "Blazor Bootstrap"; - - private string title => $"{Title} | {siteName}"; - - private string url => $"https://demos.blazorbootstrap.com{PageUrl}"; - - #endregion - - #region Methods - - #endregion - - #region Properties + #region Properties, Indexers /// - /// Meta Url. - /// Example: /alerts, /modal + /// Meta Description. /// - [Parameter] public string PageUrl { get; set; } = null!; + [Parameter] + public string Description { get; set; } = null!; /// - /// Page Title / Meta Title. + /// Meta Image Url. /// - [Parameter] public string Title { get; set; } = null!; + [Parameter] + public string ImageUrl { get; set; } = null!; /// - /// Meta Description. + /// Meta Url. + /// Example: /alerts, /modal /// - [Parameter] public string Description { get; set; } = null!; + [Parameter] + public string PageUrl { get; set; } = null!; + + private string siteName => "Blazor Bootstrap"; + + private string title => $"{Title} | {siteName}"; /// - /// Meta Image Url. + /// Page Title / Meta Title. /// - [Parameter] public string ImageUrl { get; set; } = null!; + [Parameter] + public string Title { get; set; } = null!; + + private string url => $"https://demos.blazorbootstrap.com{PageUrl}"; #endregion } diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor new file mode 100644 index 000000000..a6e237442 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor @@ -0,0 +1,48 @@ +@namespace BlazorBootstrap.Demo.RCL +@inherits BlazorBootstrapComponentBase + +
    + + @if (Size == HeadingSize.H2) + { +

    + @Name + # +

    + } + else if (Size == HeadingSize.H3) + { +

    + @Name + # +

    + } + else if (Size == HeadingSize.H4) + { +

    + @Name + # +

    + } + else if (Size == HeadingSize.H5) + { +
    + @Name + # +
    + } + else if (Size == HeadingSize.H6) + { +
    + @Name + # +
    + } + + @ChildContent + +
    \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor.cs new file mode 100644 index 000000000..115d9a92c --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor.cs @@ -0,0 +1,56 @@ +namespace BlazorBootstrap.Demo.RCL; + +public partial class Section : BlazorBootstrapComponentBase +{ + #region Members + + private string? headerClassNames => "mt-4 mb-3"; + + private string link => $"{PageUrl}#{Link}".Trim().ToLower(); + + #endregion + + #region Methods + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender && IsRenderComplete) + { + await Task.Delay(200); + await JSRuntime.InvokeVoidAsync("navigateToHeading"); + } + + await base.OnAfterRenderAsync(firstRender); + } + + private async Task OnClick() + { + await JSRuntime.InvokeVoidAsync("navigateToHeading"); + } + + #endregion + + #region Properties, Indexers + + /// + /// Gets or sets the child content. + /// + /// + /// Default value is . + /// + [Parameter] + public RenderFragment? ChildContent { get; set; } + + [Parameter] + public bool IsMobile { get; set; } = true; + + [Parameter] public string? Link { get; set; } + + [Parameter] public string? Name { get; set; } + + [Parameter] public string? PageUrl { get; set; } + + [Parameter] public HeadingSize Size { get; set; } + + #endregion +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor deleted file mode 100644 index 92f3d714c..000000000 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor +++ /dev/null @@ -1,32 +0,0 @@ -@namespace BlazorBootstrap.Demo.RCL - -@if (Size == HeadingSize.H2) -{ -

    - @Text# -

    -} -else if (Size == HeadingSize.H3) -{ -

    - @Text# -

    -} -else if (Size == HeadingSize.H4) -{ -

    - @Text# -

    -} -else if (Size == HeadingSize.H5) -{ -
    - @Text# -
    -} -else if (Size == HeadingSize.H6) -{ -
    - @Text# -
    -} diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor.cs deleted file mode 100644 index 56a57ff6b..000000000 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/SectionHeading.razor.cs +++ /dev/null @@ -1,39 +0,0 @@ -namespace BlazorBootstrap.Demo.RCL; -public partial class SectionHeading : ComponentBase -{ - #region Members - - private string link => $"{PageUrl}#{HashTagName}".Trim().ToLower(); - - #endregion - - #region Methods - - protected override async Task OnAfterRenderAsync(bool firstRender) - { - await Task.Delay(200); - await JS.InvokeVoidAsync("navigateToHeading"); - await base.OnAfterRenderAsync(firstRender); - } - - private async Task OnClick() - { - await JS.InvokeVoidAsync("navigateToHeading"); - } - - #endregion - - #region Properties - - [Parameter] public HeadingSize Size { get; set; } - - [Parameter] public string Text { get; set; } = null!; - - [Parameter] public string PageUrl { get; set; } = null!; - - [Parameter] public string HashTagName { get; set; } = null!; - - [Inject] protected IJSRuntime JS { get; set; } = null!; - - #endregion -} diff --git a/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs b/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs new file mode 100644 index 000000000..077fae2a8 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs @@ -0,0 +1,104 @@ +namespace BlazorBootstrap.Demo.RCL; + +public static class RouteConstants +{ + public const string Blog_Prefix = "/blog"; + public const string Docs_Prefix = "/docs"; + public const string Demos_Prefix = ""; + + #region Demos + + // Getting Started + public const string Demos_GettingStarted_Documentation = Demos_Prefix + "/getting-started"; + + // AI + public const string Demos_AI_Prefix = Demos_Prefix + "/ai"; + public const string Demos_AI_Chat_Documentation = Demos_AI_Prefix + "/open-ai-chat"; + + // Content + public const string Demos_Icons_Documentation = Demos_Prefix + "/icons"; + public const string Demos_Images_Documentation = Demos_Prefix + "/images"; + + // Forms + public const string Demos_Forms_Prefix = Demos_Prefix + "/form"; + public const string Demos_AutoComplete_Documentation = Demos_Forms_Prefix + "/autocomplete"; + public const string Demos_CurrencyInput_Documentation = Demos_Forms_Prefix + "/currency-input"; + public const string Demos_DateInput_Documentation = Demos_Forms_Prefix + "/date-input"; + public const string Demos_NumberInput_Documentation = Demos_Forms_Prefix + "/number-input"; + public const string Demos_RangeInput_Documentation = Demos_Forms_Prefix + "/range-input"; + public const string Demos_Switch_Documentation = Demos_Forms_Prefix + "/switch"; + public const string Demos_TimeInput_Documentation = Demos_Forms_Prefix + "/time-input"; + + // Components + public const string Demos_Accordion_Documentation = Demos_Prefix + "/accordion"; + public const string Demos_Alerts_Documentation = Demos_Prefix + "/alerts"; + public const string Demos_Badge_Documentation = Demos_Prefix + "/badge"; + public const string Demos_Breadcrumb_Documentation = Demos_Prefix + "/breadcrumb"; + public const string Demos_Buttons_Documentation = Demos_Prefix + "/buttons"; + public const string Demos_Callout_Documentation = Demos_Prefix + "/callout"; + public const string Demos_Card_Documentation = Demos_Prefix + "/card"; + public const string Demos_Carousel_Documentation = Demos_Prefix + "/carousel"; + public const string Demos_Charts_Documentation = Demos_Prefix + "/charts"; + public const string Demos_Collapse_Documentation = Demos_Prefix + "/collapse"; + public const string Demos_ConfirmDialog_Documentation = Demos_Prefix + "/confirm-dialog"; + public const string Demos_Dropdown_Documentation = Demos_Prefix + "/dropdown"; + public const string Demos_GoogleMap_Documentation = Demos_Prefix + "/google-map"; + + #region Grid + public const string Demos_Grid_Prefix = Demos_Prefix + "/grid"; + public const string Demos_Grid_Overview_Documentation = Demos_Grid_Prefix + "/overview"; + public const string Demos_Grid_Alignment_Documentation = Demos_Grid_Prefix + "/alignment"; + public const string Demos_Grid_CustomCSSClass_Documentation = Demos_Grid_Prefix + "/custom-css-class"; + public const string Demos_Grid_DataBinding_Documentation = Demos_Grid_Prefix + "/data-binding"; + public const string Demos_Grid_DetailView_Documentation = Demos_Grid_Prefix + "/detail-view"; + public const string Demos_Grid_Events_Documentation = Demos_Grid_Prefix + "/events"; + public const string Demos_Grid_Filters_Documentation = Demos_Grid_Prefix + "/filters"; + public const string Demos_Grid_FixedHeader_Documentation = Demos_Grid_Prefix + "/fixed-header"; + public const string Demos_Grid_FreezeColumns_Documentation = Demos_Grid_Prefix + "/freeze-columns"; + public const string Demos_Grid_Settings_Documentation = Demos_Grid_Prefix + "/settings"; + public const string Demos_Grid_NestedGrid_Documentation = Demos_Grid_Prefix + "/nested-grid"; + public const string Demos_Grid_Paging_Documentation = Demos_Grid_Prefix + "/paging"; + public const string Demos_Grid_Selection_Documentation = Demos_Grid_Prefix + "/selection"; + public const string Demos_Grid_Sorting_Documentation = Demos_Grid_Prefix + "/sorting"; + public const string Demos_Grid_Translations_Documentation = Demos_Grid_Prefix + "/translations"; + public const string Demos_Grid_OtherExamples_Documentation = Demos_Grid_Prefix + "/other"; + #endregion Grid + + public const string Demos_Markdown_Documentation = Demos_Prefix + "/markdown"; + public const string Demos_Modal_Documentation = Demos_Prefix + "/modals"; + public const string Demos_Offcanvas_Documentation = Demos_Prefix + "/offcanvas"; + public const string Demos_Pagination_Documentation = Demos_Prefix + "/pagination"; + public const string Demos_PDFViewer_Documentation = Demos_Prefix + "/pdf-viewer"; + public const string Demos_Placeholders_Documentation = Demos_Prefix + "/placeholders"; + public const string Demos_Preload_Documentation = Demos_Prefix + "/preload"; + public const string Demos_Progress_Documentation = Demos_Prefix + "/progress"; + public const string Demos_Ribbon_Documentation = Demos_Prefix + "/ribbon"; + public const string Demos_ScriptLoader_Documentation = Demos_Prefix + "/script-loader"; + public const string Demos_Sidebar_Documentation = Demos_Prefix + "/sidebar"; + public const string Demos_Sidebar2_Documentation = Demos_Prefix + "/sidebar2"; + public const string Demos_SortableList_Documentation = Demos_Prefix + "/sortable-list"; + public const string Demos_Spinners_Documentation = Demos_Prefix + "/spinners"; + public const string Demos_Tabs_Documentation = Demos_Prefix + "/tabs"; + public const string Demos_Toasts_Documentation = Demos_Prefix + "/toasts"; + public const string Demos_Tooltips_Documentation = Demos_Prefix + "/tooltips"; + + // Data Visualization + public const string Demos_Charts_Prefix = Demos_Prefix + "/charts"; + public const string Demos_BarChart_Documentation = Demos_Charts_Prefix + "/bar-chart"; + public const string Demos_DoughnutChart_Documentation = Demos_Charts_Prefix + "/doughnut-chart"; + public const string Demos_LineChart_Documentation = Demos_Charts_Prefix + "/line-chart"; + public const string Demos_PieChart_Documentation = Demos_Charts_Prefix + "/pie-chart"; + public const string Demos_PolarAreaChart_Documentation = Demos_Charts_Prefix + "/polar-area-chart"; + public const string Demos_RadarChart_Documentation = Demos_Charts_Prefix + "/radar-chart"; + public const string Demos_ScatterChart_Documentation = Demos_Charts_Prefix + "/scatter-chart"; + + // Services + public const string Demos_Services_Prefix = Demos_Prefix + "/services"; + public const string Demos_ModalService_Documentation = Demos_Services_Prefix + "/modal-service"; + + // Utilities + public const string Demos_Utils_Prefix = Demos_Prefix + "/utils"; + public const string Demos_ColorUtils_Documentation = Demos_Utils_Prefix + "/color-utility"; + + #endregion +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Enums/LanguageCode.cs b/BlazorBootstrap.Demo.RCL/Enums/LanguageCode.cs similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Shared/Enums/LanguageCode.cs rename to BlazorBootstrap.Demo.RCL/Enums/LanguageCode.cs diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Extensions/EnumExtensions.cs b/BlazorBootstrap.Demo.RCL/Extensions/EnumExtensions.cs similarity index 100% rename from BlazorBootstrap.Demo.RCL/Components/Shared/Extensions/EnumExtensions.cs rename to BlazorBootstrap.Demo.RCL/Extensions/EnumExtensions.cs diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js b/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js index 2414e3695..8067973d7 100644 --- a/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js +++ b/BlazorBootstrap.Demo.RCL/wwwroot/js/blazorbootstrap.demo.rcl.js @@ -1,4 +1,9 @@ -async function copyToClipboard(text, dotNetHelper) { +/** + * Copies the provided text to the clipboard and invokes .NET methods based on the success or failure of the operation. + * @param {string} text - The text to be copied to the clipboard. + * @param {object} dotNetHelper - The .NET helper object to invoke methods on. + */ +async function copyToClipboard(text, dotNetHelper) { let isCopied = true; try { @@ -15,6 +20,10 @@ ); } +/** + * Highlights all code blocks on the page using the Prism.js library. + * If the Prism.js custom class plugin is available, it prefixes all classes with 'prism-'. + */ function highlightCode() { if (Prism) { Prism.plugins.customClass.prefix('prism-'); @@ -22,6 +31,10 @@ function highlightCode() { } }; +/** + * Scrolls the page to the heading element specified by the URL hash. + * If a hash is present in the URL, it finds the corresponding element by ID and scrolls it into view. + */ function navigateToHeading() { if (window.location.hash) { // get hash tag in URL @@ -34,78 +47,11 @@ function navigateToHeading() { } } -// THEMES -const STORAGE_KEY = "blazorbootstrap-theme"; -const DEFAULT_THEME = "light"; -const SYSTEM_THEME = "system"; - -const state = { - chosenTheme: SYSTEM_THEME, // light|dark|system - appliedTheme: DEFAULT_THEME // light|dark -}; - -const showActiveTheme = () => { - let $themeIndicator = document.querySelector(".blazorbootstrap-theme-indicator>i"); - if ($themeIndicator) { - if (state.appliedTheme === "light") { - $themeIndicator.className = "bi bi-sun-fill"; - } else if (state.appliedTheme === "dark") { - $themeIndicator.className = "bi bi-moon-stars-fill"; - } else { - $themeIndicator.className = "bi bi-circle-half"; - } - } - - let $themeSwitchers = document.querySelectorAll(".blazorbootstrap-theme-item>button"); - if ($themeSwitchers) { - $themeSwitchers.forEach((el) => { - const bsThemeValue = el.dataset.bsThemeValue; - const iEl = el.querySelector(".bi.bi-check2"); - if (state.chosenTheme === bsThemeValue) { - el.classList.add("active"); - if (iEl) - iEl.classList.remove("d-none"); - } else { - el.classList.remove("active"); - if (iEl) - iEl.classList.add("d-none"); - } - }); - } -}; - -function setTheme(theme, save = true) { - state.chosenTheme = theme; - state.appliedTheme = theme; - - if (theme === SYSTEM_THEME) { - state.appliedTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; - } - - document.documentElement.setAttribute("data-bs-theme", state.appliedTheme); - if (save) { - window.localStorage.setItem(STORAGE_KEY, state.chosenTheme); - } - showActiveTheme(); - updateDemoCodeThemeCss(state.appliedTheme); -}; - -function initializeTheme() { - const localTheme = window.localStorage.getItem(STORAGE_KEY); - if (localTheme) { - setTheme(localTheme, false); - } else { - setTheme(SYSTEM_THEME); - } -} - -window - .matchMedia("(prefers-color-scheme: dark)") - .addEventListener("change", (event) => { - const theme = event.matches ? "dark" : "light"; - setTheme(theme); - }); - +/** + * Update the theme of the demo code + * @param {} theme + * @returns {} + */ function updateDemoCodeThemeCss(theme) { if (theme === "dark") { let prismThemeLightLinkEl = document.getElementById('prismThemeLightLink'); diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor index ebbd52192..cc8ff6d09 100644 --- a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor +++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor @@ -1,24 +1,26 @@ @namespace BlazorBootstrap @inherits BlazorBootstrapComponentBase - -
      -
    • - -
      • -
    • - -
      • -
    • - -
      • -
    \ No newline at end of file + \ No newline at end of file diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs index 07ef82085..40a4ec141 100644 --- a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs +++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor.cs @@ -2,26 +2,54 @@ public partial class ThemeSwitcher : BlazorBootstrapComponentBase { + #region Fields and Constants + + private DotNetObjectReference? objRef; + + #endregion + #region Methods protected override async Task OnAfterRenderAsync(bool firstRender) { if (firstRender) - await ThemeSwitcherJsInterop.InitializeAsync(); + await ThemeSwitcherJsInterop.InitializeAsync(objRef); await base.OnAfterRenderAsync(firstRender); } - internal Task SetAutoTheme() => ThemeSwitcherJsInterop.SetAutoThemeAsync(); + protected override Task OnInitializedAsync() + { + objRef ??= DotNetObjectReference.Create(this); - internal Task SetDarkTheme() => ThemeSwitcherJsInterop.SetDarkThemeAsync(); + return base.OnInitializedAsync(); + } - internal Task SetLightTheme() => ThemeSwitcherJsInterop.SetLightThemeAsync(); + [JSInvokable] + public async Task OnThemeChangedJS(string themeName) + { + if (OnThemeChanged.HasDelegate) + await OnThemeChanged.InvokeAsync(themeName); + } + + internal Task SetAutoTheme() => ThemeSwitcherJsInterop.SetAutoThemeAsync(objRef); + + internal Task SetDarkTheme() => ThemeSwitcherJsInterop.SetDarkThemeAsync(objRef); + + internal Task SetLightTheme() => ThemeSwitcherJsInterop.SetLightThemeAsync(objRef); #endregion #region Properties, Indexers + protected override string? ClassNames => BuildClassNames(Class, (BootstrapClass.Dropdown, true)); + + /// + /// Fired when the theme is changed. + /// + [Parameter] + public EventCallback OnThemeChanged { get; set; } + [Inject] private ThemeSwitcherJsInterop ThemeSwitcherJsInterop { get; set; } = default!; #endregion diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs index 6bef7b702..e9e6f1d14 100644 --- a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs +++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcherJsInterop.cs @@ -28,22 +28,22 @@ public async ValueTask DisposeAsync() } } - public async Task InitializeAsync() + public async Task InitializeAsync(DotNetObjectReference? objRef) { var module = await moduleTask.Value; - await module.InvokeVoidAsync("initializeTheme"); + await module.InvokeVoidAsync("initializeTheme", objRef); } - internal Task SetAutoThemeAsync() => SetThemeAsync("system"); + internal Task SetAutoThemeAsync(DotNetObjectReference? objRef) => SetThemeAsync(objRef, "system"); - internal Task SetDarkThemeAsync() => SetThemeAsync("dark"); + internal Task SetDarkThemeAsync(DotNetObjectReference? objRef) => SetThemeAsync(objRef, "dark"); - internal Task SetLightThemeAsync() => SetThemeAsync("light"); + internal Task SetLightThemeAsync(DotNetObjectReference? objRef) => SetThemeAsync(objRef, "light"); - internal async Task SetThemeAsync(string themeName) + internal async Task SetThemeAsync(DotNetObjectReference? objRef, string themeName) { var module = await moduleTask.Value; - await module.InvokeVoidAsync("setTheme", themeName); + await module.InvokeVoidAsync("setTheme", objRef, themeName); } #endregion diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js b/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js index 67e9c9710..f3e89690c 100644 --- a/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js +++ b/blazorbootstrap/wwwroot/blazor.bootstrap.theme-switcher.js @@ -1,6 +1,8 @@ // THEMES const STORAGE_KEY = "blazorbootstrap-theme"; const DEFAULT_THEME = "light"; +const LIGHT_THEME = "light"; +const DARK_THEME = "dark"; const SYSTEM_THEME = "system"; const state = { @@ -11,9 +13,14 @@ const state = { const showActiveTheme = () => { let $themeIndicator = document.querySelector(".blazorbootstrap-theme-indicator>i"); if ($themeIndicator) { - if (state.appliedTheme === "light") { + + if (state.chosenTheme === SYSTEM_THEME + && state.chosenTheme !== state.appliedTheme) { + $themeIndicator.className = "bi bi-circle-half"; + } + else if (state.appliedTheme === LIGHT_THEME) { $themeIndicator.className = "bi bi-sun-fill"; - } else if (state.appliedTheme === "dark") { + } else if (state.appliedTheme === DARK_THEME) { $themeIndicator.className = "bi bi-moon-stars-fill"; } else { $themeIndicator.className = "bi bi-circle-half"; @@ -38,12 +45,12 @@ const showActiveTheme = () => { } }; -export function setTheme(theme, save = true) { +export function setTheme(dotNetHelper, theme, save = true) { state.chosenTheme = theme; state.appliedTheme = theme; if (theme === SYSTEM_THEME) { - state.appliedTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; + state.appliedTheme = window.matchMedia(`(prefers-color-scheme: ${DARK_THEME})`).matches ? DARK_THEME : LIGHT_THEME; } document.documentElement.setAttribute("data-bs-theme", state.appliedTheme); @@ -51,49 +58,24 @@ export function setTheme(theme, save = true) { window.localStorage.setItem(STORAGE_KEY, state.chosenTheme); } showActiveTheme(); - updateDemoCodeThemeCss(state.appliedTheme); + if (dotNetHelper) + dotNetHelper.invokeMethodAsync("OnThemeChangedJS", state.appliedTheme); }; -export function initializeTheme() { +export function initializeTheme(dotNetHelper) { const localTheme = window.localStorage.getItem(STORAGE_KEY); if (localTheme) { - setTheme(localTheme, false); + setTheme(dotNetHelper, localTheme, false); } else { - setTheme(SYSTEM_THEME); + setTheme(dotNetHelper, SYSTEM_THEME); } // register events window - .matchMedia("(prefers-color-scheme: dark)") + .matchMedia(`(prefers-color-scheme: ${DARK_THEME})`) .addEventListener("change", (event) => { - const theme = event.matches ? "dark" : "light"; - setTheme(theme); + //const theme = event.matches ? DARK_THEME : LIGHT_THEME; + //setTheme(theme); + setTheme(dotNetHelper, SYSTEM_THEME); }); } - -export function updateDemoCodeThemeCss(theme) { - if (theme === "dark") { - let prismThemeLightLinkEl = document.getElementById('prismThemeLightLink'); - if (prismThemeLightLinkEl) - prismThemeLightLinkEl?.remove(); - - let prismThemeDarkLinkEl = document.createElement("link"); - prismThemeDarkLinkEl.setAttribute("rel", "stylesheet"); - prismThemeDarkLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vsc-dark-plus.min.css"); - prismThemeDarkLinkEl.setAttribute("id", "prismThemeDarkLink"); - - document.head.append(prismThemeDarkLinkEl); - } - else if (theme === "light") { - let prismThemeDarkLinkEl = document.getElementById('prismThemeDarkLink'); - if (prismThemeDarkLinkEl) - prismThemeDarkLinkEl?.remove(); - - let prismThemeLightLinkEl = document.createElement("link"); - prismThemeLightLinkEl.setAttribute("rel", "stylesheet"); - prismThemeLightLinkEl.setAttribute("href", "/_content/BlazorBootstrap.Demo.RCL/css/prism-vs.min.css"); - prismThemeLightLinkEl.setAttribute("id", "prismThemeLightLink"); - - document.head.append(prismThemeLightLinkEl); - } -} \ No newline at end of file From 183a4b2d363ea5790fbd1a91e99af9a0a2dc2b07 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Sat, 9 Nov 2024 20:12:53 +0530 Subject: [PATCH 14/23] Main layout docs update (#934) Main layout docs update --- .../Components/Layout/MainLayout.razor | 2 +- .../Layout/server/Layout_Server_Demo_01.razor | 55 +++++++------- .../Layout_WebAssembly_Demo_01.razor | 45 ++++++------ .../Components/Shared/Section.razor | 20 +++--- .../wwwroot/css/blazorbootstrap.demo.rcl.css | 10 +-- .../Layout/BlazorBootstrapLayout.razor.cs | 13 +++- blazorbootstrap/wwwroot/blazor.bootstrap.css | 2 +- .../docs/02-layout/getting-started-server.mdx | 72 ++++++++++--------- .../02-layout/getting-started-webassembly.mdx | 62 ++++++++-------- 9 files changed, 150 insertions(+), 131 deletions(-) diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor index bd03d2ce0..a3a30cad5 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor @@ -1,7 +1,7 @@ @namespace BlazorBootstrap.Demo.RCL @inherits MainLayoutBase - +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/Layout_Server_Demo_01.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/Layout_Server_Demo_01.razor index 9ea046b01..4a3f063dc 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/Layout_Server_Demo_01.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/server/Layout_Server_Demo_01.razor @@ -1,31 +1,32 @@ @inherits LayoutComponentBase -
    - - - -
    -
    - About -
    - -
    -
    - @Body -
    -
    -
    - -
    + + + + + + + + + + + @Body + + + + Footer links... + + @code { - private Sidebar sidebar = default!; private IEnumerable navItems = default!; - private async Task SidebarDataProvider(SidebarDataProviderRequest request) + private async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request) { if (navItems is null) navItems = GetNavItems(); @@ -36,11 +37,11 @@ private IEnumerable GetNavItems() { navItems = new List - { - new NavItem { Id = "1", Href = "/", IconName = IconName.HouseDoorFill, Text = "Home", Match=NavLinkMatch.All}, - new NavItem { Id = "2", Href = "/counter", IconName = IconName.PlusSquareFill, Text = "Counter"}, - new NavItem { Id = "3", Href = "/fetchdata", IconName = IconName.Table, Text = "Fetch Data"}, - }; + { + new NavItem { Id = "1", Href = "/", IconName = IconName.HouseDoorFill, Text = "Home", Match=NavLinkMatch.All}, + new NavItem { Id = "2", Href = "/counter", IconName = IconName.PlusSquareFill, Text = "Counter"}, + new NavItem { Id = "3", Href = "/fetchdata", IconName = IconName.Table, Text = "Fetch Data"}, + }; return navItems; } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/Layout_WebAssembly_Demo_01.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/Layout_WebAssembly_Demo_01.razor index 9ea046b01..fbcfc9f07 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/Layout_WebAssembly_Demo_01.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Layout/webassembly/Layout_WebAssembly_Demo_01.razor @@ -1,31 +1,32 @@ @inherits LayoutComponentBase -
    - - - -
    -
    - About -
    - -
    -
    - @Body -
    -
    -
    - -
    + + + + + + + + + + + @Body + + + + Footer links... + + @code { - private Sidebar sidebar = default!; private IEnumerable navItems = default!; - private async Task SidebarDataProvider(SidebarDataProviderRequest request) + private async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request) { if (navItems is null) navItems = GetNavItems(); diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor index a6e237442..f09066915 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Section.razor @@ -10,36 +10,36 @@ @if (Size == HeadingSize.H2) {

    - @Name - # + @Name + #

    } else if (Size == HeadingSize.H3) {

    - @Name - # + @Name + #

    } else if (Size == HeadingSize.H4) {

    - @Name - # + @Name + #

    } else if (Size == HeadingSize.H5) {
    - @Name - # + @Name + #
    } else if (Size == HeadingSize.H6) {
    - @Name - # + @Name + #
    } diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css index 2a6ff1fc8..bfde67c9d 100644 --- a/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css +++ b/BlazorBootstrap.Demo.RCL/wwwroot/css/blazorbootstrap.demo.rcl.css @@ -254,28 +254,28 @@ h1:focus-visible { /*** END: home ***/ -.anchor-link { +.bb-anchor-link { font-weight: 400; color: rgba(13,110,253,0.5); transition: color 0.15s ease-in-out; opacity: 0; - padding-left: 0.375em; + /*padding-left: 0.375em;*/ text-decoration: none; -webkit-font-smoothing: antialiased; } @media (prefers-reduced-motion: reduce) { - .anchor-link { + .bb-anchor-link { transition: none } } -.anchor-link:focus, .anchor-link:hover { +.bb-anchor-link:focus, .bb-anchor-link:hover { color: #0d6efd; text-decoration: none } -:hover > .anchor-link, .anchor-link:focus { +:hover > .bb-anchor-link, .bb-anchor-link:focus { opacity: 1; } diff --git a/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs index f9dc56f8c..7d2abbc16 100644 --- a/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs +++ b/blazorbootstrap/Components/Layout/BlazorBootstrapLayout.razor.cs @@ -13,10 +13,19 @@ public partial class BlazorBootstrapLayout : BlazorBootstrapLayoutComponentBase [Parameter] public RenderFragment? FooterSection { get; set; } [Parameter] public string? FooterSectionCssClass { get; set; } = "bg-body-tertiary"; protected string? FooterSectionCssClassNames => BuildClassNames(FooterSectionCssClass, ("bb-footer p-4", true)); - + [Parameter] public RenderFragment? HeaderSection { get; set; } [Parameter] public string? HeaderSectionCssClass { get; set; } = "d-flex justify-content-end"; - protected string? HeaderSectionCssClassNames => BuildClassNames(HeaderSectionCssClass, ("bb-top-row px-4", true)); + + protected string? HeaderSectionCssClassNames => + BuildClassNames( + HeaderSectionCssClass, + ("bb-top-row", true), + ("bb-top-row-sticky", StickyHeader), + ("px-4", true) + ); + + [Parameter] public bool StickyHeader { get; set; } [Parameter] public RenderFragment? SidebarSection { get; set; } diff --git a/blazorbootstrap/wwwroot/blazor.bootstrap.css b/blazorbootstrap/wwwroot/blazor.bootstrap.css index 047277b75..9551b0072 100644 --- a/blazorbootstrap/wwwroot/blazor.bootstrap.css +++ b/blazorbootstrap/wwwroot/blazor.bootstrap.css @@ -458,7 +458,7 @@ table > tbody > tr > td:is(.freeze-column-right).freeze-column-active { flex-direction: row !important; } - .bb-top-row { + .bb-top-row-sticky { position: sticky; top: 0; z-index: 1; diff --git a/docs/docs/02-layout/getting-started-server.mdx b/docs/docs/02-layout/getting-started-server.mdx index bbbc10942..10a74853a 100644 --- a/docs/docs/02-layout/getting-started-server.mdx +++ b/docs/docs/02-layout/getting-started-server.mdx @@ -17,8 +17,8 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o Assuming you followed the getting started docs for the initial setup. -1. **Blazor WebAssembly Project:** Follow the [getting started](/getting-started/blazor-webassembly) steps for the initial setup. -1. **Blazor Server Project:** Follow the [getting started](/getting-started/blazor-server) steps for the initial setup. +1. **Blazor WebAssembly Project:** Follow the [getting started](/getting-started/blazor-webassembly-net-8) steps for the initial setup. +1. **Blazor Server Project:** Follow the [getting started](/getting-started/blazor-webapp-server-global-net-8) steps for the initial setup. ## Steps @@ -31,33 +31,33 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. ```cshtml {} showLineNumbers @inherits LayoutComponentBase -
    - - - -
    -
    - About -
    - -
    -
    - @Body -
    -
    -
    - -
    + + + + + + + + + + + @Body + + + + Footer links... + + @code { - private Sidebar sidebar = default!; private IEnumerable navItems = default!; - private async Task SidebarDataProvider(SidebarDataProviderRequest request) + private async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request) { if (navItems is null) navItems = GetNavItems(); @@ -68,11 +68,11 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. private IEnumerable GetNavItems() { navItems = new List - { - new NavItem { Id = "1", Href = "/", IconName = IconName.HouseDoorFill, Text = "Home", Match=NavLinkMatch.All}, - new NavItem { Id = "2", Href = "/counter", IconName = IconName.PlusSquareFill, Text = "Counter"}, - new NavItem { Id = "3", Href = "/fetchdata", IconName = IconName.Table, Text = "Fetch Data"}, - }; + { + new NavItem { Id = "1", Href = "/", IconName = IconName.HouseDoorFill, Text = "Home", Match=NavLinkMatch.All}, + new NavItem { Id = "2", Href = "/counter", IconName = IconName.PlusSquareFill, Text = "Counter"}, + new NavItem { Id = "3", Href = "/fetchdata", IconName = IconName.Table, Text = "Fetch Data"}, + }; return navItems; } @@ -81,11 +81,9 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. ## Starter templates -### .NET 6 - -1. [Blazor Bootstrap - Blazor WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET6.BlazorWebAssemblyApp) +### .NET 8 - Blazor Bootstrap - Blazor WebAssembly App +TODO ### .NET 7 @@ -96,3 +94,9 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. 1. [Blazor Bootstrap - Blazor Empty WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET7.BlazorWebAssemblyAppEmpty) Blazor Bootstrap - Blazor Empty WebAssembly App + +### .NET 6 + +1. [Blazor Bootstrap - Blazor WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET6.BlazorWebAssemblyApp) + + Blazor Bootstrap - Blazor WebAssembly App diff --git a/docs/docs/02-layout/getting-started-webassembly.mdx b/docs/docs/02-layout/getting-started-webassembly.mdx index 5fbb53fd3..ccfdf49b0 100644 --- a/docs/docs/02-layout/getting-started-webassembly.mdx +++ b/docs/docs/02-layout/getting-started-webassembly.mdx @@ -17,8 +17,8 @@ Get started with the Enterprise-class Blazor Bootstrap Component library built o Assuming you followed the getting started docs for the initial setup. -1. **Blazor WebAssembly Project:** Follow the [getting started](/getting-started/blazor-webassembly) steps for the initial setup. -1. **Blazor Server Project:** Follow the [getting started](/getting-started/blazor-server) steps for the initial setup. +1. **Blazor WebAssembly Project:** Follow the [getting started](/getting-started/blazor-webassembly-net-8) steps for the initial setup. +1. **Blazor Server Project:** Follow the [getting started](/getting-started/blazor-webapp-server-global-net-8) steps for the initial setup. ## Steps @@ -31,33 +31,33 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. ```cshtml {} showLineNumbers @inherits LayoutComponentBase -
    - - - -
    -
    - About -
    - -
    -
    - @Body -
    -
    -
    - -
    + + + + + + + + + + + @Body + + + + Footer links... + + @code { - private Sidebar sidebar = default!; private IEnumerable navItems = default!; - private async Task SidebarDataProvider(SidebarDataProviderRequest request) + private async Task Sidebar2DataProvider(Sidebar2DataProviderRequest request) { if (navItems is null) navItems = GetNavItems(); @@ -81,11 +81,9 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. ## Starter templates -### .NET 6 - -1. [Blazor Bootstrap - Blazor WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET6.BlazorWebAssemblyApp) +### .NET 8 - Blazor Bootstrap - Blazor WebAssembly App +TODO ### .NET 7 @@ -96,3 +94,9 @@ Remove all the CSS content from the **Shared/MainLayout.razor.css** file. 1. [Blazor Bootstrap - Blazor Empty WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET7.BlazorWebAssemblyAppEmpty) Blazor Bootstrap - Blazor Empty WebAssembly App + +### .NET 6 + +1. [Blazor Bootstrap - Blazor WebAssembly App](https://github.com/vikramlearning/blazorbootstrap-starter-templates/tree/master/src/BlazorBootstrap.Templates.Starter/NET6.BlazorWebAssemblyApp) + + Blazor Bootstrap - Blazor WebAssembly App From 13009ecf5f0866355f2b5e226d744108abdcba05 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Sat, 9 Nov 2024 21:11:23 +0530 Subject: [PATCH 15/23] PDF Viewer demos update (#936) * PDF demos updated --- .../PdfViewer/PdfViewerDocumentation.razor | 5 +++ .../PdfViewer_Demo_04_RTL_Doc_Example.razor | 16 +++++++++ .../wwwroot/docs/persian-sample-doc-919.pdf | Bin 0 -> 220692 bytes docs/docs/05-components/pdf-viewer.mdx | 33 ++++++++++++++++-- 4 files changed, 51 insertions(+), 3 deletions(-) create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewer_Demo_04_RTL_Doc_Example.razor create mode 100644 BlazorBootstrap.Demo.RCL/wwwroot/docs/persian-sample-doc-919.pdf diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor index 3a834d82f..c959b8d54 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewerDocumentation.razor @@ -30,6 +30,11 @@ +
    + Below screenshot is added for demo purposes only. For additional info, refer to this link. + Blazor Bootstrap: Blazor PDF Viewer Component - RTL doc +
    + @code { private const string pageUrl = RouteConstants.Demos_PDFViewer_Documentation; private const string pageTitle = "Blazor PDF Viewer"; diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewer_Demo_04_RTL_Doc_Example.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewer_Demo_04_RTL_Doc_Example.razor new file mode 100644 index 000000000..54b56c55d --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/PdfViewer/PdfViewer_Demo_04_RTL_Doc_Example.razor @@ -0,0 +1,16 @@ +

    @eventLog

    + + + +@code { + private string eventLog { get; set; } = $"Last event: ..., CurrentPage: 0, TotalPages: 0"; + + private void OnDocumentLoaded(PdfViewerEventArgs args) + => eventLog = $"Last event: OnDocumentLoaded, CurrentPage: {args.CurrentPage}, TotalPages: {args.TotalPages}"; + + private void OnPageChanged(PdfViewerEventArgs args) + => eventLog = $"Last event: OnPageChanged, CurrentPage: {args.CurrentPage}, TotalPages: {args.TotalPages}"; +} \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/wwwroot/docs/persian-sample-doc-919.pdf b/BlazorBootstrap.Demo.RCL/wwwroot/docs/persian-sample-doc-919.pdf new file mode 100644 index 0000000000000000000000000000000000000000..1ed55ff8504147bee8cc68dfbc6c7a55917e8648 GIT binary patch literal 220692 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 z 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

    Rnnkc^~-47lU|Z>hOZ0}Tt2 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 yYNdZy-1kY2kJ)TZqlK6J4fl+TBWYt!rC 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

    OX()Wl|=;s&a49)f9IuQ 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 literal 0 HcmV?d00001 diff --git a/docs/docs/05-components/pdf-viewer.mdx b/docs/docs/05-components/pdf-viewer.mdx index f51339d04..1c72d59d0 100644 --- a/docs/docs/05-components/pdf-viewer.mdx +++ b/docs/docs/05-components/pdf-viewer.mdx @@ -56,7 +56,7 @@ The Blazor PDF Viewer component allows users to view PDF files directly in the b } ``` -[See demo here.](https://demos.blazorbootstrap.com/pagination#examples) +[See demo here.](https://demos.blazorbootstrap.com/pdf-viewer#examples) ### Orientation @@ -85,7 +85,7 @@ Set the `Orientation` parameter to `Orientation.Landscape` to change the default } ``` -[See demo here.](https://demos.blazorbootstrap.com/pagination#orientation) +[See demo here.](https://demos.blazorbootstrap.com/pdf-viewer#orientation) ### Base64String @@ -120,4 +120,31 @@ Pdf Viewer component supports **base64** string as a URL. } ``` -[See demo here.](https://demos.blazorbootstrap.com/pagination#base64-string) +[See demo here.](https://demos.blazorbootstrap.com/pdf-viewer#base64-string) + +### RTL doc + +Blazor Bootstrap: Blazor PDF Viewer Component - RTL doc + +:::info +Below screenshot is added for demo purposes only. For additional info, refer to this link. +::: + +```cshtml {} showLineNumbers +

    @eventLog

    + + + +@code { + private string eventLog { get; set; } = $"Last event: ..., CurrentPage: 0, TotalPages: 0"; + + private void OnDocumentLoaded(PdfViewerEventArgs args) + => eventLog = $"Last event: OnDocumentLoaded, CurrentPage: {args.CurrentPage}, TotalPages: {args.TotalPages}"; + + private void OnPageChanged(PdfViewerEventArgs args) + => eventLog = $"Last event: OnPageChanged, CurrentPage: {args.CurrentPage}, TotalPages: {args.TotalPages}"; +} +``` From 8ed7ada60218a5ea33492a2abdf474d9f614d1c3 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Sun, 10 Nov 2024 19:03:47 +0530 Subject: [PATCH 16/23] Grid detail view - example updates (#937) --- .../Grid_Demo_14_A_DetailView.razor | 41 +++---- docs/docs/05-components/grid.mdx | 112 +++++++++++------- 2 files changed, 87 insertions(+), 66 deletions(-) diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor index a17d058ce..a0193f0a8 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Grid/14-detail-view/Grid_Demo_14_A_DetailView.razor @@ -1,16 +1,17 @@  + AllowDetailView="true" + AllowSorting="true"> - + @context.Id - + @context.Name - + @context.IsActive @@ -44,25 +45,25 @@ @code { private List products = new List { - new Product { Id = 1, Name = "Product 1", IsActive = true }, - new Product { Id = 2, Name = "Product 2", IsActive = true }, - new Product { Id = 3, Name = "Product 3", IsActive = true }, - new Product { Id = 4, Name = "Product 4", IsActive = true }, - new Product { Id = 5, Name = "Product 5", IsActive = true } + new Product { Id = 10, Name = "Product 10", IsActive = true }, + new Product { Id = 20, Name = "Product 20", IsActive = true }, + new Product { Id = 30, Name = "Product 30", IsActive = true }, + new Product { Id = 40, Name = "Product 40", IsActive = true }, + new Product { Id = 50, Name = "Product 50", IsActive = true } }; private List ingredients = new List { - new Ingredient { Id = 105, ProductId = 1, Description = "Ingredient 1", Unit = "UNIT1", Quantity = 350 }, - new Ingredient { Id = 106, ProductId = 1, Description = "Ingredient 2", Unit = "UNIT1", Quantity = 600 }, - new Ingredient { Id = 107, ProductId = 1, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, - new Ingredient { Id = 108, ProductId = 1, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, - new Ingredient { Id = 109, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, - new Ingredient { Id = 110, ProductId = 2, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, - new Ingredient { Id = 111, ProductId = 1, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, - new Ingredient { Id = 112, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, - new Ingredient { Id = 113, ProductId = 4, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, - new Ingredient { Id = 114, ProductId = 5, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, - new Ingredient { Id = 115, ProductId = 2, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 10105, ProductId = 10, Description = "Ingredient 1", Unit = "UNIT1", Quantity = 350 }, + new Ingredient { Id = 10106, ProductId = 10, Description = "Ingredient 2", Unit = "UNIT1", Quantity = 600 }, + new Ingredient { Id = 10107, ProductId = 10, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 10108, ProductId = 10, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20109, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 20110, ProductId = 20, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 10111, ProductId = 10, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20112, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 40113, ProductId = 40, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 50114, ProductId = 50, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20115, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, }; private IEnumerable GetIngredients(int productId) => ingredients.Where(i => i.ProductId == productId); diff --git a/docs/docs/05-components/grid.mdx b/docs/docs/05-components/grid.mdx index 0435972fc..72d339839 100644 --- a/docs/docs/05-components/grid.mdx +++ b/docs/docs/05-components/grid.mdx @@ -3686,55 +3686,52 @@ Automatically hides the paging controls when the grid item count is less than or ### Detail View -To enable detail view, set the `AllowDetailView` parameter to true. In the following example, existing `` tags are nested under `` tag to distinguish them from ``. +To enable detail view, set the `AllowDetailView` parameter to **true**. In the following example, existing `` tags are nested under `` tag to distinguish them from ``. -Blazor Bootstrap: Grid Component - Detail View +Blazor Bootstrap: Grid Component - Detail View -```cshtml {4,24-45} showLineNumbers - + Data="products" + AllowDetailView="true" + AllowSorting="true"> - + @context.Id - + @context.Name - - @context.Designation - - - @context.DOJ - - + @context.IsActive - -
    -
    Id
    -
    @context.Id
    -
    -
    -
    Name
    -
    @context.Name
    -
    -
    -
    Designation
    -
    @context.Designation
    -
    -
    -
    DOJ
    -
    @context.DOJ
    -
    -
    -
    IsActive
    -
    @context.IsActive
    -
    + + + + + + + @emp1.Id + + + @emp1.Description + + + @emp1.Unit + + + @emp1.Quantity + + + + +     @@ -3742,22 +3739,45 @@ To enable detail view, set the `AllowDetailView` parameter to true. In the follo ```cshtml {} showLineNumbers @code { - private List employees = new List { - new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true }, - new Employee1 { Id = 103, Name = "Bob", Designation = "Senior DevOps Engineer", DOJ = new DateOnly(1985, 1, 5), IsActive = true }, - new Employee1 { Id = 106, Name = "John", Designation = "Data Engineer", DOJ = new DateOnly(1995, 4, 17), IsActive = true }, - new Employee1 { Id = 104, Name = "Pop", Designation = "Associate Architect", DOJ = new DateOnly(1985, 6, 8), IsActive = false }, - new Employee1 { Id = 105, Name = "Ronald", Designation = "Senior Data Engineer", DOJ = new DateOnly(1991, 8, 23), IsActive = true } + private List products = new List { + new Product { Id = 10, Name = "Product 10", IsActive = true }, + new Product { Id = 20, Name = "Product 20", IsActive = true }, + new Product { Id = 30, Name = "Product 30", IsActive = true }, + new Product { Id = 40, Name = "Product 40", IsActive = true }, + new Product { Id = 50, Name = "Product 50", IsActive = true } }; - public record class Employee1 + private List ingredients = new List { + new Ingredient { Id = 10105, ProductId = 10, Description = "Ingredient 1", Unit = "UNIT1", Quantity = 350 }, + new Ingredient { Id = 10106, ProductId = 10, Description = "Ingredient 2", Unit = "UNIT1", Quantity = 600 }, + new Ingredient { Id = 10107, ProductId = 10, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 10108, ProductId = 10, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20109, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 20110, ProductId = 20, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 10111, ProductId = 10, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20112, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + new Ingredient { Id = 40113, ProductId = 40, Description = "Ingredient 3", Unit = "UNIT2", Quantity = 13 }, + new Ingredient { Id = 50114, ProductId = 50, Description = "Ingredient 4", Unit = "UNIT3", Quantity = 25 }, + new Ingredient { Id = 20115, ProductId = 20, Description = "Ingredient 5", Unit = "UNIT1", Quantity = 750 }, + }; + + private IEnumerable GetIngredients(int productId) => ingredients.Where(i => i.ProductId == productId); + + public record class Product { public int Id { get; set; } public string? Name { get; set; } - public string? Designation { get; set; } - public DateOnly DOJ { get; set; } public bool IsActive { get; set; } } + + public record class Ingredient + { + public int Id { get; set; } + public int ProductId { get; set; } + public string? Description { get; set; } + public string? Unit { get; set; } + public int Quantity { get; set; } + } } ``` @@ -3846,7 +3866,7 @@ To create a nested grid, we first need to enable the detail view. To enable the     ``` -```cshtml {} showLineNumbers +```cshtml {24} showLineNumbers @code { private List employees = new List { new Employee1 { Id = 107, Name = "Alice", Designation = "AI Engineer", DOJ = new DateOnly(1998, 11, 17), IsActive = true }, From 15bee385c3823dfe90145d4f27b95d717c9b2938 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Wed, 20 Nov 2024 10:50:40 +0530 Subject: [PATCH 17/23] .NET 9 support (#947) * .NET 9 support added. --- .github/workflows/static-web-app.yml | 4 ++-- .github/workflows/web-app.yml | 4 ++-- .../Client/BlazorBootstrap.Demo.Hosted.Client.csproj | 8 ++++---- .../Client/wwwroot/appsettings.json | 3 ++- .../Server/BlazorBootstrap.Demo.Hosted.Server.csproj | 6 +++--- .../BlazorBootstrap.Demo.RCL.csproj | 6 +++--- .../Components/Layout/EmptyLayout.razor | 1 + .../Components/Layout/MainLayout.razor | 4 ++++ .../Components/Layout/MainLayoutBase.cs | 3 +++ .../Components/Layout/MainLayoutBaseFooter.razor | 4 ++++ .../Components/Layout/MainLayoutBaseFooter.razor.cs | 1 + .../BlazorBootstrap.Demo.Server.csproj | 2 +- BlazorBootstrap.Demo.Server/appsettings.json | 1 + .../BlazorBootstrap.Demo.WebAssembly.csproj | 8 ++++---- .../wwwroot/appsettings.json | 1 + blazorbootstrap/BlazorBootstrap.csproj | 11 ++++++++--- 16 files changed, 44 insertions(+), 23 deletions(-) diff --git a/.github/workflows/static-web-app.yml b/.github/workflows/static-web-app.yml index 515688aa6..e46c71b42 100644 --- a/.github/workflows/static-web-app.yml +++ b/.github/workflows/static-web-app.yml @@ -29,13 +29,13 @@ jobs: - name: Setup .NET Core SDK uses: actions/setup-dotnet@v1 with: - dotnet-version: '8.0.x' + dotnet-version: '9.0.x' - name: Build And Deploy id: builddeploy uses: Azure/static-web-apps-deploy@v1 with: - dotnet-version: '8.0.x' + dotnet-version: '9.0.x' azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_GRAY_WAVE_0E4848710 }} skip_deploy_on_missing_secrets: true repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments) diff --git a/.github/workflows/web-app.yml b/.github/workflows/web-app.yml index c4b0bba7a..e2f0fa20f 100644 --- a/.github/workflows/web-app.yml +++ b/.github/workflows/web-app.yml @@ -19,10 +19,10 @@ jobs: steps: - uses: actions/checkout@v2 - - name: Set up .NET 8.0.x + - name: Set up .NET 9.0.x uses: actions/setup-dotnet@v1 with: - dotnet-version: '8.0.x' + dotnet-version: '9.0.x' include-prerelease: false - name: Build diff --git a/BlazorBootstrap.Demo.Hosted/Client/BlazorBootstrap.Demo.Hosted.Client.csproj b/BlazorBootstrap.Demo.Hosted/Client/BlazorBootstrap.Demo.Hosted.Client.csproj index abccfb1d1..80e41a737 100644 --- a/BlazorBootstrap.Demo.Hosted/Client/BlazorBootstrap.Demo.Hosted.Client.csproj +++ b/BlazorBootstrap.Demo.Hosted/Client/BlazorBootstrap.Demo.Hosted.Client.csproj @@ -1,15 +1,15 @@  - net8.0 + net9.0 enable enable - - - + + + diff --git a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json index a55633d1d..5ba5d432f 100644 --- a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json +++ b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json @@ -13,5 +13,6 @@ "github_issues": "//github.com/vikramlearning/blazorbootstrap/issues", "github_discussions": "//github.com/vikramlearning/blazorbootstrap/discussions", "stackoverflow": "//stackoverflow.com/questions/tagged/blazor-bootstrap" - } + }, + "dotNetVersion": "9.0.0" } \ No newline at end of file diff --git a/BlazorBootstrap.Demo.Hosted/Server/BlazorBootstrap.Demo.Hosted.Server.csproj b/BlazorBootstrap.Demo.Hosted/Server/BlazorBootstrap.Demo.Hosted.Server.csproj index 3f05c8a0a..f377d8fcd 100644 --- a/BlazorBootstrap.Demo.Hosted/Server/BlazorBootstrap.Demo.Hosted.Server.csproj +++ b/BlazorBootstrap.Demo.Hosted/Server/BlazorBootstrap.Demo.Hosted.Server.csproj @@ -1,13 +1,13 @@ - + - net8.0 + net9.0 enable enable - + diff --git a/BlazorBootstrap.Demo.RCL/BlazorBootstrap.Demo.RCL.csproj b/BlazorBootstrap.Demo.RCL/BlazorBootstrap.Demo.RCL.csproj index 3db87cbfd..3a3a921dc 100644 --- a/BlazorBootstrap.Demo.RCL/BlazorBootstrap.Demo.RCL.csproj +++ b/BlazorBootstrap.Demo.RCL/BlazorBootstrap.Demo.RCL.csproj @@ -1,7 +1,7 @@  - net8.0 + net9.0 enable enable @@ -11,8 +11,8 @@ - - + + diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor index 03fd94491..fd5e67f14 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor @@ -81,6 +81,7 @@ Designed and built with all the love in the world by the Blazor Bootstrap team with the help of our contributors.
  • Code licensed Apache License 2.0.
  • Currently @Version.
    • + @if (!string.IsNullOrWhiteSpace(DotNetVersion)) + { +
  • Powered by @DotNetVersion
    • + }
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs index 38c42ce5f..68ae5a072 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBase.cs @@ -3,6 +3,7 @@ public class MainLayoutBase : LayoutComponentBase { internal string version = default!; + internal string dotNetVersion = default!; internal string docsUrl = default!; internal string blogUrl = default!; internal string githubUrl = default!; @@ -23,6 +24,7 @@ public class MainLayoutBase : LayoutComponentBase protected override void OnInitialized() { version = $"v{Configuration["version"]}"; // example: v0.6.1 + dotNetVersion = $".NET {Configuration["dotNetVersion"]}"; // example: 9.0.0 docsUrl = $"{Configuration["urls:docs"]}"; blogUrl = $"{Configuration["urls:blog"]}"; githubUrl = $"{Configuration["urls:github"]}"; @@ -46,6 +48,7 @@ internal virtual async Task Sidebar2DataProvider(Sid internal virtual IEnumerable GetNavItems() => new List(); public string Version => version; + public string DotNetVersion => dotNetVersion; public string DocsUrl => docsUrl; public string BlogUrl => blogUrl; public string GithubUrl => githubUrl; diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor index c35d8360e..de129b136 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor @@ -13,6 +13,10 @@
  • Designed and built with all the love in the world by the Blazor Bootstrap team with the help of our contributors.
  • Code licensed Apache License 2.0.
  • Currently @Version.
    • + @if (!string.IsNullOrWhiteSpace(DotNetVersion)) + { +
  • Powered by @DotNetVersion
    • + }
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor.cs index 2bd88276f..57e9eab0c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayoutBaseFooter.razor.cs @@ -3,6 +3,7 @@ public partial class MainLayoutBaseFooter : ComponentBase { [Parameter] public string? Version { get; set; } + [Parameter] public string? DotNetVersion { get; set; } [Parameter] public string? DocsUrl { get; set; } [Parameter] public string? BlogUrl { get; set; } [Parameter] public string? GithubUrl { get; set; } diff --git a/BlazorBootstrap.Demo.Server/BlazorBootstrap.Demo.Server.csproj b/BlazorBootstrap.Demo.Server/BlazorBootstrap.Demo.Server.csproj index 62358c3c9..f60b2a192 100644 --- a/BlazorBootstrap.Demo.Server/BlazorBootstrap.Demo.Server.csproj +++ b/BlazorBootstrap.Demo.Server/BlazorBootstrap.Demo.Server.csproj @@ -1,7 +1,7 @@ - net8.0 + net9.0 enable enable 17d839f8-f71e-4856-829b-ccf23589bb77 diff --git a/BlazorBootstrap.Demo.Server/appsettings.json b/BlazorBootstrap.Demo.Server/appsettings.json index 54620a75f..16e8a030b 100644 --- a/BlazorBootstrap.Demo.Server/appsettings.json +++ b/BlazorBootstrap.Demo.Server/appsettings.json @@ -21,6 +21,7 @@ "github_discussions": "//github.com/vikramlearning/blazorbootstrap/discussions", "stackoverflow": "//stackoverflow.com/questions/tagged/blazor-bootstrap" }, + "dotNetVersion": "9.0.0", "GoogleMap": { "ApiKey": "AIzaSyDc110Rvu20IMJhlZcWTOPoLbVQdnjLyXs" }, diff --git a/BlazorBootstrap.Demo.WebAssembly/BlazorBootstrap.Demo.WebAssembly.csproj b/BlazorBootstrap.Demo.WebAssembly/BlazorBootstrap.Demo.WebAssembly.csproj index 324566609..3fcfea059 100644 --- a/BlazorBootstrap.Demo.WebAssembly/BlazorBootstrap.Demo.WebAssembly.csproj +++ b/BlazorBootstrap.Demo.WebAssembly/BlazorBootstrap.Demo.WebAssembly.csproj @@ -1,15 +1,15 @@  - net8.0 + net9.0 enable enable - - - + + + diff --git a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json index a6f4631bf..c317275ef 100644 --- a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json +++ b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json @@ -14,6 +14,7 @@ "github_discussions": "//github.com/vikramlearning/blazorbootstrap/discussions", "stackoverflow": "//stackoverflow.com/questions/tagged/blazor-bootstrap" }, + "dotNetVersion": "9.0.0", "GoogleMap": { "ApiKey": "AIzaSyDc110Rvu20IMJhlZcWTOPoLbVQdnjLyXs" } diff --git a/blazorbootstrap/BlazorBootstrap.csproj b/blazorbootstrap/BlazorBootstrap.csproj index 19cb62caa..1f470b5f0 100644 --- a/blazorbootstrap/BlazorBootstrap.csproj +++ b/blazorbootstrap/BlazorBootstrap.csproj @@ -45,13 +45,18 @@ - - + + - + + + + + + \ No newline at end of file From 2972113569b28c902f13e0263cb71ee7ac77a9e6 Mon Sep 17 00:00:00 2001 From: Vikram Reddy Date: Wed, 20 Nov 2024 20:58:38 +0530 Subject: [PATCH 18/23] 3.2.0 release docs (#949) * ThemeSwitcher docs and other docs updated + 3.2.0 version updates --- .../Client/wwwroot/appsettings.json | 4 +- .../Components/Layout/EmptyLayout.razor | 2 +- .../Components/Layout/MainLayout.razor | 6 +- .../Components/Layout/MainLayout.razor.cs | 11 ++- .../PolarAreaChartDocumentation.razor | 4 +- .../RadarCharts/RadarChartDocumentation.razor | 4 +- .../ScatterChartDocumentation.razor | 6 +- .../RangeInput/RangeInputDocumentation.razor | 12 +-- .../Form/Switch/SwitchDocumentation.razor | 10 +-- .../TimeInput/TimeInputDocumentation.razor | 14 ++-- .../Components/Pages/Index.razor | 17 ++-- .../Pages/Preload/PreloadDocumentation.razor | 8 +- .../Progress/ProgressDocumentation.razor | 20 ++--- .../Pages/Ribbon/RibbonDocumentation.razor | 4 +- .../Ribbon/Ribbon_Demo_01_How_It_Works.razor | 18 ++--- .../Pages/Ribbon/Ribbon_Demo_02_Images.razor | 18 ++--- .../ScriptLoaderDocumentation.razor | 4 +- .../Pages/Sidebar/SidebarDocumentation.razor | 22 +++--- .../Sidebar2/Sidebar2Documentation.razor | 14 ++-- .../SortableListDocumentation.razor | 20 ++--- .../Spinners/SpinnersDocumentation.razor | 24 +++--- .../Pages/Tabs/TabsDocumentation.razor | 32 ++++---- .../ThemeSwitcherDocumentation.razor | 47 +++++++++++ .../ThemeSwitcher_Demo_01_How_It_Works.razor | 1 + .../ThemeSwitcher_Demo_02_Position_A.razor | 1 + .../ThemeSwitcher_Demo_02_Position_B.razor | 3 + .../ThemeSwitcher_Demo_03_Events.razor | 13 ++++ .../Pages/Toasts/ToastsDocumentation.razor | 16 ++-- .../Tooltips/TooltipsDocumentation.razor | 16 ++-- .../Components/Shared/Demo.razor | 2 +- .../Components/Shared/Demo.razor.cs | 8 +- .../Constants/RouteConstants.cs | 1 + BlazorBootstrap.Demo.Server/appsettings.json | 4 +- .../wwwroot/appsettings.json | 4 +- README.md | 6 +- blazorbootstrap/BlazorBootstrap.csproj | 4 +- .../ThemeSwitcher/ThemeSwitcher.razor | 2 +- .../ThemeSwitcher/ThemeSwitcher.razor.cs | 15 ++++ .../blazor.bootstrap.theme-switcher.js | 35 +++++---- docs/docs/05-components/theme-switcher.mdx | 77 +++++++++++++++++++ docs/docs/05-components/toasts.mdx | 2 +- docs/docs/05-components/tooltips.mdx | 2 +- docs/package.json | 2 +- nuget/README.md | 3 +- 44 files changed, 356 insertions(+), 182 deletions(-) create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcherDocumentation.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_01_How_It_Works.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_A.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_B.razor create mode 100644 BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_03_Events.razor create mode 100644 docs/docs/05-components/theme-switcher.mdx diff --git a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json index 5ba5d432f..06039eb6d 100644 --- a/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json +++ b/BlazorBootstrap.Demo.Hosted/Client/wwwroot/appsettings.json @@ -1,7 +1,7 @@ { - "version": "3.1.1", + "version": "3.2.0", "release": { - "short_description": "New Markdown component and other enhancements!!!" + "short_description": "New MainLayout and Theme Switcher components, along with other enhancements!!!" }, "urls": { "docs": "//docs.blazorbootstrap.com/docs/getting-started/blazor-webassembly", diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor index fd5e67f14..3167f32d0 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/EmptyLayout.razor @@ -68,7 +68,7 @@
  • - +
    • diff --git a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor index 5bd16f73c..615481918 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor @@ -26,7 +26,11 @@
    - + + +     GetNavItems() new (){ Id = "525", Text = "Sortable List", Href = "/sortable-list", IconName = IconName.ArrowsMove, ParentId = "5" }, new (){ Id = "526", Text = "Spinner", Href = "/spinners", IconName = IconName.ArrowRepeat, ParentId = "5" }, new (){ Id = "527", Text = "Tabs", Href = "/tabs", IconName = IconName.WindowPlus, ParentId = "5" }, - new (){ Id = "528", Text = "Toasts", Href = "/toasts", IconName = IconName.ExclamationTriangleFill, ParentId = "5" }, - new (){ Id = "529", Text = "Tooltips", Href = "/tooltips", IconName = IconName.ChatSquareDotsFill, ParentId = "5" }, + new (){ Id = "528", Text = "Theme Switcher", Href = "/theme-switcher", IconName = IconName.NintendoSwitch, ParentId = "5" }, + new (){ Id = "529", Text = "Toasts", Href = "/toasts", IconName = IconName.ExclamationTriangleFill, ParentId = "5" }, + new (){ Id = "530", Text = "Tooltips", Href = "/tooltips", IconName = IconName.ChatSquareDotsFill, ParentId = "5" }, new (){ Id = "6", Text = "Data Visualization", IconName = IconName.BarChartFill, IconColor = IconColor.Warning }, new (){ Id = "600", Text = "Bar Chart", Href = "/charts/bar-chart", IconName = IconName.BarChartFill, ParentId = "6", Match = NavLinkMatch.All }, @@ -99,8 +100,6 @@ internal override IEnumerable GetNavItems() return navItems; } - private void OnThemeChanged(string themeName) - { - JS.InvokeVoidAsync("updateDemoCodeThemeCss", themeName); - } + private async ValueTask OnThemeChanged(string themeName) + => await JS.InvokeVoidAsync("updateDemoCodeThemeCss", themeName); } diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor index 99f094b0c..14917b9ef 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/PolarAreaCharts/PolarAreaChartDocumentation.razor @@ -11,13 +11,13 @@ -
    +
    Refer to the getting started guide for setting up charts.
    -
    +
    In the following example, a categorical 12-color palette is used.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor index fd7c9fc7f..c6e1abec6 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/RadarCharts/RadarChartDocumentation.razor @@ -11,13 +11,13 @@ -
    +
    Refer to the getting started guide for setting up charts.
    -
    +
    In the following example, a categorical 12-color palette is used.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor index 5dd3dbe73..737a05ce0 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Charts/ScatterCharts/ScatterChartDocumentation.razor @@ -11,13 +11,13 @@ -
    +
    Refer to the getting started guide for setting up charts.
    -
    +
    In the following example, a categorical 12-color palette is used.
    @@ -28,7 +28,7 @@
    -
    +
    In the following example, you can randomize the data and datasets dynamically. Along with this, the ScatterChartOptions are updated. With these changes, the scatter chart is responsive, and when hovered over, the points' radius increases for better visibility to the end-user. diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor index 2aea480b1..cee95d4de 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/RangeInput/RangeInputDocumentation.razor @@ -13,13 +13,13 @@ -
    +
    -
    +
    Use the Disabled parameter to disable the RangeInput.
    Also, use Enable() and Disable() methods to enable and disable the RangeInput.
    @@ -29,7 +29,7 @@
    -
    +
    Set the Min and Max parameters to restrict the user input between the Min and Max range. By default, the minimum is 0. @@ -46,17 +46,17 @@
    -
    +
    The Step parameter is a number that specifies the granularity that the value must adhere to. Only values that match the specified stepping interval are valid.
    -
    +
    -
    +
    To add tick marks to a RangeInput, set the TickMarks parameter.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor index 13b7966c8..5007a50b4 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/Switch/SwitchDocumentation.razor @@ -13,11 +13,11 @@ -
    +
    -
    +
    Use the Disabled parameter to disable the Switch.
    Also, use Enable() and Disable() methods to enable and disable the Switch.
    @@ -27,21 +27,21 @@
    -
    +
    Put your switches on the opposite side by using the Reverse parameter.
    -
    +
    This event fired when the Switch selection changed.
    -
    +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor index c05d9da9d..ca30dd5e3 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Form/TimeInput/TimeInputDocumentation.razor @@ -13,7 +13,7 @@ -
    +
    The input UI generally varies from browser to browser. In unsupported browsers, the control degrades gracefully to type="text". @@ -22,7 +22,7 @@
    -
    +

    The Blazor Bootstrap TimeInput component supports TimeOnly and TimeOnly?. @@ -32,7 +32,7 @@

    -
    +
    Set EnableMinMax="true" and set the Max and Min parameters to restrict the user input between the Min and Max range.
    @@ -43,7 +43,7 @@
    -
    +
    Use the Disabled parameter to disable the TimeInput.
    Also, use Enable() and Disable() methods to enable and disable the TimeInput.
    @@ -53,21 +53,21 @@
    -
    +
    Like any other blazor input component, TimeInput component supports validations. Use the DataAnnotations to validate the user input before submitting the form. In the below example, we used the Required attributes.
    -
    +
    This event fires on every user keystroke/selection that changes the TimeInput value.
    -
    +
    One common scenario is that the time fields are restricted based on the entry in another time field. In the example below, we restrict the arrival time based on the selection of departure. diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor index 172d701ea..7f65a9275 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor @@ -82,7 +82,7 @@
    -

    Charts Updated

    +

    Charts
    @@ -107,12 +107,12 @@
    -

    Dropdown Updated

    +

    Dropdown
    -

    Google Map Updated

    +

    Google Map
    @@ -132,7 +132,7 @@
    -

    Markdown New

    +

    Markdown
    @@ -157,7 +157,7 @@
    -

    PDF Viewer

    +

    PDF Viewer Updated
    @@ -225,6 +225,11 @@

    Time Input

    +
    + +

    Theme Switcher New

    +     +

    Toasts

    @@ -314,7 +319,7 @@
    -

    Line Chart Updated

    +

    Line Chart
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor index db704309b..46cddc921 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Preload/PreloadDocumentation.razor @@ -11,7 +11,7 @@ -
    +
    • Add the Preload component to your current page or your layout page.
      • @@ -22,19 +22,19 @@
    -
    +
    1. Add the Preload component in MainLayout.razor page as shown below.
    2. Inject PreloadService, then call the Show() and Hide() methods before and after the Service/API, respectively, as shown below.
    -
    +
    -
    +
    Change the default spinner color by passing the SpinnerColor enum to the Show(...) method. In the below example, we are using a global preload service, as shown in the above section. diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor index cfdbb758c..255329d78 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Progress/ProgressDocumentation.razor @@ -11,51 +11,51 @@ -
    +
    -
    +
    Add labels to your Blazor ProgressBar component using the Label parameter or by calling the SetLabel(...) method.
    -
    +
    Use IncreaseWidth() or DecreaseWidth() methods to increase or decrease the Blazor ProgressBar width.
    -
    +
    Set the height of the Blazor Progress by using the Height parameter. Height is measured in pixels.
    -
    +
    Use the Color parameter or the SetColor(ProgressColor color) method to change the appearance of individual Blazor ProgressBar components.
    -
    +
    You can dynamically set the Blazor ProgressBar color by calling the SetColor() method.
    -
    +
    Include multiple Blazor ProgressBar components in a Blazor Progress component if needed.
    -
    +
    Add Type="ProgressType.Striped" to any Blazor ProgressBar component to apply a stripe.
    -
    +
    The stripes can also be animated. Add Type="ProgressType.StripedAndAnimated" to the Blazor ProgressBar component to animate the stripes right to the left.
    -
    +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor index daded6f5a..4f745b72b 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/RibbonDocumentation.razor @@ -11,12 +11,12 @@ -
    +
    In the following example, you will see a ribbon similar to the one found in Outlook.
    -
    +
    In the following example, instead of icons like Bootstrap, Font Awesome, etc., we used PNG icons.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_01_How_It_Works.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_01_How_It_Works.razor index 37f2af455..82c82f68c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_01_How_It_Works.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_01_How_It_Works.razor @@ -2,26 +2,26 @@ - + New
    Email     - +     - - - + + +     - + Send/Receive
    All Folders     Update
    Folder         - + Show
    Progress     Cancel
    All         @@ -30,12 +30,12 @@ - + New
    Folder     New
    Search Folder         - + Rename
    Folder     Copy
    Folder     Move
    Folder     diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_02_Images.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_02_Images.razor index b8310465b..f84ae2843 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_02_Images.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Ribbon/Ribbon_Demo_02_Images.razor @@ -2,26 +2,26 @@ - + New
    Email     - +     - - - + + +     - + Send/Receive
    All Folders     Update
    Folder         - + Show
    Progress     Cancel
    All         @@ -30,12 +30,12 @@ - + New
    Folder     New
    Search Folder         - + Rename
    Folder     Copy
    Folder     Move
    Folder     diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor index 68f5e2046..c45a6e280 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ScriptLoader/ScriptLoaderDocumentation.razor @@ -11,7 +11,7 @@ -
    +
    In the following example, the jQuery script is loaded using the Script Loader component.
    @@ -24,7 +24,7 @@ Blazor Script Loader - Test whether the jQuery script has been loaded successfully -
    +
    Blazor Bootstrap Script Loader component exposes two events. diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor index 68766d8b1..285de70bf 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar/SidebarDocumentation.razor @@ -11,57 +11,57 @@ -
    +
    -
    +
    Use NavItem's Id and ParentId to set the parent-child relation.
    Currently, two levels of navigation are supported. For more than two levels, use the Sidebar2 component.
    -
    +
    Set IconColor property to change the color.
    -
    +
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    -
    +
    Call ToggleSidebar() method to toggle the Sidebar to show the icons only.
    -
    +
    A badge is useful when displaying the application version, environment, or other information. Use the BadgeText parameter to show the badge.
    -
    +
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    -
    +
    Use the ImageSrc parameter to set the brand logo.
    -
    +
    Developers can customize the sidebar color by changing the CSS variables, as mentioned in the below example.
    -
    +
    Set the Class property of a NavItem to apply a custom CSS class.
    -
    +
    Set the Width parameter to change the sidebar width. Default value is 270px.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor index cd3c48aaa..5c9f2ec1b 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Sidebar2/Sidebar2Documentation.razor @@ -11,37 +11,37 @@ -
    +
    -
    +
    -@*
    +@*
    Set IconColor property to change the color.
    *@ -
    +
    Replace your MainLayout.razor page code with the below example to have a complete layout with a sidebar.
    -
    +
    Use the CustomIconName parameter to set the custom logo icon using font awesome or other icons.
    -
    +
    Use the ImageSrc parameter to set the brand logo.
    -
    +
    Set the Width parameter to change the sidebar width. Default value is 270px.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor index 7ae499349..f1d6ae13c 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/SortableList/SortableListDocumentation.razor @@ -11,17 +11,17 @@ -
    +
    Before using the SortableList component, include the SortableJS script reference in your index.html/_Host.cshtml file.
    -
    +
    -
    +

    To drag-and-drop an item from one list to the other and vice versa, set the Group parameter for all the lists. Providing the same Group name for the lists is what links them together.

    In the below example, both lists use the same Group.

    @@ -34,35 +34,35 @@
    -
    +
    By setting Pull="SortableListPullMode.Clone", you can enable item cloning. Drag an item from one list to another to create a copy that stays in the original list.
    -
    +
    You can disable list sorting by setting AllowSorting="false". In the example below, the list cannot be sorted.
    -
    +
    The Handle parameter specifies the CSS class that denotes the drag handle. In the example below, items can only be sorted by dragging the handle itself.
    -
    +
    Try dragging the red-backgrounded item. You won't be able to, as it's disabled using the DisableItem parameter.
    -
    +
    @*
    *@ @@ -70,12 +70,12 @@
    -
    +
    -
    +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor index a781a2259..b9ad7ea1a 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Spinners/SpinnersDocumentation.razor @@ -11,19 +11,19 @@ -
    +
    Use the border spinners for a lightweight loading indicator.
    -
    +
    The border spinner's border color inherits the element's color (currentColor). This means you can easily customize the spinner's color by changing the Color parameter on the standard spinner.
    -
    +
    If you don't fancy a border spinner, switch to the grow spinner, while it doesn't technically spin, it does repeatedly grow!
    @@ -31,38 +31,38 @@
    -
    +
    The loading dots are a special indicator for a lightweight loading indicator.
    -
    -
    +
    +
    -
    -
    +
    +
    -
    +
    -
    +
    -
    +
    -
    +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor index 4c708bf0f..e1372d53d 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Tabs/TabsDocumentation.razor @@ -11,54 +11,54 @@ -
    +
    -
    +
    To create a fade-in effect for tabs, add the EnableFadeEffect="true" parameter. Additionally, set the IsActive="true" parameter on the first tab pane to display its content initially.
    -
    +
    To customize the tab title, use the TitleTemplate parameter, as demonstrated in the following example.
    -
    +
    Disable specific tabs by adding Disabled="true" parameter.
    -
    +
    To transform the tabs into pills, use the parameter NavStyle="NavStyle.Pills".
    -
    +
    Use the NavStyle="NavStyle.Underline" parameter to change the tabs to an underlined style.
    -
    +
    Display your tabs vertically by setting the NavStyle parameter to NavStyle.Vertical.
    -
    +
    -
    +
    -
    +
    You can activate individual tabs in several ways. Use predefined methods such as ShowFirstTabAsync, ShowLastTabAsync, ShowTabByIndexAsync, and ShowTabByNameAsync, as shown below.
    -
    +
    When displaying a new tab, the events fire in the following sequence:

    @@ -100,23 +100,23 @@

    -
    +
    -
    +
    -
    +
    -
    +
    -
    +
    In the following example, we are deleting tabs dynamically. Ensure that the @@key parameter is added with unique value. diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcherDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcherDocumentation.razor new file mode 100644 index 000000000..f2d6128fb --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcherDocumentation.razor @@ -0,0 +1,47 @@ +@attribute [Route(pageUrl)] + + + + + @pageDescription + + + + +
    +
    + In the following example, you will see a theme switcher similar to a dropdown component with three options: Light, Dark, and Auto. +
    + +
    + +
    +
    + By default, the Position is set to DropdownMenuPosition.Start. + You can change the position of the theme switcher by setting the Position parameter to DropdownMenuPosition.End. +
    + +
    + Align the theme switcher to the right to position the dropdown menu on the right side of the button. +
    + +
    + +
    +
    + If you want to perform an action when the theme changes, you can use the OnThemeChanged event. +
    + +
    + +@code { + private const string pageUrl = RouteConstants.Demos_ThemeSwitcher_Documentation; + private const string pageTitle = "Blazor Theme Switcher"; + private const string pageDescription = "Documentation and examples for using the Blazor Bootstrap Theme Switcher component."; + private const string metaTitle = "Blazor Theme Switcher Component"; + private const string metaDescription = "Documentation and examples for using the Blazor Bootstrap Theme Switcher component."; + private const string imageUrl = "https://i.imgur.com/2eixWho.png"; +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_01_How_It_Works.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_01_How_It_Works.razor new file mode 100644 index 000000000..57c2d8286 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_01_How_It_Works.razor @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_A.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_A.razor new file mode 100644 index 000000000..b9f0ad4e1 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_A.razor @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_B.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_B.razor new file mode 100644 index 000000000..c79c39f34 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_02_Position_B.razor @@ -0,0 +1,3 @@ +
    + +
    \ No newline at end of file diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_03_Events.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_03_Events.razor new file mode 100644 index 000000000..f9cbf4fd0 --- /dev/null +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/ThemeSwitcher/ThemeSwitcher_Demo_03_Events.razor @@ -0,0 +1,13 @@ + + +@code +{ + [Inject] + ToastService ToastService { get; set; } = default!; + + private void OnThemeChanged(string themeName) + { + // do something when the theme changes + ToastService.Notify(new(ToastType.Success, $"Theme changed to {themeName}")); + } +} diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor index 4aaf04b70..894921b87 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Toasts/ToastsDocumentation.razor @@ -13,44 +13,44 @@
    Blazor Toasts are lightweight notifications designed to mimic the push notifications that mobile and desktop operating systems have popularized. They're built with a flexbox, making it easy to align and position.
    -
    +
    • Blazor Toasts will not hide automatically if you do not specify AutoHide="true".
    • Use global toasts service for the application instead of page level toasts.
    -
    +
    -
    +
    -
    +
    Add AutoHide="true" parameter to hide the Blazor Toasts after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    -
    +
    Set AutoHide="true" property on ToastMessage to hide individual Blazor Toast message after the delay. The default delay is 5000 milliseconds, be sure to update the delay timeout so that users have enough time to read the toast.
    In the below example, AutoHide="false" for Danger and Warning messages.
    -
    +
    Change the Blazor Toasts placement according to your need. The default placement will be top right corner. Use the ToastsPlacement parameter to update the Blazor Toasts placement.
    -
    +
    Blazor Toasts component shows a maximum of 5 toasts by default. If you add a new toast to the existing list, the first toast gets deleted like FIFO (First In First Out). Change the maximum capacity according to your need by using the StackLength parameter.
    In the below example, StackLength is set to 3. It shows a maximum of 3 toast messages at any time.
    -
    +
    1. Add the Toasts component in MainLayout.razor page as shown below.
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor b/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor index 4acb07eec..107f85a21 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Pages/Tooltips/TooltipsDocumentation.razor @@ -11,11 +11,11 @@ -
    +
    -
    +
    @@ -24,21 +24,21 @@ See Buttons - Tooltip. -
    +
    @* START: Commented Examples *@ -@*
    +@*
    -
    +
    *@ @* END: Commented Examples *@ -
    +
    Blazor Bootstrap includes several predefined tooltip styles, each serving its own semantic purpose. The Color parameter can be used to customize the color of the tooltip. @@ -46,11 +46,11 @@
    -
    +
    -
    +
    diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor index 41e92cb24..8eddb2996 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor @@ -1,5 +1,5 @@ @namespace BlazorBootstrap.Demo.RCL -@inherits ComponentBase +@inherits BlazorBootstrapComponentBase @if (ShowCodeOnly) { diff --git a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs index 8be134615..d2b282d24 100644 --- a/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs +++ b/BlazorBootstrap.Demo.RCL/Components/Shared/Demo.razor.cs @@ -1,6 +1,6 @@ namespace BlazorBootstrap.Demo.RCL; -public partial class Demo : ComponentBase +public partial class Demo : BlazorBootstrapComponentBase { #region Fields and Constants @@ -10,13 +10,13 @@ public partial class Demo : ComponentBase private string? clipboardTooltipTitle = "Copy to clipboard"; - private string? snippet; - /// /// A reference to this component instance for use in JavaScript calls. /// private DotNetObjectReference objRef = default!; + private string? snippet; + #endregion #region Methods @@ -103,6 +103,8 @@ public void ResetCopyStatusJS() #region Properties, Indexers + protected override string? ClassNames => BuildClassNames(Class, ("bd-example-snippet bd-code-snippet", true)); + [Inject] protected IJSRuntime JS { get; set; } = default!; [Parameter] public LanguageCode LanguageCode { get; set; } = LanguageCode.Razor; diff --git a/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs b/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs index 077fae2a8..bc6ddfca0 100644 --- a/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs +++ b/BlazorBootstrap.Demo.RCL/Constants/RouteConstants.cs @@ -79,6 +79,7 @@ public static class RouteConstants public const string Demos_SortableList_Documentation = Demos_Prefix + "/sortable-list"; public const string Demos_Spinners_Documentation = Demos_Prefix + "/spinners"; public const string Demos_Tabs_Documentation = Demos_Prefix + "/tabs"; + public const string Demos_ThemeSwitcher_Documentation = Demos_Prefix + "/theme-switcher"; public const string Demos_Toasts_Documentation = Demos_Prefix + "/toasts"; public const string Demos_Tooltips_Documentation = Demos_Prefix + "/tooltips"; diff --git a/BlazorBootstrap.Demo.Server/appsettings.json b/BlazorBootstrap.Demo.Server/appsettings.json index 16e8a030b..d2c683608 100644 --- a/BlazorBootstrap.Demo.Server/appsettings.json +++ b/BlazorBootstrap.Demo.Server/appsettings.json @@ -6,9 +6,9 @@ } }, "AllowedHosts": "*", - "version": "3.1.1", + "version": "3.2.0", "release": { - "short_description": "New Markdown component and other enhancements!!!" + "short_description": "New MainLayout and Theme Switcher components, along with other enhancements!!!" }, "urls": { "docs": "//docs.blazorbootstrap.com/getting-started/blazor-webassembly-net-8", diff --git a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json index c317275ef..bb6e7f911 100644 --- a/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json +++ b/BlazorBootstrap.Demo.WebAssembly/wwwroot/appsettings.json @@ -1,7 +1,7 @@ { - "version": "3.1.1", + "version": "3.2.0", "release": { - "short_description": "New Markdown component and other enhancements!!!" + "short_description": "New MainLayout and Theme Switcher components, along with other enhancements!!!" }, "urls": { "docs": "//docs.blazorbootstrap.com/getting-started/blazor-webassembly-net-8", diff --git a/README.md b/README.md index e14ec003b..2f1571f1f 100644 --- a/README.md +++ b/README.md @@ -41,7 +41,7 @@ ## Install -Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.1.1` +Install with [NuGet](https://www.nuget.org/): `Install-Package Blazor.Bootstrap -Version 3.2.0` ## Install Blazor Bootstrap templates @@ -98,6 +98,7 @@ Install [Blazor Bootstrap templates](https://github.com/vikramlearning/blazorboo | Spinners | [Docs](https://docs.blazorbootstrap.com/components/spinners) | [Demos](https://demos.blazorbootstrap.com/spinners) | | Switch | [Docs](https://docs.blazorbootstrap.com/forms/switch) | [Demos](https://demos.blazorbootstrap.com/form/switch) | | Tabs | [Docs](https://docs.blazorbootstrap.com/components/tabs) | [Demos](https://demos.blazorbootstrap.com/tabs) | +| Theme Switcher | [Docs](https://docs.blazorbootstrap.com/components/theme-switcher) | [Demos](https://demos.blazorbootstrap.com/theme-switcher) | | Time Input | [Docs](https://docs.blazorbootstrap.com/forms/time-input) | [Demos](https://demos.blazorbootstrap.com/form/time-input) | | Toasts | [Docs](https://docs.blazorbootstrap.com/components/toasts) | [Demos](https://demos.blazorbootstrap.com/toasts) | | Tooltips | [Docs](https://docs.blazorbootstrap.com/components/tooltips) | [Demos](https://demos.blazorbootstrap.com/tooltips) | @@ -230,6 +231,9 @@ Blazor Bootstrap's documentation, which is included in this repository's root di ### Blazor Bootstrap - Tabs ![Blazor Bootstrap - Tabs](https://i.imgur.com/NdE5oqH.png "Blazor Bootstrap - Tabs") +### Blazor Bootstrap - Theme Switcher +![Blazor Bootstrap - Theme Switcher](https://i.imgur.com/2eixWho.png "Blazor Bootstrap - Theme Switcher") + ### Blazor Bootstrap - Time Input ![Blazor Bootstrap - Time Input](https://i.imgur.com/TlvjRlP.png "Blazor Bootstrap - Time Input") diff --git a/blazorbootstrap/BlazorBootstrap.csproj b/blazorbootstrap/BlazorBootstrap.csproj index 1f470b5f0..63494e9b3 100644 --- a/blazorbootstrap/BlazorBootstrap.csproj +++ b/blazorbootstrap/BlazorBootstrap.csproj @@ -3,8 +3,8 @@ Blazor.Bootstrap - 3.1.1 - 3.1.1 + 3.2.0 + 3.2.0 Apache-2.0 diff --git a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor index cc8ff6d09..7b17523c0 100644 --- a/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor +++ b/blazorbootstrap/Components/ThemeSwitcher/ThemeSwitcher.razor @@ -6,7 +6,7 @@ Toggle theme -
      +