From 5a9aad6130bcd9e70f2bfad1cee36dd64af2ed83 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 12 Feb 2026 23:04:46 +0330
Subject: [PATCH 01/66] feat(blazorui): add new Icon parameter to BitCheckbox
 #12076 (#12077)

---
 .../Inputs/Checkbox/BitCheckbox.razor         |  5 +--
 .../Inputs/Checkbox/BitCheckbox.razor.cs      | 23 +++++++++++---
 .../Inputs/Checkbox/BitCheckboxDemo.razor     | 31 +++++++++++++++++--
 .../Inputs/Checkbox/BitCheckboxDemo.razor.cs  | 13 ++++++--
 .../Checkbox/BitCheckboxDemo.razor.samples.cs | 20 +++++++++++-
 5 files changed, 79 insertions(+), 13 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor
index f64dc50535..e087795231 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<bool>
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -17,11 +17,12 @@
         }
         else
         {
+            var icon = BitIconInfo.From(CheckIcon, CheckIconName ?? "Accept");
             <div style="@Styles?.Box" class="bit-chb-box @Classes?.Box">
                 <i aria-hidden="true"
                    aria-label="@CheckIconAriaLabel"
                    style="@Styles?.Icon"
-                   class="bit-chb-ico bit-icon bit-icon--@CheckIconName @Classes?.Icon" />
+                   class="bit-chb-ico @icon?.GetCssClasses() @Classes?.Icon" />
             </div>
 
             @if (LabelTemplate is not null)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor.cs
index b600029bf2..50219ce385 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Checkbox/BitCheckbox.razor.cs
@@ -1,4 +1,4 @@
-using System.Diagnostics.CodeAnalysis;
+using System.Diagnostics.CodeAnalysis;
 
 namespace Bit.BlazorUI;
 
@@ -36,12 +36,27 @@ public partial class BitCheckbox : BitInputBase<bool>
     [Parameter] public int? AriaSetSize { get; set; }
 
     /// <summary>
-    /// Custom icon for the check mark rendered by the checkbox instead of default check mark icon
+    /// Gets or sets the check icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="CheckIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string CheckIconName { get; set; } = "Accept";
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="CheckIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: CheckIcon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: CheckIcon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: CheckIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? CheckIcon { get; set; }
 
     /// <summary>
-    /// he aria label of the icon for the benefit of screen readers
+    /// The name of the built-in icon to render as the check mark inside the checkbox.
+    /// </summary>
+    [Parameter] public string? CheckIconName { get; set; }
+
+    /// <summary>
+    /// The aria label of the icon for the benefit of screen readers.
     /// </summary>
     [Parameter] public string? CheckIconAriaLabel { get; set; }
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor
index 9b4851fe50..d5bcac43ab 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/checkbox"
+@page "/components/checkbox"
 @page "/components/check-box"
 
 <PageOutlet Url="components/checkbox"
@@ -275,7 +275,32 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
+    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" Id="example11">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CheckIcon</b> parameter.</div>
+        <br />
+        <br />
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        <div>FontAwesome:</div>
+        <br />
+        <BitCheckbox Label="House (CheckIcon string)" CheckIcon="@("fa-solid fa-house")" />
+        <br />
+        <BitCheckbox Label="Heart (BitIconInfo.Css)" CheckIcon="@BitIconInfo.Css("fa-solid fa-heart")" Color="BitColor.Secondary" />
+        <br />
+        <BitCheckbox Label="Rocket (BitIconInfo.Fa)" CheckIcon="@BitIconInfo.Fa("solid rocket")" Color="BitColor.Error" />
+        
+        <br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        <div>Bootstrap Icons:</div>
+        <br />
+        <BitCheckbox Label="House (CheckIcon string)" CheckIcon="@("bi bi-house-fill")" />
+        <br />
+        <BitCheckbox Label="Heart (BitIconInfo.Css)" CheckIcon="@BitIconInfo.Css("bi bi-heart-fill")" Color="BitColor.Secondary" />
+        <br />
+        <BitCheckbox Label="Gear (BitIconInfo.Bi)" CheckIcon="@BitIconInfo.Bi("gear-fill")" Color="BitColor.Error" />
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
         <div>Explore styling and class customization for BitCheckbox, including component styles, custom classes, and detailed styles.</div>
         <br /><br />
         <div>Component's Style & Class:</div>
@@ -303,7 +328,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
         <div>Use BitCheckbox in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.cs
index 39c54a6b65..7c60ae460d 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Checkbox;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Checkbox;
 
 public partial class BitCheckboxDemo
 {
@@ -33,11 +33,18 @@ public partial class BitCheckboxDemo
             Description = "The total size of the parent set (if in a set) for aria-setsize.",
         },
         new()
+        {
+            Name = "CheckIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The check icon using custom CSS classes for external icon libraries. Takes precedence over CheckIconName when both are set. Use BitIconInfo.Bi(), BitIconInfo.Fa(), or BitIconInfo.Css() for Bootstrap Icons, FontAwesome, or custom CSS.",
+        },
+        new()
         {
             Name = "CheckIconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "Accept",
-            Description = "Custom icon for the check mark rendered by the checkbox instead of default check mark icon.",
+            Description = "The name of the built-in icon to render as the check mark inside the checkbox.",
         },
         new()
         {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs
index 458c67f30f..7bcb7efa0a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Checkbox/BitCheckboxDemo.razor.samples.cs
@@ -184,6 +184,24 @@ private async Task HandleValidSubmit() { }
 <BitCheckbox Color=""BitColor.TertiaryBorder"" Label=""TertiaryBorder"" Value />";
 
     private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitCheckbox Label=""House (CheckIcon string)"" CheckIcon=""@(""fa-solid fa-house"")"" />
+
+<BitCheckbox Label=""Heart (BitIconInfo.Css)"" CheckIcon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" Color=""BitColor.Secondary"" />
+
+<BitCheckbox Label=""Rocket (BitIconInfo.Fa)"" CheckIcon=""@BitIconInfo.Fa(""solid rocket"")"" Color=""BitColor.Error"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitCheckbox Label=""House (CheckIcon string)"" CheckIcon=""@(""bi bi-house-fill"")"" />
+
+<BitCheckbox Label=""Heart (BitIconInfo.Css)"" CheckIcon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" Color=""BitColor.Secondary"" />
+
+<BitCheckbox Label=""Gear (BitIconInfo.Bi)"" CheckIcon=""@BitIconInfo.Bi(""gear-fill"")"" Color=""BitColor.Error"" />";
+
+    private readonly string example12RazorCode = @"
 <style>
     .custom-class {
         padding: 0.5rem;
@@ -242,7 +260,7 @@ private async Task HandleValidSubmit() { }
                                 Label=""custom-label"",
                                 Box=""custom-box"" })"" />";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitCheckbox Dir=""BitDir.Rtl"" Label=""چکباکس راست به چپ"" />
 <BitCheckbox Dir=""BitDir.Rtl"" Label=""چکباکس غیرفعال"" IsEnabled=""false"" />
 <BitCheckbox Dir=""BitDir.Rtl"" Label=""چکباکس غیرفعال چک شده"" IsEnabled=""false"" Value=""true"" />";

From d6e2904afeec3266ed06790baf5b2967bf988ab2 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 13 Feb 2026 11:51:51 +0330
Subject: [PATCH 02/66] feat(blazorui): add new Icon parameter to
 BitChoiceGroup #12078 (#12079)

---
 .../ChoiceGroup/BitChoiceGroup.razor.cs       | 29 ++++++---
 .../Inputs/ChoiceGroup/BitChoiceGroup.scss    | 29 +++++----
 .../Inputs/ChoiceGroup/BitChoiceGroupItem.cs  | 13 ++++
 .../BitChoiceGroupNameSelectors.cs            |  7 ++-
 .../ChoiceGroup/BitChoiceGroupOption.cs       | 13 ++++
 .../ChoiceGroup/_BitChoiceGroupItem.razor     | 10 +--
 .../ChoiceGroup/BitChoiceGroupDemo.razor.cs   | 62 ++++++++++++++++++-
 .../Components/Inputs/ChoiceGroup/Order.cs    |  3 +-
 .../_BitChoiceGroupCustomDemo.razor           | 40 +++++++++++-
 .../_BitChoiceGroupCustomDemo.razor.cs        |  9 ++-
 ..._BitChoiceGroupCustomDemo.razor.samples.cs | 45 +++++++++++++-
 .../ChoiceGroup/_BitChoiceGroupItemDemo.razor | 25 +++++++-
 .../_BitChoiceGroupItemDemo.razor.cs          |  9 ++-
 .../_BitChoiceGroupItemDemo.razor.samples.cs  | 23 ++++++-
 .../_BitChoiceGroupOptionDemo.razor           | 37 ++++++++++-
 ..._BitChoiceGroupOptionDemo.razor.samples.cs | 26 +++++++-
 16 files changed, 332 insertions(+), 48 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.razor.cs
index 052711ed06..f145551904 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.razor.cs
@@ -339,7 +339,7 @@ internal string GetItemContainerCssClasses(TItem item)
             cssClass.Append(' ').Append("bit-chg-ids");
         }
 
-        if (GetImageSrc(item).HasValue() || GetIconName(item).HasValue())
+        if (GetImageSrc(item).HasValue() || GetIcon(item) is not null)
         {
             cssClass.Append(' ').Append("bit-chg-ihi");
         }
@@ -349,7 +349,7 @@ internal string GetItemContainerCssClasses(TItem item)
 
     internal string GetItemLabelCssClasses(TItem item)
     {
-        var hasImageOrIcon = GetImageSrc(item).HasValue() || GetIconName(item).HasValue();
+        var hasImageOrIcon = GetImageSrc(item).HasValue() || GetIcon(item) is not null;
         return hasImageOrIcon && ItemLabelTemplate is null && Inline is false
                 ? "bit-chg-ili"
                 : string.Empty;
@@ -404,26 +404,41 @@ internal bool GetIsEnabled(TItem item)
         return item.GetValueFromProperty(NameSelectors.IsEnabled.Name, true);
     }
 
-    internal string? GetIconName(TItem item)
+    internal BitIconInfo? GetIcon(TItem item)
     {
         if (item is BitChoiceGroupItem<TValue> choiceGroupItem)
         {
-            return choiceGroupItem.IconName;
+            return BitIconInfo.From(choiceGroupItem.Icon, choiceGroupItem.IconName);
         }
 
         if (item is BitChoiceGroupOption<TValue> choiceGroupOption)
         {
-            return choiceGroupOption.IconName;
+            return BitIconInfo.From(choiceGroupOption.Icon, choiceGroupOption.IconName);
         }
 
         if (NameSelectors is null) return null;
 
+        BitIconInfo? icon = null;
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            icon = NameSelectors.Icon.Selector!(item);
+        }
+        else
+        {
+            icon = item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+        }
+
+        string? iconName = null;
         if (NameSelectors.IconName.Selector is not null)
         {
-            return NameSelectors.IconName.Selector!(item);
+            iconName = NameSelectors.IconName.Selector!(item);
+        }
+        else
+        {
+            iconName = item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
         }
 
-        return item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
+        return BitIconInfo.From(icon, iconName);
     }
 
     internal string? GetImageSrc(TItem item)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss
index 0230eef9fd..e0e852a80e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroup.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-chg {
     display: flex;
@@ -99,8 +99,8 @@
         box-sizing: border-box;
         transform: translateY(-50%);
         width: var(--bit-chg-circle-size);
-        transition: border-color 0.2s cubic-bezier(0.4, 0, 0.23, 1);
         border: $shp-border-width $shp-border-style $clr-brd-pri;
+        transition: border-color 0.2s cubic-bezier(0.4, 0, 0.23, 1);
     }
 
     &::after {
@@ -111,12 +111,12 @@
         position: absolute;
         border-radius: 50%;
         box-sizing: border-box;
-        transform: translateY(-50%);
+        inset-inline-start: 50%;
+        transform: translate(-50%, -50%);
         background-color: $clr-fg-sec-hover;
         transition-property: background-color;
         width: calc(var(--bit-chg-circle-size) / 2);
         transition: border-width 0.2s cubic-bezier(0.4, 0, 0.23, 1);
-        inset-inline-start: calc(var(--bit-chg-circle-size) / 4);
     }
 
     @media (hover: hover) {
@@ -226,11 +226,12 @@
     height: var(--bit-chg-ico-size);
     font-size: var(--bit-chg-ico-size);
     line-height: var(--bit-chg-ico-size);
+}
 
-    i {
-        speak: none;
-        display: inline-block;
-    }
+.bit-chg-ico {
+    speak: none;
+    display: inline-block;
+    //width: var(--bit-chg-ico-size);
 }
 
 .bit-chg-inl {
@@ -248,6 +249,10 @@
         padding: 0;
         font-size: calc(var(--bit-chg-fontsize) + spacing(0.25));
     }
+
+    .bit-chg-ico {
+        //width: unset;
+    }
 }
 
 .bit-chg-ich {
@@ -329,10 +334,10 @@
 
     .bit-chg-icw {
         color: $clr-fg-dis;
+    }
 
-        i {
-            color: $clr-fg-dis;
-        }
+    .bit-chg-ico {
+        color: $clr-fg-dis;
     }
 }
 
@@ -491,4 +496,4 @@
     &.bit-chg-lg {
         --bit-chg-item-gap: #{spacing(3)};
     }
-}
\ No newline at end of file
+}
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupItem.cs
index 1933a56c47..ae4013fe59 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupItem.cs
@@ -22,6 +22,19 @@ public class BitChoiceGroupItem<TValue>
     /// </summary>
     public bool IsEnabled { get; set; } = true;
 
+    /// <summary>
+    /// The icon to show as content of the BitChoiceGroup item.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon = BitIconInfo.Fa("solid house")
+    /// Custom CSS: Icon = BitIconInfo.Css("my-icon-class")
+    /// </example>
+    public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// The icon to show as content of the BitChoiceGroup item.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupNameSelectors.cs
index d0bdaf3037..0dd9a83f9f 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupNameSelectors.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitChoiceGroupNameSelectors<TItem, TValue>
 {
@@ -22,6 +22,11 @@ public class BitChoiceGroupNameSelectors<TItem, TValue>
     /// </summary>
     public BitNameSelectorPair<TItem, bool> IsEnabled { get; set; } = new(nameof(BitChoiceGroupItem<TValue>.IsEnabled));
 
+    /// <summary>
+    /// The Icon field name and selector of the custom input class.
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitChoiceGroupItem<TValue>.Icon));
+
     /// <summary>
     /// The IconName field name and selector of the custom input class.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupOption.cs
index 7172a3b348..1a6c671230 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupOption.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/BitChoiceGroupOption.cs
@@ -26,6 +26,19 @@ public partial class BitChoiceGroupOption<TValue> : ComponentBase, IDisposable
     /// </summary>
     [Parameter] public bool IsEnabled { get; set; } = true;
 
+    /// <summary>
+    /// The icon to show as content of the BitChoiceGroup option.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// The icon to show as content of the BitChoiceGroup option.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/_BitChoiceGroupItem.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/_BitChoiceGroupItem.razor
index 62638a1692..c24a664563 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/_BitChoiceGroupItem.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/ChoiceGroup/_BitChoiceGroupItem.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @typeparam TItem
 @typeparam TValue
 
@@ -57,17 +57,17 @@
                     </div>
                 }
 
-                var iconName = ChoiceGroup.GetIconName(Item);
-                @if (iconName.HasValue())
+                var icon = ChoiceGroup.GetIcon(Item);
+                @if (icon is not null)
                 {
                     <div style="@ChoiceGroup.Styles?.ItemIconWrapper" class="bit-chg-icw @ChoiceGroup.Classes?.ItemIconWrapper">
                         <i aria-hidden="true"
                            style="@ChoiceGroup.Styles?.ItemIcon"
-                           class="bit-icon bit-icon--@iconName @ChoiceGroup.Classes?.ItemIcon" />
+                           class="bit-chg-ico @icon.GetCssClasses() @ChoiceGroup.Classes?.ItemIcon" />
                     </div>
                 }
 
-                @if (imageSrc.HasValue() || iconName.HasValue())
+                @if (imageSrc.HasValue() || icon is not null)
                 {
                     <div style="@ChoiceGroup.Styles?.ItemTextWrapper" class="bit-chg-itw @ChoiceGroup.Classes?.ItemTextWrapper">
                         <span style="@ChoiceGroup.Styles?.ItemText" class="bit-chg-itx @ChoiceGroup.Classes?.ItemText">@ChoiceGroup.GetText(Item)</span>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/BitChoiceGroupDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/BitChoiceGroupDemo.razor.cs
index e1758eefff..2a267a33fd 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/BitChoiceGroupDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/BitChoiceGroupDemo.razor.cs
@@ -341,11 +341,20 @@ public partial class BitChoiceGroupDemo
                    Description = "Whether the BitChoiceGroup item is enabled.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to show as content of the BitChoiceGroup item. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "The icon to show as content of the BitChoiceGroup item.",
+                   Description = "The icon name (built-in Fluent UI) to show as content of the BitChoiceGroup item.",
                },
                new()
                {
@@ -461,11 +470,20 @@ public partial class BitChoiceGroupDemo
                    Description = "Whether the BitChoiceGroup option is enabled.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to show as content of the BitChoiceGroup option. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "The icon to show as content of the BitChoiceGroup option.",
+                   Description = "The icon name (built-in Fluent UI) to show as content of the BitChoiceGroup option.",
                },
                new()
                {
@@ -581,11 +599,20 @@ public partial class BitChoiceGroupDemo
                    Description = "Whether the BitChoiceGroup option is enabled.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                   DefaultValue = "new(nameof(BitChoiceGroupItem<TValue>.Icon))",
+                   Description = "Icon field name and selector of the custom input class.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "BitNameSelectorPair<TItem, string?>",
                    DefaultValue = "new(nameof(BitChoiceGroupItem<TValue>.IconName))",
-                   Description = "The icon to show as content of the BitChoiceGroup option.",
+                   Description = "IconName field name and selector of the custom input class.",
                },
                new()
                {
@@ -778,6 +805,35 @@ public partial class BitChoiceGroupDemo
                    Description = "Custom CSS classes/styles for the text of each item of the BitChoiceGroup.",
                },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/Order.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/Order.cs
index 6116408d91..9425534337 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/Order.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/Order.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
 
 public class Order
 {
@@ -8,6 +8,7 @@ public class Order
     public string? ImageDescription { get; set; }
     public BitImageSize? ImageSize { get; set; }
     public string? SelectedImageAddress { get; set; }
+    public BitIconInfo? Icon { get; set; }
     public string? IconName { get; set; }
     public bool IsDisabled { get; set; }
     public string? Class { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor
index 7b52aabe5e..4e545126b5 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="example-content">
         <BitChoiceGroup Label="Basic Customs"
                         Items="basicCustoms"
@@ -485,7 +485,41 @@
         </div>
     </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <div>Use icons from external libraries like FontAwesome or Bootstrap Icons with the Icon parameter and NameSelectors.</div>
+    
+    <br />
+    
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    
+    <br />
+
+    <div class="example-content column">
+        <BitChoiceGroup Label="External Icons" 
+                        Items="externalIconCustoms" 
+                        DefaultValue="@("Day")"
+                        NameSelectors="@(new() { Text = { Name = nameof(Order.Name) }, 
+                                                 Value = { Name = nameof(Order.ItemValue) }, 
+                                                 Icon = { Name = nameof(Order.Icon) } })" />
+
+        <BitChoiceGroup Label="External Icons (Inline)" 
+                        Items="externalIconCustoms" 
+                        DefaultValue="@("Day")" Inline
+                        NameSelectors="@(new() { Text = { Name = nameof(Order.Name) }, 
+                                                 Value = { Name = nameof(Order.ItemValue) }, 
+                                                 Icon = { Name = nameof(Order.Icon) } })" />
+
+        <BitChoiceGroup Label="External Icons (Horizontal)" 
+                        Items="externalIconCustoms" 
+                        DefaultValue="@("Day")" Horizontal
+                        NameSelectors="@(new() { Text = { Name = nameof(Order.Name) }, 
+                                                 Value = { Name = nameof(Order.ItemValue) }, 
+                                                 Icon = { Name = nameof(Order.Icon) } })" />
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>Explores styling and class customization for BitChoiceGroup, including component styles, custom classes, and detailed style items.</div>
     <br /><br />
     <div>Component's Style & Class:</div>
@@ -538,7 +572,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>Use BitChoiceGroup in right-to-left (RTL).</div>
     <br />
     <div dir="rtl" class="example-content">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.cs
index 694c4dc150..2f8cc4b539 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
 
 public partial class _BitChoiceGroupCustomDemo
 {
@@ -78,6 +78,13 @@ public partial class _BitChoiceGroupCustomDemo
         new() { Name = "Month", ItemValue = "Month", IconName = BitIconName.Calendar, IsDisabled = true }
     ];
 
+    private readonly List<Order> externalIconCustoms =
+    [
+        new() { Name = "Day", ItemValue = "Day", Icon = BitIconInfo.Fa("solid sun") },
+        new() { Name = "Week", ItemValue = "Week", Icon = BitIconInfo.Css("fa-solid fa-calendar-week") },
+        new() { Name = "Month", ItemValue = "Month", Icon = BitIconInfo.Bi("calendar-month") }
+    ];
+
     private readonly List<Order> itemStyleClassCustoms =
     [
         new() { Name = "Custom A", ItemValue = "A", Class = "custom-item" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cs
index 3447150819..f7a5e2e121 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupCustomDemo.razor.samples.cs
@@ -784,6 +784,45 @@ public class Order
 ];";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitChoiceGroup Label=""External Icons"" 
+                Items=""externalIconCustoms"" 
+                DefaultValue=""@(""Day"")""
+                NameSelectors=""@(new() { Text = { Name = nameof(Order.Name) }, 
+                                         Value = { Name = nameof(Order.ItemValue) }, 
+                                         Icon = { Name = nameof(Order.Icon) } })"" />
+
+<BitChoiceGroup Label=""External Icons (Inline)"" 
+                Items=""externalIconCustoms"" 
+                DefaultValue=""@(""Day"")"" Inline
+                NameSelectors=""@(new() { Text = { Name = nameof(Order.Name) }, 
+                                         Value = { Name = nameof(Order.ItemValue) }, 
+                                         Icon = { Name = nameof(Order.Icon) } })"" />
+
+<BitChoiceGroup Label=""External Icons (Horizontal)"" 
+                Items=""externalIconCustoms"" 
+                DefaultValue=""@(""Day"")"" Horizontal
+                NameSelectors=""@(new() { Text = { Name = nameof(Order.Name) }, 
+                                         Value = { Name = nameof(Order.ItemValue) }, 
+                                         Icon = { Name = nameof(Order.Icon) } })"" />";
+    private readonly string example12CsharpCode = @"
+public class Order
+{
+    public string? Name { get; set; }
+    public string? ItemValue { get; set; }
+    public BitIconInfo? Icon { get; set; }
+}
+
+private readonly List<Order> externalIconCustoms =
+[
+    new() { Name = ""Day"", ItemValue = ""Day"", Icon = BitIconInfo.Fa(""solid sun"") },
+    new() { Name = ""Week"", ItemValue = ""Week"", Icon = BitIconInfo.Css(""fa-solid fa-calendar-week"") },
+    new() { Name = ""Month"", ItemValue = ""Month"", Icon = BitIconInfo.Bi(""calendar-month"") }
+];";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -867,7 +906,7 @@ public class Order
                                    ItemChecked = ""custom-checked"",
                                    ItemRadioButton = ""custom-radio-btn"" })""
                 NameSelectors=""@(new() { Text = { Selector = i => i.Name }, Value = { Selector = i => i.ItemValue } })""/>";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 public class Order
 {
     public string Name { get; set; }
@@ -892,7 +931,7 @@ public class Order
     new() { Name = ""Custom D"", ItemValue = ""D"", Class = ""custom-item"" }
 ];";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitChoiceGroup Label=""ساده""
                 Dir=""BitDir.Rtl""
                 DefaultValue=""@(""A"")""
@@ -905,7 +944,7 @@ public class Order
                 DefaultValue=""@(""A"")""
                 Items=""rtlCustoms""
                 NameSelectors=""@(new() { Text = { Selector = i => i.Name }, Value = { Selector = i => i.ItemValue } })"" />";
-    private readonly string example13CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 public class Order
 {
     public string Name { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor
index b32290cdb7..61259174a1 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="example-content">
         <BitChoiceGroup Label="Basic Items"
                         Items="basicItems"
@@ -364,7 +364,26 @@
         </div>
     </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <div>Use icons from external libraries like FontAwesome or Bootstrap Icons with the Icon parameter.</div>
+
+    <br />
+    
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    
+    <br />
+    
+    <div class="example-content column">
+        <BitChoiceGroup Label="External Icons" Items="externalIconItems" DefaultValue="@("Day")" />
+
+        <BitChoiceGroup Label="External Icons (Inline)" Items="externalIconItems" DefaultValue="@("Day")" Inline />
+
+        <BitChoiceGroup Label="External Icons (Horizontal)" Items="externalIconItems" DefaultValue="@("Day")" Horizontal />
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>Explores styling and class customization for BitChoiceGroup, including component styles, custom classes, and detailed style items.</div>
     <br /><br />
     <div>Component's Style & Class:</div>
@@ -408,7 +427,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>Use BitChoiceGroup in right-to-left (RTL).</div>
     <br />
     <div dir="rtl" class="example-content">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.cs
index 3b25addca4..c57d545b0a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
 
 public partial class _BitChoiceGroupItemDemo
 {
@@ -80,6 +80,13 @@ public partial class _BitChoiceGroupItemDemo
         new() { Text = "Month", Value = "Month", IconName = BitIconName.Calendar, IsEnabled = false }
     ];
 
+    private readonly List<BitChoiceGroupItem<string>> externalIconItems =
+    [
+        new() { Text = "Day", Value = "Day", Icon = BitIconInfo.Fa("solid sun") },
+        new() { Text = "Week", Value = "Week", Icon = BitIconInfo.Css("fa-solid fa-calendar-week") },
+        new() { Text = "Month", Value = "Month", Icon = BitIconInfo.Bi("calendar-month") }
+    ];
+
     private readonly List<BitChoiceGroupItem<string>> itemStyleClassItems =
     [
         new() { Text = "Item A", Value = "A", Class = "custom-item" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs
index 5f01906446..fd446cc780 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupItemDemo.razor.samples.cs
@@ -567,6 +567,23 @@ Horizontal Inline />
 ];";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitChoiceGroup Label=""External Icons"" Items=""externalIconItems"" DefaultValue=""@(""Day"")"" />
+
+<BitChoiceGroup Label=""External Icons (Inline)"" Items=""externalIconItems"" DefaultValue=""@(""Day"")"" Inline />
+
+<BitChoiceGroup Label=""External Icons (Horizontal)"" Items=""externalIconItems"" DefaultValue=""@(""Day"")"" Horizontal />";
+    private readonly string example12CsharpCode = @"
+private readonly List<BitChoiceGroupItem<string>> externalIconItems =
+[
+    new() { Text = ""Day"", Value = ""Day"", Icon = BitIconInfo.Fa(""solid sun"") },
+    new() { Text = ""Week"", Value = ""Week"", Icon = BitIconInfo.Css(""fa-solid fa-calendar-week"") },
+    new() { Text = ""Month"", Value = ""Month"", Icon = BitIconInfo.Bi(""calendar-month"") }
+];";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -641,7 +658,7 @@ Horizontal Inline />
                                    ItemText = ""custom-text"",
                                    ItemChecked = ""custom-checked"",
                                    ItemRadioButton = ""custom-radio-btn"" })"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private readonly List<BitChoiceGroupItem<string>> basicItems =
 [
     new() { Text = ""Item A"", Value = ""A"" },
@@ -658,10 +675,10 @@ Horizontal Inline />
     new() { Text = ""Item D"", Value = ""D"", Class = ""custom-item"" }
 ];";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitChoiceGroup Label=""ساده"" Items=""rtlItems"" DefaultValue=""@(""A"")"" Dir=""BitDir.Rtl"" />
 <BitChoiceGroup Label=""غیرفعال"" Items=""rtlItems"" IsEnabled=""false"" DefaultValue=""@(""A"")"" Dir=""BitDir.Rtl"" />";
-    private readonly string example13CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 private readonly List<BitChoiceGroupItem<string>> rtlItems = new()
 {
     new() { Text = ""بخش آ"", Value = ""A"" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor
index 1c918a0a9b..d02cadf1c4 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
     <div class="example-content">
         <BitChoiceGroup Label="Basic Options" DefaultValue="@("B")" TItem="BitChoiceGroupOption<string>" TValue="string">
             <BitChoiceGroupOption Text="Option A" Value="@("A")" />
@@ -569,7 +569,38 @@
         </div>
     </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
+    <div>Use icons from external libraries like FontAwesome or Bootstrap Icons with the Icon parameter.</div>
+    
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    
+    <br />
+    
+    <div class="example-content column">
+        <BitChoiceGroup Label="External Icons" DefaultValue="@("Day")" TItem="BitChoiceGroupOption<string>" TValue="string">
+            <BitChoiceGroupOption Text="Day" Value="@("Day")" Icon="@BitIconInfo.Fa("solid sun")" />
+            <BitChoiceGroupOption Text="Week" Value="@("Week")" Icon="@BitIconInfo.Css("fa-solid fa-calendar-week")" />
+            <BitChoiceGroupOption Text="Month" Value="@("Month")" Icon="@BitIconInfo.Bi("calendar-month")" />
+        </BitChoiceGroup>
+
+        <BitChoiceGroup Label="External Icons (Inline)" DefaultValue="@("Day")" Inline TItem="BitChoiceGroupOption<string>" TValue="string">
+            <BitChoiceGroupOption Text="Day" Value="@("Day")" Icon="@BitIconInfo.Fa("solid sun")" />
+            <BitChoiceGroupOption Text="Week" Value="@("Week")" Icon="@BitIconInfo.Css("fa-solid fa-calendar-week")" />
+            <BitChoiceGroupOption Text="Month" Value="@("Month")" Icon="@BitIconInfo.Bi("calendar-month")" />
+        </BitChoiceGroup>
+
+        <BitChoiceGroup Label="External Icons (Horizontal)" DefaultValue="@("Day")" Horizontal TItem="BitChoiceGroupOption<string>" TValue="string">
+            <BitChoiceGroupOption Text="Day" Value="@("Day")" Icon="@BitIconInfo.Fa("solid sun")" />
+            <BitChoiceGroupOption Text="Week" Value="@("Week")" Icon="@BitIconInfo.Css("fa-solid fa-calendar-week")" />
+            <BitChoiceGroupOption Text="Month" Value="@("Month")" Icon="@BitIconInfo.Bi("calendar-month")" />
+        </BitChoiceGroup>
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" Id="example13">
     <div>Explores styling and class customization for BitChoiceGroup, including component styles, custom classes, and detailed style items.</div>
     <br /><br />
     <div>Component's Style & Class:</div>
@@ -634,7 +665,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
     <div>Use BitChoiceGroup in right-to-left (RTL).</div>
     <br />
     <div dir="rtl" class="example-content">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs
index d0736310c5..a4ae96f13c 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/ChoiceGroup/_BitChoiceGroupOptionDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.ChoiceGroup;
 
 public partial class _BitChoiceGroupOptionDemo
 {
@@ -526,6 +526,28 @@ private void HandleValidSubmit() { }
 </BitChoiceGroup>";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitChoiceGroup Label=""External Icons"" DefaultValue=""@(""Day"")"" TItem=""BitChoiceGroupOption<string>"" TValue=""string"">
+    <BitChoiceGroupOption Text=""Day"" Value=""@(""Day"")"" Icon=""@BitIconInfo.Fa(""solid sun"")"" />
+    <BitChoiceGroupOption Text=""Week"" Value=""@(""Week"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-calendar-week"")"" />
+    <BitChoiceGroupOption Text=""Month"" Value=""@(""Month"")"" Icon=""@BitIconInfo.Bi(""calendar-month"")"" />
+</BitChoiceGroup>
+
+<BitChoiceGroup Label=""External Icons (Inline)"" DefaultValue=""@(""Day"")"" Inline TItem=""BitChoiceGroupOption<string>"" TValue=""string"">
+    <BitChoiceGroupOption Text=""Day"" Value=""@(""Day"")"" Icon=""@BitIconInfo.Fa(""solid sun"")"" />
+    <BitChoiceGroupOption Text=""Week"" Value=""@(""Week"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-calendar-week"")"" />
+    <BitChoiceGroupOption Text=""Month"" Value=""@(""Month"")"" Icon=""@BitIconInfo.Bi(""calendar-month"")"" />
+</BitChoiceGroup>
+
+<BitChoiceGroup Label=""External Icons (Horizontal)"" DefaultValue=""@(""Day"")"" Horizontal TItem=""BitChoiceGroupOption<string>"" TValue=""string"">
+    <BitChoiceGroupOption Text=""Day"" Value=""@(""Day"")"" Icon=""@BitIconInfo.Fa(""solid sun"")"" />
+    <BitChoiceGroupOption Text=""Week"" Value=""@(""Week"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-calendar-week"")"" />
+    <BitChoiceGroupOption Text=""Month"" Value=""@(""Month"")"" Icon=""@BitIconInfo.Bi(""calendar-month"")"" />
+</BitChoiceGroup>";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -622,7 +644,7 @@ private void HandleValidSubmit() { }
     <BitChoiceGroupOption Text=""Option D"" Value=""@(""D"")"" />
 </BitChoiceGroup>";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitChoiceGroup Label=""ساده"" TItem=""BitChoiceGroupOption<string>"" TValue=""string"" DefaultValue=""@(""A"")"" Dir=""BitDir.Rtl"">
     <BitChoiceGroupOption Text=""گزینه آ"" Value=""@(""A"")"" />
     <BitChoiceGroupOption Text=""گزینه ب"" Value=""@(""B"")"" />

From 938c99c6f138790161a523ae78b62498f44634fd Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 13 Feb 2026 18:16:45 +0330
Subject: [PATCH 03/66] feat(blazorui): add new Icon parameter to
 BitCircularTimePicker #12080 (#12081)

---
 .../BitCircularTimePicker.razor               |  8 ++--
 .../BitCircularTimePicker.razor.cs            | 45 +++++++++++++++++--
 .../BitCircularTimePickerDemo.razor           | 33 ++++++++++++--
 .../BitCircularTimePickerDemo.razor.cs        | 27 +++++++++--
 ...BitCircularTimePickerDemo.razor.samples.cs | 22 ++++++++-
 5 files changed, 121 insertions(+), 14 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor
index 4ae15410e3..f8496d2132 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<TimeSpan?>
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -53,7 +53,8 @@
                 }
                 else
                 {
-                    <i style="@Styles?.Icon" class="bit-ctp-ico bit-icon bit-icon--@IconName @Classes?.Icon" aria-hidden="true" />
+                    var icon = BitIconInfo.From(Icon, IconName ?? "Clock");
+                    <i style="@Styles?.Icon" class="bit-ctp-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
                 }
             </div>
         </div>
@@ -183,13 +184,14 @@
 
             @if (ShowCloseButton && Standalone is false)
             {
+                var closeButtonIcon = BitIconInfo.From(CloseButtonIcon, CloseButtonIconName ?? "Cancel");
                 <button @onclick="CloseCallout"
                         type="button"
                         style="@Styles?.CloseButton"
                         class="bit-ctp-cbn @Classes?.CloseButton"
                         title="@CloseButtonTitle"
                         aria-label="@CloseButtonTitle">
-                    <i style="@Styles?.CloseButtonIcon" class="bit-ctp-cbi bit-icon bit-icon--Cancel @Classes?.CloseButtonIcon" aria-hidden="true" />
+                    <i style="@Styles?.CloseButtonIcon" class="bit-ctp-cbi @closeButtonIcon?.GetCssClasses() @Classes?.CloseButtonIcon" aria-hidden="true" />
                 </button>
             }
         </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs
index 345f455392..34fd5b04ff 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/CircularTimePicker/BitCircularTimePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
@@ -54,6 +54,24 @@ public partial class BitCircularTimePicker : BitInputBase<TimeSpan?>
     /// </summary>
     [Parameter] public BitCircularTimePickerClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The icon to display on the close button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="CloseButtonIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="CloseButtonIconName"/> instead.
+    /// </remarks>
+    [Parameter] public BitIconInfo? CloseButtonIcon { get; set; }
+
+    /// <summary>
+    /// The name of the icon to display on the close button from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// For external icon libraries, use <see cref="CloseButtonIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? CloseButtonIconName { get; set; }
+
     /// <summary>
     /// The title of the close button (tooltip).
     /// </summary>
@@ -84,9 +102,30 @@ public partial class BitCircularTimePicker : BitInputBase<TimeSpan?>
     public BitIconLocation IconLocation { get; set; } = BitIconLocation.Right;
 
     /// <summary>
-    /// Optional TimePicker icon
+    /// The icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// The name of the icon to display from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string IconName { get; set; } = "Clock";
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Clock</c>).
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
+    [Parameter] public string? IconName { get; set; }
 
     /// <summary>
     /// Custom TimePicker icon template
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor
index 83e4caba6d..a184ca61f7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/circulartimepicker"
+@page "/components/circulartimepicker"
 @page "/components/circular-time-picker"
 @using Bit.BlazorUI.Demo.Client.Core.Helpers
 
@@ -194,7 +194,34 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+        <br />
+        <br />
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        <div>FontAwesome:</div>
+        <br />
+        <div class="example-content">
+            <BitCircularTimePicker Label="FontAwesome" Icon="@("fa-solid fa-clock")" />
+            <br /><br />
+            <BitCircularTimePicker Label="FontAwesome (Css)" Icon="@BitIconInfo.Css("fa-solid fa-heart")" />
+            <br /><br />
+            <BitCircularTimePicker Label="FontAwesome (Fa)" Icon="@BitIconInfo.Fa("solid clock")" />
+        </div>
+        <br /><br />
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        <div>Bootstrap:</div>
+        <br />
+        <div class="example-content">
+            <BitCircularTimePicker Label="Bootstrap" Icon="@("bi bi-clock-fill")" />
+            <br /><br />
+            <BitCircularTimePicker Label="Bootstrap (Css)" Icon="@BitIconInfo.Css("bi bi-heart-fill")" />
+            <br /><br />
+            <BitCircularTimePicker Label="Bootstrap (Bi)" Icon="@BitIconInfo.Bi("clock-fill")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
         <div>Explore styling and class customization for BitCircularTimePicker, including component styles, custom classes, and detailed styles.</div>
         <br /><br />
         <div>Component's Style & Class:</div>
@@ -237,7 +264,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
+    <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
         <div>Use BitCircularTimePicker in a right-to-left (RTL) layout.</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.cs
index 2e03e558ab..0ef4bea2b5 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.CircularTimePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.CircularTimePicker;
 
 public partial class BitCircularTimePickerDemo
 {
@@ -42,6 +42,20 @@ public partial class BitCircularTimePickerDemo
             LinkType = LinkType.Link
         },
         new()
+        {
+            Name = "CloseButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the close button using external icon libraries. Takes precedence over CloseButtonIconName when both are set."
+        },
+        new()
+        {
+            Name = "CloseButtonIconName",
+            Type = "string?",
+            DefaultValue = "Cancel",
+            Description = "The name of the icon for the close button from the built-in Fluent UI icons. For external icon libraries, use CloseButtonIcon instead."
+        },
+        new()
         {
             Name = "CloseButtonTitle",
             Type = "string",
@@ -81,11 +95,18 @@ public partial class BitCircularTimePickerDemo
             Description = "TimePicker icon location."
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display using custom CSS classes for external icon libraries (e.g., FontAwesome, Bootstrap Icons). Takes precedence over IconName when both are set."
+        },
+        new()
         {
             Name = "IconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "Clock",
-            Description = "Optional TimePicker icon."
+            Description = "The name of the icon from the built-in Fluent UI icons. For external icon libraries, use Icon instead."
         },
         new()
         {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.samples.cs
index 8e6cea32d0..0530979858 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/CircularTimePicker/BitCircularTimePickerDemo.razor.samples.cs
@@ -137,6 +137,24 @@ private async Task HandleValidSubmit()
 }";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitCircularTimePicker Label=""FontAwesome"" Icon=""@(""fa-solid fa-clock"")"" />
+
+<BitCircularTimePicker Label=""FontAwesome (Css)"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" />
+
+<BitCircularTimePicker Label=""FontAwesome (Fa)"" Icon=""@BitIconInfo.Fa(""solid clock"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitCircularTimePicker Label=""Bootstrap"" Icon=""@(""bi bi-clock-fill"")"" />
+
+<BitCircularTimePicker Label=""Bootstrap (Css)"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" />
+
+<BitCircularTimePicker Label=""Bootstrap (Bi)"" Icon=""@BitIconInfo.Bi(""clock-fill"")"" />";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -266,9 +284,9 @@ private async Task HandleValidSubmit()
                                           ClockPointerThumb = ""custom-clock-pointer-thumb"",
                                           ClockSelectedNumber = ""custom-clock-selected-number"",
                                           ClockPointerThumbMinute = ""custom-clock-pointer-thumb-minute"" })"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private TimeSpan? classesValue;";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitCircularTimePicker Dir=""BitDir.Rtl"" />";
 }

From 8e4d2183863b6872700757d4df73b1d14482c9fa Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 13 Feb 2026 19:14:19 +0330
Subject: [PATCH 04/66] feat(blazorui): add new Icon parameter to BitDatePicker
 #12082 (#12083)

---
 .../Inputs/DatePicker/BitDatePicker.razor     |   5 +-
 .../Inputs/DatePicker/BitDatePicker.razor.cs  |  26 +-
 .../Inputs/DatePicker/BitDatePickerDemo.razor |  37 ++-
 .../DatePicker/BitDatePickerDemo.razor.cs     | 248 ++++++++++--------
 .../BitDatePickerDemo.razor.samples.cs        |  24 +-
 5 files changed, 224 insertions(+), 116 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
index 4c7526594b..554d4f2f42 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<DateTimeOffset?>
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -66,7 +66,8 @@
                 }
                 else
                 {
-                    <i style="@Styles?.Icon" class="bit-dtp-ico bit-icon bit-icon--@IconName @Classes?.Icon" aria-hidden="true" />
+                    var icon = BitIconInfo.From(Icon, IconName ?? "CalendarMirrored");
+                    <i style="@Styles?.Icon" class="bit-dtp-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
                 }
             </div>
         </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
index 186d313710..05601dcdf8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
@@ -234,9 +234,29 @@ private int _minuteView
     public BitIconLocation IconLocation { get; set; } = BitIconLocation.Right;
 
     /// <summary>
-    /// The name of the DatePicker's icon.
+    /// The icon to display in the DatePicker input.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
-    [Parameter] public string IconName { get; set; } = "CalendarMirrored";
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("calendar3")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid calendar")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// The name of the DatePicker's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.CalendarMirrored</c>).
+    /// Defaults to "CalendarMirrored" when not set.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
+    [Parameter] public string? IconName { get; set; }
 
     /// <summary>
     /// The custom validation error message for the invalid value.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
index d8639d9bd1..d7585a6b16 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
@@ -9,8 +9,8 @@
 <DemoPage Name="DatePicker"
           Description="A BitDatePicker offers a drop-down control that’s optimized for picking a single date from a calendar view where contextual information like the day of the week or fullness of the calendar is important. You can modify the calendar to provide additional context or to limit available dates."
           Parameters="componentParameters"
-          SubEnums="componentSubEnums"
           SubClasses="componentSubClasses"
+          SubEnums="componentSubEnums"
           GitHubUrl="Inputs/DatePicker/BitDatePicker.razor"
           GitHubDemoUrl="Inputs/DatePicker/BitDatePickerDemo.razor">
     <DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
@@ -306,7 +306,38 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+    <DemoExample Title="External Icons" RazorCode="@example15RazorCode" Id="example15">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+
+        <br />
+        <br />
+
+        <div class="example-content">
+            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+            <div>FontAwesome:</div>
+            <br />
+            <BitDatePicker Label="Icon (string)" Icon="@("fa-solid fa-calendar-days")" />
+            <br />
+            <BitDatePicker Label="BitIconInfo.Css" Icon="@BitIconInfo.Css("fa-solid fa-calendar-days")" />
+            <br />
+            <BitDatePicker Label="BitIconInfo.Fa" Icon="@BitIconInfo.Fa("solid calendar")" />
+
+            <br /><br /><br />
+
+            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+            <div>Bootstrap:</div>
+            <br />
+            <BitDatePicker Label="Icon (string)" Icon="@("bi bi-calendar3")" />
+            <br />
+            <BitDatePicker Label="BitIconInfo.Css" Icon="@BitIconInfo.Css("bi bi-calendar3-event")" />
+            <br />
+            <BitDatePicker Label="BitIconInfo.Bi" Icon="@BitIconInfo.Bi("calendar3")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
         <div>Explore styling and class customization for BitDatePicker, including component styles, custom classes, and detailed styles.</div>
         <br /><br />
         <div>Component's Style & Class:</div><br />
@@ -353,7 +384,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example16RazorCode" Id="example16">
+    <DemoExample Title="RTL" RazorCode="@example17RazorCode" Id="example17">
         <div>Use BitDatePicker in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
index 3dfc923792..adc6a26116 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
@@ -2,8 +2,8 @@
 
 public partial class BitDatePickerDemo
 {
-    private readonly List<ComponentParameter> componentParameters = new()
-    {
+    private readonly List<ComponentParameter> componentParameters =
+    [
         new()
         {
             Name = "AllowTextInput",
@@ -149,11 +149,20 @@ public partial class BitDatePickerDemo
             Href = "#icon-location-enum"
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display in the DatePicker input using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "CalendarMirrored",
-            Description = "The name of the DatePicker's icon."
+            Description = "The name of the DatePicker's icon from the built-in Fluent UI icon set. For external icon libraries, use Icon instead."
         },
         new()
         {
@@ -402,110 +411,16 @@ public partial class BitDatePickerDemo
             DefaultValue = "1",
             Description = "Determines increment/decrement steps for date-picker's minute.",
         }
-    };
+    ];
 
-    private readonly List<ComponentSubEnum> componentSubEnums = new()
-    {
-        new()
-        {
-            Id = "component-visibility-enum",
-            Name = "BitVisibility",
-            Description = "",
-            Items = new()
-            {
-                new()
-                {
-                    Name = "Visible",
-                    Description = "Show content of the component.",
-                    Value = "0"
-                },
-                new()
-                {
-                    Name = "Hidden",
-                    Description = "Hide content of the component,though the space it takes on the page remains.",
-                    Value = "1"
-                },
-                new()
-                {
-                    Name = "Collapsed",
-                    Description = "Hide content of the component,though the space it takes on the page gone.",
-                    Value = "2"
-                }
-            }
-        },
-        new()
-        {
-            Id = "icon-location-enum",
-            Name = "BitIconLocation",
-            Description = "",
-            Items = new()
-            {
-                new()
-                {
-                    Name = "Left",
-                    Description = "Show the icon at the left side.",
-                    Value = "0"
-                },
-                new()
-                {
-                    Name = "Right",
-                    Description = "Show the icon at the right side.",
-                    Value = "1"
-                }
-            }
-        },
-        new()
-        {
-            Id = "time-format-enum",
-            Name = "BitTimeFormat",
-            Description = "",
-            Items = new()
-            {
-                new()
-                {
-                    Name= "TwentyFourHours",
-                    Description="Show time pickers in 24 hours format.",
-                    Value="0"
-                },
-                new()
-                {
-                    Name= "TwelveHours",
-                    Description="Show time pickers in 12 hours format.",
-                    Value="1"
-                }
-            }
-        },
-        new()
-        {
-            Id = "datepicker-mode-enum",
-            Name = "BitDatePickerMode",
-            Description = "",
-            Items = new()
-            {
-                new()
-                {
-                    Name = "DatePicker",
-                    Description = "Standard date picker mode allowing selection of a specific day.",
-                    Value = "0"
-                },
-                new()
-                {
-                    Name = "MonthPicker",
-                    Description = "Month picker mode allowing selection of only month and year. The day is automatically set to the 1st of the selected month.",
-                    Value = "1"
-                }
-            }
-        }
-    };
-
-    private readonly List<ComponentSubClass> componentSubClasses = new()
-    {
+    private readonly List<ComponentSubClass> componentSubClasses =
+    [
         new()
         {
             Id = "datepicker-class-styles",
             Title = "BitDatePickerClassStyles",
-            Parameters = new()
-            {
+            Parameters =
+            [
                 new()
                 {
                     Name = "Root",
@@ -933,9 +848,132 @@ public partial class BitDatePickerDemo
                     DefaultValue = "null",
                     Description = "Custom CSS classes/styles for each year button of the BitDatePicker."
                 }
-            }
+            ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
+    ];
+
+    private readonly List<ComponentSubEnum> componentSubEnums =
+    [
+        new()
+        {
+            Id = "component-visibility-enum",
+            Name = "BitVisibility",
+            Description = "",
+            Items =
+            [
+                new()
+                {
+                    Name = "Visible",
+                    Description = "Show content of the component.",
+                    Value = "0"
+                },
+                new()
+                {
+                    Name = "Hidden",
+                    Description = "Hide content of the component,though the space it takes on the page remains.",
+                    Value = "1"
+                },
+                new()
+                {
+                    Name = "Collapsed",
+                    Description = "Hide content of the component,though the space it takes on the page gone.",
+                    Value = "2"
+                }
+            ]
+        },
+        new()
+        {
+            Id = "icon-location-enum",
+            Name = "BitIconLocation",
+            Description = "",
+            Items =
+            [
+                new()
+                {
+                    Name = "Left",
+                    Description = "Show the icon at the left side.",
+                    Value = "0"
+                },
+                new()
+                {
+                    Name = "Right",
+                    Description = "Show the icon at the right side.",
+                    Value = "1"
+                }
+            ]
+        },
+        new()
+        {
+            Id = "time-format-enum",
+            Name = "BitTimeFormat",
+            Description = "",
+            Items =
+            [
+                new()
+                {
+                    Name= "TwentyFourHours",
+                    Description="Show time pickers in 24 hours format.",
+                    Value="0"
+                },
+                new()
+                {
+                    Name= "TwelveHours",
+                    Description="Show time pickers in 12 hours format.",
+                    Value="1"
+                }
+            ]
+        },
+        new()
+        {
+            Id = "datepicker-mode-enum",
+            Name = "BitDatePickerMode",
+            Description = "",
+            Items =
+            [
+                new()
+                {
+                    Name = "DatePicker",
+                    Description = "Standard date picker mode allowing selection of a specific day.",
+                    Value = "0"
+                },
+                new()
+                {
+                    Name = "MonthPicker",
+                    Description = "Month picker mode allowing selection of only month and year. The day is automatically set to the 1st of the selected month.",
+                    Value = "1"
+                }
+            ]
         }
-    };
+    ];
 
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
index 96ce6a1201..9530332d7e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DatePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DatePicker;
 
 public partial class BitDatePickerDemo
 {
@@ -231,6 +231,24 @@ private void HandleValidSubmit() { }
 private void HandleInvalidSubmit() { }";
 
     private readonly string example15RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitDatePicker Label=""Icon (string)"" Icon=""@(""fa-solid fa-calendar-days"")"" />
+
+<BitDatePicker Label=""BitIconInfo.Css"" Icon=""@BitIconInfo.Css(""fa-solid fa-calendar-days"")"" />
+
+<BitDatePicker Label=""BitIconInfo.Fa"" Icon=""@BitIconInfo.Fa(""solid calendar"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDatePicker Label=""Icon (string)"" Icon=""@(""bi bi-calendar3"")"" />
+
+<BitDatePicker Label=""BitIconInfo.Css"" Icon=""@BitIconInfo.Css(""bi bi-calendar3-event"")"" />
+
+<BitDatePicker Label=""BitIconInfo.Bi"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />";
+
+    private readonly string example16RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -391,9 +409,9 @@ private void HandleValidSubmit() { }
                                   DayPickerHeader = ""custom-day-header"",
                                   WeekNumbersHeader = ""custom-week-header"",
                                   YearMonthPickerWrapper = ""custom-year-picker"" })"" />";
-    private readonly string example15CsharpCode = @"
+    private readonly string example16CsharpCode = @"
 private DateTimeOffset? classesValue;";
 
-    private readonly string example16RazorCode = @"
+    private readonly string example17RazorCode = @"
 <BitDatePicker Dir=""BitDir.Rtl"" />";
 }

From 23cf7fe46fec99ef65851668ba906ed97447facc Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 13 Feb 2026 20:49:35 +0330
Subject: [PATCH 05/66] feat(blazorui): add new Icon parameter to
 BitDateRangePicker #12084 (#12085)

---
 .../DateRangePicker/BitDateRangePicker.razor  |  5 +-
 .../BitDateRangePicker.razor.cs               | 29 ++++++-
 .../BitDateRangePickerDemo.razor              | 38 ++++++++-
 .../BitDateRangePickerDemo.razor.cs           | 84 ++++++++++++++-----
 .../BitDateRangePickerDemo.razor.samples.cs   | 24 +++++-
 5 files changed, 146 insertions(+), 34 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
index 8ef5318401..73d3eb54bb 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<BitDateRangePickerValue?>
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -65,7 +65,8 @@
                 }
                 else
                 {
-                    <i style="@Styles?.Icon" class="bit-dtrp-ico bit-icon bit-icon--@IconName @Classes?.Icon" aria-hidden="true" />
+                    var icon = BitIconInfo.From(Icon, IconName ?? "CalendarMirrored");
+                    <i style="@Styles?.Icon" class="bit-dtrp-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
                 }
             </div>
         </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
index 2ecdd960d9..e0b2870f4b 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
@@ -296,9 +296,32 @@ private int _endTimeMinuteView
     public BitIconLocation IconLocation { get; set; } = BitIconLocation.Right;
 
     /// <summary>
-    /// The name of the DateRangePicker's icon.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
-    [Parameter] public string IconName { get; set; } = "CalendarMirrored";
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("calendar3")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid calendar")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.CalendarMirrored</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
+    [Parameter] public string? IconName { get; set; }
 
     /// <summary>
     /// The custom validation error message for the invalid value.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
index 7709e684ee..b9e6b5cff6 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/daterangepicker"
+@page "/components/daterangepicker"
 @page "/components/date-range-picker"
 @using Bit.BlazorUI.Demo.Client.Core.Helpers
 
@@ -251,7 +251,39 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+        
+        <br /><br />
+        
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+        <div>FontAwesome:</div>
+        <br />
+        <div class="example-content">
+            <BitDateRangePicker Label="FontAwesome (string)" Icon="@("fa-solid fa-calendar-days")" />
+            <br />
+            <BitDateRangePicker Label="FontAwesome (Css)" Icon="@BitIconInfo.Css("fa-solid fa-calendar-week")" />
+            <br />
+            <BitDateRangePicker Label="FontAwesome (Fa)" Icon="@BitIconInfo.Fa("solid calendar")" />
+        </div>
+
+        <br /><br /><br />
+        
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        
+        <div>Bootstrap:</div>
+        <br />
+        <div class="example-content">
+            <BitDateRangePicker Label="Bootstrap (string)" Icon="@("bi bi-calendar3")" />
+            <br />
+            <BitDateRangePicker Label="Bootstrap (Css)" Icon="@BitIconInfo.Css("bi bi-calendar-range")" />
+            <br />
+            <BitDateRangePicker Label="Bootstrap (Bi)" Icon="@BitIconInfo.Bi("calendar3")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
         <div>Explore styling and class customization for BitDateRangePicker, including component styles, custom classes, and detailed styles.</div>
         <br /><br />
         <div>Component's Style & Class:</div>
@@ -308,7 +340,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
+    <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
         <div>Use BitDateRangePicker in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
index d63b90726f..6590f80daa 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
@@ -2,8 +2,8 @@
 
 public partial class BitDateRangePickerDemo
 {
-    private readonly List<ComponentParameter> componentParameters = new()
-    {
+    private readonly List<ComponentParameter> componentParameters =
+    [
         new()
         {
             Name = "AllowTextInput",
@@ -163,11 +163,20 @@ public partial class BitDateRangePickerDemo
             Href = "#icon-location-enum",
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display. Takes precedence over IconName when both are set. Use for external libraries (e.g. BitIconInfo.Fa(\"solid calendar\"), BitIconInfo.Bi(\"calendar3\"), BitIconInfo.Css(\"my-class\")).",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "CalendarMirrored",
-            Description = "The name of the DateRangePicker's icon."
+            Description = "The name of the icon from the built-in Fluent UI icon set. For external icon libraries, use Icon instead."
         },
         new()
         {
@@ -428,16 +437,16 @@ public partial class BitDateRangePickerDemo
             DefaultValue = "1",
             Description = "Determines increment/decrement steps for DateRangePicker's minute.",
         }
-    };
+    ];
 
-    private readonly List<ComponentSubClass> componentSubClasses = new()
-    {
+    private readonly List<ComponentSubClass> componentSubClasses =
+    [
         new()
         {
             Id = "date-range-picker-value",
             Title = "BitDateRangePickerValue",
-            Parameters = new()
-            {
+            Parameters =
+            [
                new()
                {
                    Name = "StartDate",
@@ -452,14 +461,14 @@ public partial class BitDateRangePickerDemo
                    DefaultValue = "null",
                    Description = "Indicates the end of the date range.",
                }
-            }
+            ]
         },
         new()
         {
             Id = "daterangepicker-class-styles",
             Title = "BitDateRangePickerClassStyles",
-            Parameters = new()
-            {
+            Parameters =
+            [
                 new()
                 {
                     Name = "Root",
@@ -936,19 +945,48 @@ public partial class BitDateRangePickerDemo
                     DefaultValue = "null",
                     Description = "Custom CSS classes/styles for each year button of the BitDateRangePicker."
                 }
-            }
+            ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon."
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+                },
+            ]
         }
-    };
+    ];
 
-    private readonly List<ComponentSubEnum> componentSubEnums = new()
-    {
+    private readonly List<ComponentSubEnum> componentSubEnums =
+    [
         new()
         {
             Id = "icon-location-enum",
             Name = "BitIconLocation",
             Description = "",
-            Items = new()
-            {
+            Items =
+            [
                 new()
                 {
                     Name= "Left",
@@ -961,15 +999,15 @@ public partial class BitDateRangePickerDemo
                     Description="Show the icon at the right side.",
                     Value="1",
                 }
-            }
+            ]
         },
         new()
         {
             Id = "time-format-enum",
             Name = "BitTimeFormat",
             Description = "",
-            Items = new()
-            {
+            Items =
+            [
                 new()
                 {
                     Name= "TwentyFourHours",
@@ -982,9 +1020,9 @@ public partial class BitDateRangePickerDemo
                     Description="Show time pickers in 12 hours format.",
                     Value="1",
                 }
-            }
+            ]
         }
-    };
+    ];
 
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
index 69d6bdaf6b..8e0d09e714 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DateRangePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DateRangePicker;
 
 public partial class BitDateRangePickerDemo
 {
@@ -149,6 +149,24 @@ public partial class BitDateRangePickerDemo
                     Placeholder=""Select a date range"" />";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitDateRangePicker Label=""FontAwesome (string)"" Icon=""@(""fa-solid fa-calendar-days"")"" />
+
+<BitDateRangePicker Label=""FontAwesome (Css)"" Icon=""@BitIconInfo.Css(""fa-solid fa-calendar-week"")"" />
+
+<BitDateRangePicker Label=""FontAwesome (Fa)"" Icon=""@BitIconInfo.Fa(""solid calendar"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDateRangePicker Label=""Bootstrap (string)"" Icon=""@(""bi bi-calendar3"")"" />
+
+<BitDateRangePicker Label=""Bootstrap (Css)"" Icon=""@BitIconInfo.Css(""bi bi-calendar-range"")"" />
+
+<BitDateRangePicker Label=""Bootstrap (Bi)"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -333,9 +351,9 @@ public partial class BitDateRangePickerDemo
                                        DayPickerHeader = ""custom-day-header"",
                                        WeekNumbersHeader = ""custom-week-header"",
                                        YearMonthPickerWrapper = ""custom-year-picker"" })"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private BitDateRangePickerValue? classesValue;";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitDateRangePicker Dir=""BitDir.Rtl"" />";
 }

From 6a513f4520685a897e13619333799cc79c33ddae Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sat, 14 Feb 2026 00:22:20 +0330
Subject: [PATCH 06/66] feat(blazorui): add new Icon parameter to BitDropdown
 #12086 (#12087)

---
 .../Inputs/Dropdown/BitDropdown.razor         |   5 +-
 .../Inputs/Dropdown/BitDropdown.razor.cs      |  55 ++++++-
 .../Inputs/Dropdown/BitDropdown.scss          |   5 +-
 .../Inputs/Dropdown/BitDropdownClassStyles.cs |   7 +-
 .../Inputs/Dropdown/BitDropdownItem.cs        |  16 +-
 .../Dropdown/BitDropdownNameSelectors.cs      |  12 +-
 .../Inputs/Dropdown/BitDropdownOption.cs      |  16 +-
 .../Inputs/Dropdown/_BitDropdownItem.razor    |  10 ++
 .../Inputs/Dropdown/BitDropdownDemo.razor     |   5 +-
 .../Inputs/Dropdown/BitDropdownDemo.razor.cs  |  99 +++++++++++-
 .../Components/Inputs/Dropdown/Product.cs     |  12 +-
 .../Dropdown/_BitDropdownCustomDemo.razor     | 136 ++++++++++-------
 .../Dropdown/_BitDropdownCustomDemo.razor.cs  |  48 +++++-
 .../_BitDropdownCustomDemo.razor.samples.cs   | 131 ++++++++++++++--
 .../Dropdown/_BitDropdownItemDemo.razor       | 142 +++++++++++-------
 .../Dropdown/_BitDropdownItemDemo.razor.cs    |  44 +++++-
 .../_BitDropdownItemDemo.razor.samples.cs     | 103 +++++++++++--
 .../Dropdown/_BitDropdownOptionDemo.razor     |  75 ++++++++-
 .../_BitDropdownOptionDemo.razor.samples.cs   |  84 ++++++++++-
 19 files changed, 856 insertions(+), 149 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
index 047d0c4269..535733af9a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<TValue>
 @typeparam TItem
 @typeparam TValue
@@ -131,9 +131,10 @@
             }
             else
             {
+                var icon = BitIconInfo.From(CaretDownIcon, CaretDownIconName ?? "ChevronRight bit-ico-r90");
                 <i aria-hidden="true"
                    style="@Styles?.CaretDownIcon"
-                   class="bit-icon bit-icon--@(CaretDownIconName ?? "ChevronRight bit-ico-r90") @Classes?.CaretDownIcon" />
+                   class="@icon?.GetCssClasses() @Classes?.CaretDownIcon" />
             }
         </span>
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
index 3a3009de98..c2c245ee17 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Linq.Expressions;
 using System.Diagnostics.CodeAnalysis;
 
@@ -52,7 +52,21 @@ namespace Bit.BlazorUI;
     [Parameter] public RenderFragment? CalloutFooterTemplate { get; set; }
 
     /// <summary>
-    /// The icon name of the chevron down element of the dropdown.
+    /// The icon of the chevron down element of the dropdown.
+    /// Takes precedence over <see cref="CaretDownIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="CaretDownIconName"/> instead.
+    /// </summary>
+    /// <example>
+    /// Bootstrap: CaretDownIcon="BitIconInfo.Bi("chevron-down")"
+    /// FontAwesome: CaretDownIcon="BitIconInfo.Fa("solid chevron-down")"
+    /// Custom CSS: CaretDownIcon="BitIconInfo.Css("my-chevron-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? CaretDownIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the chevron down element of the dropdown from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="CaretDownIcon"/> instead.
     /// </summary>
     [Parameter] public string? CaretDownIconName { get; set; }
 
@@ -737,6 +751,43 @@ internal BitDropdownItemType GetItemType(TItem item)
         return item.GetValueFromProperty<string?>(NameSelectors.Title.Name);
     }
 
+    internal BitIconInfo? GetIcon(TItem item)
+    {
+        if (item is BitDropdownItem<TValue> dropdownItem)
+        {
+            return BitIconInfo.From(dropdownItem.Icon, dropdownItem.IconName);
+        }
+
+        if (item is BitDropdownOption<TValue> dropdownOption)
+        {
+            return BitIconInfo.From(dropdownOption.Icon, dropdownOption.IconName);
+        }
+
+        if (NameSelectors is null) return null;
+
+        BitIconInfo? icon = null;
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            icon = NameSelectors.Icon.Selector!(item);
+        }
+        else
+        {
+            icon = item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+        }
+
+        string? iconName = null;
+        if (NameSelectors.IconName.Selector is not null)
+        {
+            iconName = NameSelectors.IconName.Selector!(item);
+        }
+        else
+        {
+            iconName = item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
+        }
+
+        return BitIconInfo.From(icon, iconName);
+    }
+
     internal TValue? GetValue(TItem? item)
     {
         if (item is null) return default;
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
index 867ceb74d8..2072d04643 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 @import "../../../Styles/media-queries.scss";
 
 .bit-drp {
@@ -661,12 +661,14 @@
 .bit-drp-itm {
     width: 100%;
     display: flex;
+    gap: spacing(1);
     cursor: pointer;
     overflow: hidden;
     font-weight: 400;
     text-align: start;
     user-select: none;
     position: relative;
+    color: $clr-fg-pri;
     white-space: nowrap;
     align-items: center;
     height: spacing(4.5);
@@ -678,7 +680,6 @@
     font-size: spacing(1.875);
     line-height: spacing(2.5);
     background-color: transparent;
-    color: $clr-fg-pri;
     border: $shp-border-width $shp-border-style transparent;
 
     @media (hover: hover) {
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
index 0a045cea18..0f7d2dfbb8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitDropdownClassStyles
 {
@@ -142,6 +142,11 @@ public class BitDropdownClassStyles
     /// </summary>
     public string? ItemCheckIcon { get; set; }
 
+    /// <summary>
+    /// Custom CSS classes/styles for the item icon of the BitDropdown.
+    /// </summary>
+    public string? ItemIcon { get; set; }
+
     /// <summary>
     /// Custom CSS classes/styles for the item text of the BitDropdown.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownItem.cs
index 606fe962e6..8eb52c77dd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownItem.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitDropdownItem<TValue>
 {
@@ -12,6 +12,20 @@ public class BitDropdownItem<TValue>
     /// </summary>
     public string? Class { get; set; }
 
+    /// <summary>
+    /// The icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// The icon name from the Fluent UI icon set to display for the dropdown item.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </summary>
+    public string? IconName { get; set; }
+
     /// <summary>
     /// The id for the dropdown item.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownNameSelectors.cs
index c502c95e61..87c9bbf392 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownNameSelectors.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitDropdownNameSelectors<TItem, TValue>
 {
@@ -12,6 +12,16 @@ public class BitDropdownNameSelectors<TItem, TValue>
     /// </summary>
     public BitNameSelectorPair<TItem, string?> Class { get; set; } = new(nameof(BitDropdownItem<TValue>.Class));
 
+    /// <summary>
+    /// The Icon field name and selector of the custom input class.
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitDropdownItem<TValue>.Icon));
+
+    /// <summary>
+    /// The IconName field name and selector of the custom input class.
+    /// </summary>
+    public BitNameSelectorPair<TItem, string?> IconName { get; set; } = new(nameof(BitDropdownItem<TValue>.IconName));
+
     /// <summary>
     /// The Id field name and selector of the custom input class.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownOption.cs
index 017dfdf522..087f5ad981 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownOption.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownOption.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitDropdownOption<TValue> : ComponentBase, IDisposable
 {
@@ -17,6 +17,20 @@ public partial class BitDropdownOption<TValue> : ComponentBase, IDisposable
     /// </summary>
     [Parameter] public string? Class { get; set; }
 
+    /// <summary>
+    /// The icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// The icon name from the Fluent UI icon set to display for the dropdown option.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </summary>
+    [Parameter] public string? IconName { get; set; }
+
     /// <summary>
     /// The id for the dropdown option.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/_BitDropdownItem.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/_BitDropdownItem.razor
index 36feec0168..3fe0d50c9a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/_BitDropdownItem.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/_BitDropdownItem.razor
@@ -53,6 +53,11 @@
                     }
                     else
                     {
+                        var itemIcon = Dropdown.GetIcon(Item);
+                        @if (itemIcon is not null)
+                        {
+                            <i style="@Dropdown.Styles?.ItemIcon" class="bit-drp-iic @itemIcon.GetCssClasses() @Dropdown.Classes?.ItemIcon" />
+                        }
                         <span style="@Dropdown.Styles?.ItemText"
                               class="bit-drp-itx @Dropdown.Classes?.ItemText">
                             @text
@@ -83,6 +88,11 @@
                 }
                 else
                 {
+                    var itemIcon = Dropdown.GetIcon(Item);
+                    @if (itemIcon is not null)
+                    {
+                        <i style="@Dropdown.Styles?.ItemIcon" class="bit-drp-iic @itemIcon.GetCssClasses() @Dropdown.Classes?.ItemIcon" />
+                    }
                     <span style="@Dropdown.Styles?.ItemText"
                           class="@Dropdown.Classes?.ItemText">
                         @text
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
index 52f142c48b..6bf02237e7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/dropdown"
+@page "/components/dropdown"
 @inherits AppComponentBase
 
 <PageOutlet Url="components/dropdown"
@@ -15,7 +15,8 @@
               PublicMembers="componentPublicMembers"
               GitHubUrl="Inputs/Dropdown/BitDropdown.razor"
               GitHubDemoUrl="Inputs/Dropdown/BitDropdownDemo.razor"
-              IntroductionVideoUrl="https://videos.bitplatform.dev/bit%20Dropdown.mp4">
+              >
+              @* IntroductionVideoUrl="https://videos.bitplatform.dev/bit%20Dropdown.mp4" *@
         <NotesTemplate>
             <BitText>
                 The BitDropdown is a <BitTag Color="BitColor.SecondaryBackground">Multi-API</BitTag> component
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
index f047a37583..ae6e96e724 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class BitDropdownDemo
 {
@@ -26,11 +26,20 @@ public partial class BitDropdownDemo
             Description = "Custom template to render as a footer in the callout.",
         },
         new()
+        {
+            Name = "CaretDownIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the chevron down element. Takes precedence over CaretDownIconName when both are set. Use for external icon libraries (e.g. BitIconInfo.Fa(\"solid chevron-down\"), BitIconInfo.Bi(\"chevron-down\"), BitIconInfo.Css(\"my-class\")).",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "CaretDownIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the chevron down element of the dropdown.",
+            Description = "The icon name of the chevron down element of the dropdown from the Fluent UI icon set.",
         },
         new()
         {
@@ -435,6 +444,22 @@ public partial class BitDropdownDemo
                    Description = "The id for the dropdown item."
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
+               {
+                   Name = "IconName",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "The icon name from the Fluent UI icon set. For external icon libraries, use Icon instead."
+               },
+               new()
                {
                    Name = "Data",
                    Type = "object?",
@@ -557,6 +582,22 @@ public partial class BitDropdownDemo
                    Description = "Determines if the dropdown option is selected."
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
+               {
+                   Name = "IconName",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "The icon name from the Fluent UI icon set. For external icon libraries, use Icon instead."
+               },
+               new()
                {
                    Name = "ItemType",
                    Type = "BitDropdownItemType",
@@ -672,6 +713,24 @@ public partial class BitDropdownDemo
                    Href = "#item-type-enum"
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                   DefaultValue = "new(nameof(BitDropdownItem<TValue>.Icon))",
+                   Description = "The Icon field name and selector of the custom input class.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info"
+               },
+               new()
+               {
+                   Name = "IconName",
+                   Type = "BitNameSelectorPair<TItem, string?>",
+                   DefaultValue = "new(nameof(BitDropdownItem<TValue>.IconName))",
+                   Description = "The IconName field name and selector of the custom input class.",
+                   LinkType = LinkType.Link,
+                   Href = "#name-selector-pair"
+               },
+               new()
                {
                    Name = "Style",
                    Type = "BitNameSelectorPair<TItem, string?>",
@@ -748,6 +807,35 @@ public partial class BitDropdownDemo
             ]
         },
         new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
+        new()
         {
             Id = "class-styles",
             Title = "BitDropdownClassStyles",
@@ -929,6 +1017,13 @@ public partial class BitDropdownDemo
                    Description = "Custom CSS classes/styles for the item check icon of the multi-select BitDropdown."
                },
                new()
+               {
+                   Name = "ItemIcon",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Custom CSS classes/styles for the item icon of the BitDropdown."
+               },
+               new()
                {
                    Name = "ItemText",
                    Type = "string?",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/Product.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/Product.cs
index bf5aee6e0a..43aaca21e8 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/Product.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/Product.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public class Product
 {
@@ -23,4 +23,14 @@ public class Product
     public string? Title { get; set; }
 
     public string? Value { get; set; }
+
+    /// <summary>
+    /// Icon (BitIconInfo) for external icon libraries. Used with BitDropdown NameSelectors.
+    /// </summary>
+    public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Icon name for Fluent UI icons. Used with BitDropdown NameSelectors.
+    /// </summary>
+    public string? IconName { get; set; }
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
index 3ac5cfe72e..8a95a0dd08 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div>Displays basic dropdowns demonstrating single and multi-select options, including required and disabled states.</div>
     <br /><br />
     <div class="example-content">
@@ -382,56 +382,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Virtualization" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
-    <div>Demonstrates virtualization in the BitDropdown component for handling large datasets efficiently.</div>
-    <br /><br /><br />
-    <div class="example-content">
-        <div>With <b>Items</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     Items="virtualizeCustoms1"
-                     Placeholder="Select an item"
-                     NameSelectors="nameSelectors" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     Items="virtualizeCustoms2"
-                     Placeholder="Select items"
-                     NameSelectors="nameSelectors" />
-        <br /><br /><br /><br />
-        <div>With <b>ItemsProvider</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select an item"
-                     NameSelectors="nameSelectors" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select items"
-                     NameSelectors="nameSelectors" /><br /><br /><br /><br />
-        <div>With <b>ItemsProvider and InitialSelectedItems</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select an item"
-                     InitialSelectedItems="initialSelectedItem"
-                     NameSelectors="nameSelectors" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select items"
-                     InitialSelectedItems="initialSelectedItems"
-                     NameSelectors="nameSelectors" />
-    </div>
-</DemoExample>
-
-<DemoExample Title="ComboBox" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+<DemoExample Title="ComboBox" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
     <div>When the <b>Combo</b> parameter is true, you can type in BitDropdown input and search between items.</div>
     <br />
     <div class="example-content">
@@ -458,7 +409,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Chips" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
+<DemoExample Title="Chips" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>When the <b>Chips</b> parameter is true, shows the selected items like chips in the ComboBox.</div>
     <br />
     <div class="example-content">
@@ -485,7 +436,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Dynamic ComboBox" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+<DemoExample Title="Dynamic ComboBox" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>When the <b>Dynamic</b> parameter is true, you can add a new item in the ComboBox.</div>
     <div class="example-content">
         <br />
@@ -532,6 +483,36 @@
     </div>
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> properties on your custom item type (e.g. <b>Product</b>) with <b>NameSelectors</b>.</div>
+    <br />
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    <div class="example-content">
+        <BitDropdown Label="Caret down icon (external)"
+                     CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
+                     Items="GetBasicCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+        <br /><br />
+        <BitDropdown Label="Item icons (IconName - Fluent UI)"
+                     Items="GetExternalIconCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - FontAwesome)"
+                     Items="GetExternalIconFaCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
+                     Items="GetExternalIconBiCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+    </div>
+</DemoExample>
+
 <DemoExample Title="Style & Class" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
@@ -601,3 +582,52 @@
         </div>
     </dir>
 </DemoExample>
+
+<DemoExample Title="Virtualization" RazorCode="@example18RazorCode" CsharpCode="@example18CsharpCode" Id="example18">
+    <div>Demonstrates virtualization in the BitDropdown component for handling large datasets efficiently.</div>
+    <br /><br /><br />
+    <div class="example-content">
+        <div>With <b>Items</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     Items="virtualizeCustoms1"
+                     Placeholder="Select an item"
+                     NameSelectors="nameSelectors" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     Items="virtualizeCustoms2"
+                     Placeholder="Select items"
+                     NameSelectors="nameSelectors" />
+        <br /><br /><br /><br />
+        <div>With <b>ItemsProvider</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select an item"
+                     NameSelectors="nameSelectors" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select items"
+                     NameSelectors="nameSelectors" /><br /><br /><br /><br />
+        <div>With <b>ItemsProvider and InitialSelectedItems</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select an item"
+                     InitialSelectedItems="initialSelectedItem"
+                     NameSelectors="nameSelectors" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select items"
+                     InitialSelectedItems="initialSelectedItems"
+                     NameSelectors="nameSelectors" />
+    </div>
+</DemoExample>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.cs
index e24c4948d3..bd1d66dbbe 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownCustomDemo
 {
@@ -19,6 +19,8 @@ public partial class _BitDropdownCustomDemo
         Text = { Selector = c => c.Text },
         Title = { Selector = c => c.Title },
         Value = { Selector = c => c.Value },
+        Icon = { Selector = c => c.Icon },
+        IconName = { Selector = c => c.IconName },
     };
 
     private BitDropdownNameSelectors<Product, string> comboBoxNameSelectors = new()
@@ -34,6 +36,8 @@ public partial class _BitDropdownCustomDemo
         Text = { Selector = c => c.Text },
         Title = { Selector = c => c.Title },
         Value = { Selector = c => c.Value },
+        Icon = { Selector = c => c.Icon },
+        IconName = { Selector = c => c.IconName },
         ValueSetter = (Product item, string value) => item.Value = value,
         TextSetter = (string text, Product item) => item.Text = text
     };
@@ -69,6 +73,48 @@ private List<Product> GetDataCustoms() =>
     private ICollection<Product>? virtualizeCustoms1;
     private ICollection<Product>? virtualizeCustoms2;
 
+    private List<Product> GetExternalIconCustoms() =>
+    [
+        new() { Type = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", IconName = nameof(BitIconName.AllApps) },
+        new() { Text = "Banana", Value = "f-ban", IconName = nameof(BitIconName.Calculator) },
+        new() { Text = "Orange", Value = "f-ora", IconName = nameof(BitIconName.FavoriteStar), Disabled = true },
+        new() { Text = "Grape", Value = "f-gra", IconName = nameof(BitIconName.Edit) },
+        new() { Type = BitDropdownItemType.Divider },
+        new() { Type = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", IconName = nameof(BitIconName.Health) },
+        new() { Text = "Carrot", Value = "v-car", IconName = nameof(BitIconName.Add) },
+        new() { Text = "Lettuce", Value = "v-let", IconName = nameof(BitIconName.ChevronDown) }
+    ];
+
+    private List<Product> GetExternalIconFaCustoms() =>
+    [
+        new() { Type = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", Icon = BitIconInfo.Css("fa-solid fa-apple-whole") },
+        new() { Text = "Banana", Value = "f-ban", Icon = BitIconInfo.Css("fa-solid fa-moon") },
+        new() { Text = "Orange", Value = "f-ora", Icon = BitIconInfo.Fa("solid lemon"), Disabled = true },
+        new() { Text = "Grape", Value = "f-gra", Icon = BitIconInfo.Css("fa-solid fa-droplet") },
+        new() { Type = BitDropdownItemType.Divider },
+        new() { Type = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", Icon = BitIconInfo.Css("fa-solid fa-seedling") },
+        new() { Text = "Carrot", Value = "v-car", Icon = BitIconInfo.Css("fa-solid fa-carrot") },
+        new() { Text = "Lettuce", Value = "v-let", Icon = BitIconInfo.Css("fa-solid fa-leaf") }
+    ];
+
+    private List<Product> GetExternalIconBiCustoms() =>
+    [
+        new() { Type = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", Icon = BitIconInfo.Bi("apple") },
+        new() { Text = "Banana", Value = "f-ban", Icon = BitIconInfo.Bi("flower1") },
+        new() { Text = "Orange", Value = "f-ora", Icon = BitIconInfo.Css("bi bi-sun"), Disabled = true },
+        new() { Text = "Grape", Value = "f-gra", Icon = BitIconInfo.Bi("droplet-fill") },
+        new() { Type = BitDropdownItemType.Divider },
+        new() { Type = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", Icon = BitIconInfo.Bi("tree-fill") },
+        new() { Text = "Carrot", Value = "v-car", Icon = BitIconInfo.Bi("egg") },
+        new() { Text = "Lettuce", Value = "v-let", Icon = BitIconInfo.Bi("flower2") }
+    ];
+
     private List<Product> GetRtlCustoms() =>
     [
         new() { Type = BitDropdownItemType.Header, Text = "میوه ها" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
index 8b79804a08..f1375907ae 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownCustomDemo
 {
@@ -810,7 +810,7 @@ public class Product
     Value = { Selector = c => c.Value },
 };";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example18RazorCode = @"
 <BitDropdown Label=""Single select""
              Virtualize
              Items=""virtualizeCustoms1""
@@ -852,7 +852,7 @@ public class Product
              Placeholder=""Select items""
              InitialSelectedItems=""initialSelectedItems""
              NameSelectors=""nameSelectors"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example18CsharpCode = @"
 public class Product
 {
     public string? Label { get; set; }
@@ -975,7 +975,7 @@ private async ValueTask<BitDropdownItemsProviderResult<Product>> LoadItems(
     }
 }";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample1""
              Combo
              Responsive
@@ -994,7 +994,7 @@ private async ValueTask<BitDropdownItemsProviderResult<Product>> LoadItems(
              Placeholder=""Select an option""
              NameSelectors=""comboBoxNameSelectors"" />
 <div>Values: @string.Join(',', comboBoxValues1)</div>";
-    private readonly string example13CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 private string comboBoxValueSample1 = default!;
 private ICollection<string> comboBoxValues1 = [];
 
@@ -1042,7 +1042,7 @@ public class Product
     TextSetter = (string? text, Product item) => item.Text = text
 };";
 
-    private readonly string example14RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample2""
              Responsive
              Combo Chips
@@ -1061,7 +1061,7 @@ Combo Chips
              NameSelectors=""comboBoxNameSelectors""
              Label=""Multi select combo box & chips"" />
 <div>Values: @string.Join(',', comboBoxValues2)</div>";
-    private readonly string example14CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private string comboBoxValueSample2 = default!;
 private ICollection<string> comboBoxValues2 = [];
 
@@ -1109,7 +1109,7 @@ public class Product
     TextSetter = (string? text, Product item) => item.Text = text
 };";
 
-    private readonly string example15RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample3""
              Combo Dynamic Responsive
              Items=""comboBoxCustoms""
@@ -1142,7 +1142,7 @@ Combo Chips Dynamic
              OnDynamicAdd=""(Product item) => HandleOnDynamicAdd(item)""
              DynamicValueGenerator=""@((Product item) => item.Text ?? """")"" />
 <div>Values: @string.Join(',', comboBoxValues3)</div>";
-    private readonly string example15CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 private string comboBoxValueSample3 = default!;
 private string comboBoxValueSample4 = default!;
 private ICollection<string> comboBoxValues3 = [];
@@ -1196,6 +1196,119 @@ public class Product
     TextSetter = (string? text, Product item) => item.Text = text
 };";
 
+    private readonly string example15RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDropdown Label=""Caret down icon (external)""
+             CaretDownIcon=""@BitIconInfo.Css(""fa-solid fa-circle-chevron-down"")""
+             Items=""GetBasicCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />
+
+<BitDropdown Label=""Item icons (IconName - Fluent UI)""
+             Items=""GetExternalIconCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />
+
+<BitDropdown Label=""Item icons (Icon - FontAwesome)""
+             Items=""GetExternalIconFaCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />
+
+<BitDropdown Label=""Item icons (Icon - Bootstrap Icons)""
+             Items=""GetExternalIconBiCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />";
+    private readonly string example15CsharpCode = @"
+public class Product
+{
+    public string? Label { get; set; }
+    public string? Key { get; set; }
+    public object? Payload { get; set; }
+    public bool Disabled { get; set; }
+    public bool Visible { get; set; } = true;
+    public BitDropdownItemType Type { get; set; } = BitDropdownItemType.Normal;
+    public string? Text { get; set; }
+    public string? Title { get; set; }
+    public string? Value { get; set; }
+    public BitIconInfo? Icon { get; set; }
+    public string? IconName { get; set; }
+}
+
+private List<Product> GetBasicCustoms() => new()
+{
+    new() { Text = ""Fruits"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Apple"", Value = ""f-app"" },
+    new() { Text = ""Banana"", Value = ""f-ban"" },
+    new() { Text = ""Orange"", Value = ""f-ora"", Disabled = true },
+    new() { Text = ""Grape"", Value = ""f-gra"" },
+    new() { Type = BitDropdownItemType.Divider },
+    new() { Text = ""Vegetables"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Broccoli"", Value = ""v-bro"" },
+    new() { Text = ""Carrot"", Value = ""v-car"" },
+    new() { Text = ""Lettuce"", Value = ""v-let"" }
+};
+
+private List<Product> GetExternalIconCustoms() => new()
+{
+    new() { Text = ""Fruits"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Apple"", Value = ""f-app"", IconName = nameof(BitIconName.AllApps) },
+    new() { Text = ""Banana"", Value = ""f-ban"", IconName = nameof(BitIconName.Calculator) },
+    new() { Text = ""Orange"", Value = ""f-ora"", IconName = nameof(BitIconName.FavoriteStar), Disabled = true },
+    new() { Text = ""Grape"", Value = ""f-gra"", IconName = nameof(BitIconName.Edit) },
+    new() { Type = BitDropdownItemType.Divider },
+    new() { Text = ""Vegetables"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", IconName = nameof(BitIconName.Health) },
+    new() { Text = ""Carrot"", Value = ""v-car"", IconName = nameof(BitIconName.Add) },
+    new() { Text = ""Lettuce"", Value = ""v-let"", IconName = nameof(BitIconName.ChevronDown) }
+};
+
+private List<Product> GetExternalIconFaCustoms() => new()
+{
+    new() { Text = ""Fruits"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Apple"", Value = ""f-app"", Icon = BitIconInfo.Css(""fa-solid fa-apple-whole"") },
+    new() { Text = ""Banana"", Value = ""f-ban"", Icon = BitIconInfo.Css(""fa-solid fa-moon"") },
+    new() { Text = ""Orange"", Value = ""f-ora"", Icon = BitIconInfo.Fa(""solid lemon""), Disabled = true },
+    new() { Text = ""Grape"", Value = ""f-gra"", Icon = BitIconInfo.Css(""fa-solid fa-droplet"") },
+    new() { Type = BitDropdownItemType.Divider },
+    new() { Text = ""Vegetables"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", Icon = BitIconInfo.Css(""fa-solid fa-seedling"") },
+    new() { Text = ""Carrot"", Value = ""v-car"", Icon = BitIconInfo.Css(""fa-solid fa-carrot"") },
+    new() { Text = ""Lettuce"", Value = ""v-let"", Icon = BitIconInfo.Css(""fa-solid fa-leaf"") }
+};
+
+private List<Product> GetExternalIconBiCustoms() => new()
+{
+    new() { Text = ""Fruits"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Apple"", Value = ""f-app"", Icon = BitIconInfo.Bi(""apple"") },
+    new() { Text = ""Banana"", Value = ""f-ban"", Icon = BitIconInfo.Bi(""flower1"") },
+    new() { Text = ""Orange"", Value = ""f-ora"", Icon = BitIconInfo.Css(""bi bi-sun""), Disabled = true },
+    new() { Text = ""Grape"", Value = ""f-gra"", Icon = BitIconInfo.Bi(""droplet-fill"") },
+    new() { Type = BitDropdownItemType.Divider },
+    new() { Text = ""Vegetables"", Type = BitDropdownItemType.Header },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", Icon = BitIconInfo.Bi(""tree-fill"") },
+    new() { Text = ""Carrot"", Value = ""v-car"", Icon = BitIconInfo.Bi(""egg"") },
+    new() { Text = ""Lettuce"", Value = ""v-let"", Icon = BitIconInfo.Bi(""flower2"") }
+};
+
+private BitDropdownNameSelectors<Product, string> nameSelectors = new()
+{
+    AriaLabel = { Selector = c => c.Label },
+    Class = { Selector = c => c.CssClass },
+    Id = { Selector = c => c.Key },
+    Data = { Selector = c => c.Payload },
+    IsEnabled = { Selector = c => c.Disabled is false },
+    IsHidden = { Selector = c => c.Visible is false },
+    ItemType = { Selector = c => c.Type },
+    Style = { Selector = c => c.CssStyle },
+    Text = { Selector = c => c.Text },
+    Title = { Selector = c => c.Title },
+    Value = { Selector = c => c.Value },
+    Icon = { Selector = c => c.Icon },
+    IconName = { Selector = c => c.IconName },
+};";
+
     private readonly string example16RazorCode = @"
 <style>
     .custom-class {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
index 2185aadea5..21374ba3fa 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div>Displays basic dropdowns demonstrating single and multi-select options, including required and disabled states.</div>
     <br /><br />
     <div class="example-content">
@@ -375,57 +375,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Virtualization" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
-    <div>Demonstrates virtualization in the BitDropdown component for handling large datasets efficiently.</div>
-    <br /><br /><br />
-    <div class="example-content">
-        <div>With <b>Items</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     Items="virtualizeItems1"
-                     DefaultValue="@string.Empty"
-                     Placeholder="Select an item" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     Items="virtualizeItems2"
-                     Placeholder="Select items"
-                     DefaultValue="@string.Empty" />
-        <br /><br /><br /><br />
-        <div>With <b>ItemsProvider</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select an item"
-                     TItem="BitDropdownItem<string>" TValue="string" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select items"
-                     TItem="BitDropdownItem<string>" TValue="string" />
-        <br /><br /><br /><br />
-        <div>With <b>ItemsProvider and InitialSelectedItems</b>:</div><br />
-        <BitDropdown Label="Single select"
-                     Virtualize
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select an item"
-                     InitialSelectedItems="initialSelectedItem"
-                     TItem="BitDropdownItem<string>" TValue="string" />
-        <br />
-        <BitDropdown Label="Multi select"
-                     Virtualize
-                     MultiSelect
-                     ItemsProvider="LoadItems"
-                     Placeholder="Select items"
-                     InitialSelectedItems="initialSelectedItems"
-                     TItem="BitDropdownItem<string>" TValue="string" />
-    </div>
-</DemoExample>
-
-<DemoExample Title="ComboBox" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+<DemoExample Title="ComboBox" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
     <div>When the <b>Combo</b> parameter is true, you can type in BitDropdown input and search between items.</div>
     <br />
     <div class="example-content">
@@ -450,7 +400,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Chips" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
+<DemoExample Title="Chips" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>When the <b>Chips</b> parameter is true, shows the selected items like chips in the ComboBox.</div>
     <br />
     <div class="example-content">
@@ -475,7 +425,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Dynamic ComboBox" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+<DemoExample Title="Dynamic ComboBox" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>When the <b>Dynamic</b> parameter is true, you can add a new item in the ComboBox.</div>
     <br />
     <div class="example-content">
@@ -520,6 +470,40 @@
     </div>
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> parameters on <b>BitDropdownItem</b>.</div>
+    <br />
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    <div class="example-content">
+        <BitDropdown Label="Caret down icon (external)"
+                     CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
+                     Items="GetBasicItems()"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br /><br />
+        <BitDropdown Label="Item icons (IconName - Fluent UI)"
+                     Items="GetExternalIconItems()"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - FontAwesome)"
+                     Items="GetExternalIconFaItems()"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
+                     Items="GetExternalIconBiItems()"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+    </div>
+</DemoExample>
+
 <DemoExample Title="Style & Class" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
@@ -589,3 +573,53 @@
         </div>
     </dir>
 </DemoExample>
+
+<DemoExample Title="Virtualization" RazorCode="@example18RazorCode" CsharpCode="@example18CsharpCode" Id="example18">
+    <div>Demonstrates virtualization in the BitDropdown component for handling large datasets efficiently.</div>
+    <br /><br /><br />
+    <div class="example-content">
+        <div>With <b>Items</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     Items="virtualizeItems1"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     Items="virtualizeItems2"
+                     Placeholder="Select items"
+                     DefaultValue="@string.Empty" />
+        <br /><br /><br /><br />
+        <div>With <b>ItemsProvider</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select items"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br /><br /><br /><br />
+        <div>With <b>ItemsProvider and InitialSelectedItems</b>:</div><br />
+        <BitDropdown Label="Single select"
+                     Virtualize
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select an item"
+                     InitialSelectedItems="initialSelectedItem"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+        <br />
+        <BitDropdown Label="Multi select"
+                     Virtualize
+                     MultiSelect
+                     ItemsProvider="LoadItems"
+                     Placeholder="Select items"
+                     InitialSelectedItems="initialSelectedItems"
+                     TItem="BitDropdownItem<string>" TValue="string" />
+    </div>
+</DemoExample>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.cs
index 2a03c62398..eb67c7cf31 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownItemDemo
 {
@@ -66,6 +66,48 @@ private List<BitDropdownItem<string>> GetStyleClassItems() =>
         new() { Text = "Lettuce", Value = "v-let", Class = "custom-veg" }
     ];
 
+    private List<BitDropdownItem<string>> GetExternalIconItems() =>
+    [
+        new() { ItemType = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", IconName = nameof(BitIconName.AllApps) },
+        new() { Text = "Banana", Value = "f-ban", IconName = nameof(BitIconName.Calculator) },
+        new() { Text = "Orange", Value = "f-ora", IconName = nameof(BitIconName.FavoriteStar), IsEnabled = false },
+        new() { Text = "Grape", Value = "f-gra", IconName = nameof(BitIconName.Edit) },
+        new() { ItemType = BitDropdownItemType.Divider },
+        new() { ItemType = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", IconName = nameof(BitIconName.Health) },
+        new() { Text = "Carrot", Value = "v-car", IconName = nameof(BitIconName.Add) },
+        new() { Text = "Lettuce", Value = "v-let", IconName = nameof(BitIconName.ChevronDown) }
+    ];
+
+    private List<BitDropdownItem<string>> GetExternalIconFaItems() =>
+    [
+        new() { ItemType = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", Icon = BitIconInfo.Css("fa-solid fa-apple-whole") },
+        new() { Text = "Banana", Value = "f-ban", Icon = BitIconInfo.Css("fa-solid fa-moon") },
+        new() { Text = "Orange", Value = "f-ora", Icon = BitIconInfo.Fa("solid lemon"), IsEnabled = false },
+        new() { Text = "Grape", Value = "f-gra", Icon = BitIconInfo.Css("fa-solid fa-droplet") },
+        new() { ItemType = BitDropdownItemType.Divider },
+        new() { ItemType = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", Icon = BitIconInfo.Css("fa-solid fa-seedling") },
+        new() { Text = "Carrot", Value = "v-car", Icon = BitIconInfo.Css("fa-solid fa-carrot") },
+        new() { Text = "Lettuce", Value = "v-let", Icon = BitIconInfo.Css("fa-solid fa-leaf") }
+    ];
+
+    private List<BitDropdownItem<string>> GetExternalIconBiItems() =>
+    [
+        new() { ItemType = BitDropdownItemType.Header, Text = "Fruits" },
+        new() { Text = "Apple", Value = "f-app", Icon = BitIconInfo.Bi("apple") },
+        new() { Text = "Banana", Value = "f-ban", Icon = BitIconInfo.Bi("flower1") },
+        new() { Text = "Orange", Value = "f-ora", Icon = BitIconInfo.Css("bi bi-sun"), IsEnabled = false },
+        new() { Text = "Grape", Value = "f-gra", Icon = BitIconInfo.Bi("droplet-fill") },
+        new() { ItemType = BitDropdownItemType.Divider },
+        new() { ItemType = BitDropdownItemType.Header, Text = "Vegetables" },
+        new() { Text = "Broccoli", Value = "v-bro", Icon = BitIconInfo.Bi("tree-fill") },
+        new() { Text = "Carrot", Value = "v-car", Icon = BitIconInfo.Bi("egg") },
+        new() { Text = "Lettuce", Value = "v-let", Icon = BitIconInfo.Bi("flower2") }
+    ];
+
     private List<BitDropdownItem<string>> comboBoxItems =
     [
         new() { ItemType = BitDropdownItemType.Header, Text = "Fruits" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
index c6898393a7..40728ad0fd 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownItemDemo
 {
@@ -530,7 +530,7 @@ public class DropdownItemData
     new() { Text = ""Lettuce"", Value = ""v-let"" }
 };";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example18RazorCode = @"
 <BitDropdown Label=""Single select""
              Virtualize
              Items=""virtualizeItems1""
@@ -572,7 +572,7 @@ public class DropdownItemData
              Placeholder=""Select items""
              InitialSelectedItems=""initialSelectedItems""
              TItem=""BitDropdownItem<string>"" TValue=""string"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example18CsharpCode = @"
 private ICollection<BitDropdownItem<string>>? virtualizeItems1;
 private ICollection<BitDropdownItem<string>>? virtualizeItems2;
 
@@ -672,7 +672,7 @@ private async ValueTask<BitDropdownItemsProviderResult<BitDropdownItem<string>>>
     }
 }";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample1""
              Combo
              Responsive
@@ -689,7 +689,7 @@ private async ValueTask<BitDropdownItemsProviderResult<BitDropdownItem<string>>>
              Label=""Multi select combo box""
              Placeholder=""Select an option"" />
 <div>Values: @string.Join(',', comboBoxValues1)</div>";
-    private readonly string example13CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 private string comboBoxValueSample1 = default!;
 private ICollection<string?> comboBoxValues1 = [];
 
@@ -707,7 +707,7 @@ private async ValueTask<BitDropdownItemsProviderResult<BitDropdownItem<string>>>
     new() { Text = ""Lettuce"", Value = ""v-let"" }
 };";
 
-    private readonly string example14RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample2""
              Combo Chips
              Responsive
@@ -724,7 +724,7 @@ Combo Chips
              Placeholder=""Select an option""
              Label=""Multi select combo box & chips"" />
 <div>Values: @string.Join(',', comboBoxValues2)</div>";
-    private readonly string example14CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private string comboBoxValueSample2 = default!;
 private ICollection<string?> comboBoxValues2 = [];
 
@@ -742,7 +742,7 @@ Combo Chips
     new() { Text = ""Lettuce"", Value = ""v-let"" }
 };";
 
-    private readonly string example15RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitDropdown @bind-Value=""comboBoxValueSample3""
              Combo Dynamic
              Responsive
@@ -773,7 +773,7 @@ Combo Chips Dynamic
              DynamicValueGenerator=""(BitDropdownItem<string> item) => item.Text""
              OnDynamicAdd=""(BitDropdownItem<string> item) => HandleOnDynamicAdd(item)"" />
 <div>Values: @string.Join(',', comboBoxValues3)</div>";
-    private readonly string example15CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 private string comboBoxValueSample3 = default!;
 private string comboBoxValueSample4 = default!;
 private ICollection<string?> comboBoxValues3 = [];
@@ -792,6 +792,91 @@ Combo Chips Dynamic
     new() { Text = ""Lettuce"", Value = ""v-let"" }
 };";
 
+    private readonly string example15RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDropdown Label=""Caret down icon (external)""
+             CaretDownIcon=""@BitIconInfo.Css(""fa-solid fa-circle-chevron-down"")""
+             Items=""GetBasicItems()""
+             DefaultValue=""@string.Empty""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+
+<BitDropdown Label=""Item icons (IconName - Fluent UI)""
+             Items=""GetExternalIconItems()""
+             DefaultValue=""@string.Empty""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+
+<BitDropdown Label=""Item icons (Icon - FontAwesome)""
+             Items=""GetExternalIconFaItems()""
+             DefaultValue=""@string.Empty""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+
+<BitDropdown Label=""Item icons (Icon - Bootstrap Icons)""
+             Items=""GetExternalIconBiItems()""
+             DefaultValue=""@string.Empty""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownItem<string>"" TValue=""string"" />";
+    private readonly string example15CsharpCode = @"
+private List<BitDropdownItem<string>> GetBasicItems() => new()
+{
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
+    new() { Text = ""Apple"", Value = ""f-app"" },
+    new() { Text = ""Banana"", Value = ""f-ban"" },
+    new() { Text = ""Orange"", Value = ""f-ora"", IsEnabled = false },
+    new() { Text = ""Grape"", Value = ""f-gra"" },
+    new() { ItemType = BitDropdownItemType.Divider },
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Vegetables"" },
+    new() { Text = ""Broccoli"", Value = ""v-bro"" },
+    new() { Text = ""Carrot"", Value = ""v-car"" },
+    new() { Text = ""Lettuce"", Value = ""v-let"" }
+};
+
+private List<BitDropdownItem<string>> GetExternalIconItems() => new()
+{
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
+    new() { Text = ""Apple"", Value = ""f-app"", IconName = nameof(BitIconName.AllApps) },
+    new() { Text = ""Banana"", Value = ""f-ban"", IconName = nameof(BitIconName.Calculator) },
+    new() { Text = ""Orange"", Value = ""f-ora"", IconName = nameof(BitIconName.FavoriteStar), IsEnabled = false },
+    new() { Text = ""Grape"", Value = ""f-gra"", IconName = nameof(BitIconName.Edit) },
+    new() { ItemType = BitDropdownItemType.Divider },
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Vegetables"" },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", IconName = nameof(BitIconName.Health) },
+    new() { Text = ""Carrot"", Value = ""v-car"", IconName = nameof(BitIconName.Add) },
+    new() { Text = ""Lettuce"", Value = ""v-let"", IconName = nameof(BitIconName.ChevronDown) }
+};
+
+private List<BitDropdownItem<string>> GetExternalIconFaItems() => new()
+{
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
+    new() { Text = ""Apple"", Value = ""f-app"", Icon = BitIconInfo.Css(""fa-solid fa-apple-whole"") },
+    new() { Text = ""Banana"", Value = ""f-ban"", Icon = BitIconInfo.Css(""fa-solid fa-moon"") },
+    new() { Text = ""Orange"", Value = ""f-ora"", Icon = BitIconInfo.Fa(""solid lemon""), IsEnabled = false },
+    new() { Text = ""Grape"", Value = ""f-gra"", Icon = BitIconInfo.Css(""fa-solid fa-droplet"") },
+    new() { ItemType = BitDropdownItemType.Divider },
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Vegetables"" },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", Icon = BitIconInfo.Css(""fa-solid fa-seedling"") },
+    new() { Text = ""Carrot"", Value = ""v-car"", Icon = BitIconInfo.Css(""fa-solid fa-carrot"") },
+    new() { Text = ""Lettuce"", Value = ""v-let"", Icon = BitIconInfo.Css(""fa-solid fa-leaf"") }
+};
+
+private List<BitDropdownItem<string>> GetExternalIconBiItems() => new()
+{
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
+    new() { Text = ""Apple"", Value = ""f-app"", Icon = BitIconInfo.Bi(""apple"") },
+    new() { Text = ""Banana"", Value = ""f-ban"", Icon = BitIconInfo.Bi(""flower1"") },
+    new() { Text = ""Orange"", Value = ""f-ora"", Icon = BitIconInfo.Css(""bi bi-sun""), IsEnabled = false },
+    new() { Text = ""Grape"", Value = ""f-gra"", Icon = BitIconInfo.Bi(""droplet-fill"") },
+    new() { ItemType = BitDropdownItemType.Divider },
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Vegetables"" },
+    new() { Text = ""Broccoli"", Value = ""v-bro"", Icon = BitIconInfo.Bi(""tree-fill"") },
+    new() { Text = ""Carrot"", Value = ""v-car"", Icon = BitIconInfo.Bi(""egg"") },
+    new() { Text = ""Lettuce"", Value = ""v-let"", Icon = BitIconInfo.Bi(""flower2"") }
+};";
+
     private readonly string example16RazorCode = @"
 <style>
     .custom-class {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
index 9b68600f32..162c3a8310 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div>Displays basic dropdowns demonstrating single and multi-select options, including required and disabled states.</div>
     <br /><br />
     <div class="example-content">
@@ -640,6 +640,7 @@
     <div>When the <b>Combo</b>, <b>Chips</b> and <b>Dynamic</b> parameters are true, you can add a new item in the ComboBox (pressing the enter key or touching the add button on the mobile).</div>
     <br />
     <div class="example-content">
+        <br />
         <BitDropdown @bind-Value="comboBoxValueSample4"
                      Responsive
                      Combo Chips Dynamic
@@ -675,7 +676,71 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+<DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
+    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> parameters on <b>BitDropdownOption</b>.</div>
+    <br />
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    <div class="example-content">
+        <BitDropdown Label="Caret down icon (external)"
+                     CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            @foreach (var item in basicItems)
+            {
+                <BitDropdownOption ItemType="item.ItemType" Text="@item.Text" Value="item.Value" IsEnabled="item.IsEnabled" />
+            }
+        </BitDropdown>
+        <br /><br />
+        <BitDropdown Label="Item icons (IconName - Fluent UI)"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Fruits" Value="@string.Empty" />
+            <BitDropdownOption Text="Apple" Value="@("f-app")" IconName="@BitIconName.AllApps" />
+            <BitDropdownOption Text="Banana" Value="@("f-ban")" IconName="@BitIconName.Calculator" />
+            <BitDropdownOption Text="Orange" Value="@("f-ora")" IconName="@BitIconName.FavoriteStar" IsEnabled="false" />
+            <BitDropdownOption Text="Grape" Value="@("f-gra")" IconName="@BitIconName.Edit" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Divider" Value="@string.Empty" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Vegetables" Value="@string.Empty" />
+            <BitDropdownOption Text="Broccoli" Value="@("v-bro")" IconName="@BitIconName.Health" />
+            <BitDropdownOption Text="Carrot" Value="@("v-car")" IconName="@BitIconName.Add" />
+            <BitDropdownOption Text="Lettuce" Value="@("v-let")" IconName="@BitIconName.ChevronDown" />
+        </BitDropdown>
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - FontAwesome)"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Fruits" Value="@string.Empty" />
+            <BitDropdownOption Text="Apple" Value="@("f-app")" Icon="@BitIconInfo.Css("fa-solid fa-apple-whole")" />
+            <BitDropdownOption Text="Banana" Value="@("f-ban")" Icon="@BitIconInfo.Css("fa-solid fa-moon")" />
+            <BitDropdownOption Text="Orange" Value="@("f-ora")" Icon="@BitIconInfo.Fa("solid lemon")" IsEnabled="false" />
+            <BitDropdownOption Text="Grape" Value="@("f-gra")" Icon="@BitIconInfo.Css("fa-solid fa-droplet")" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Divider" Value="@string.Empty" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Vegetables" Value="@string.Empty" />
+            <BitDropdownOption Text="Broccoli" Value="@("v-bro")" Icon="@BitIconInfo.Css("fa-solid fa-seedling")" />
+            <BitDropdownOption Text="Carrot" Value="@("v-car")" Icon="@BitIconInfo.Css("fa-solid fa-carrot")" />
+            <BitDropdownOption Text="Lettuce" Value="@("v-let")" Icon="@BitIconInfo.Css("fa-solid fa-leaf")" />
+        </BitDropdown>
+        <br /><br />
+        <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Fruits" Value="@string.Empty" />
+            <BitDropdownOption Text="Apple" Value="@("f-app")" Icon="@BitIconInfo.Bi("apple")" />
+            <BitDropdownOption Text="Banana" Value="@("f-ban")" Icon="@BitIconInfo.Bi("flower1")" />
+            <BitDropdownOption Text="Orange" Value="@("f-ora")" Icon="@BitIconInfo.Css("bi bi-sun")" IsEnabled="false" />
+            <BitDropdownOption Text="Grape" Value="@("f-gra")" Icon="@BitIconInfo.Bi("droplet-fill")" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Divider" Value="@string.Empty" />
+            <BitDropdownOption ItemType="BitDropdownItemType.Header" Text="Vegetables" Value="@string.Empty" />
+            <BitDropdownOption Text="Broccoli" Value="@("v-bro")" Icon="@BitIconInfo.Bi("tree-fill")" />
+            <BitDropdownOption Text="Carrot" Value="@("v-car")" Icon="@BitIconInfo.Bi("egg")" />
+            <BitDropdownOption Text="Lettuce" Value="@("v-let")" Icon="@BitIconInfo.Bi("flower2")" />
+        </BitDropdown>
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
     <div class="example-content">
@@ -737,7 +802,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
+<DemoExample Title="RTL" RazorCode="@example17RazorCode" CsharpCode="@example17CsharpCode" Id="example17">
     <div>Use BitDropdown in right-to-left (RTL).</div>
     <br />
     <dir dir="rtl" style="padding:0">
@@ -775,4 +840,8 @@
             </BitDropdown>
         </div>
     </dir>
+</DemoExample>
+
+<DemoExample Title="Virtualization" RazorCode="@example18RazorCode" CsharpCode="@example18CsharpCode" Id="example18">
+    <div>Not applicable to option demo!</div>
 </DemoExample>
\ No newline at end of file
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
index 52dddc8e05..217a8350f2 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownOptionDemo
 {
@@ -849,6 +849,79 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
 ];";
 
     private readonly string example15RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDropdown Label=""Caret down icon (external)""
+             CaretDownIcon=""@BitIconInfo.Css(""fa-solid fa-circle-chevron-down"")""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    @foreach (var item in basicItems)
+    {
+        <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
+    }
+</BitDropdown>
+
+<BitDropdown Label=""Item icons (IconName - Fluent UI)""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Fruits"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Apple"" Value=""@(""f-app"")"" IconName=""@BitIconName.AllApps"" />
+    <BitDropdownOption Text=""Banana"" Value=""@(""f-ban"")"" IconName=""@BitIconName.Calculator"" />
+    <BitDropdownOption Text=""Orange"" Value=""@(""f-ora"")"" IconName=""@BitIconName.FavoriteStar"" IsEnabled=""false"" />
+    <BitDropdownOption Text=""Grape"" Value=""@(""f-gra"")"" IconName=""@BitIconName.Edit"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Divider"" Value=""@string.Empty"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Vegetables"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Broccoli"" Value=""@(""v-bro"")"" IconName=""@BitIconName.Health"" />
+    <BitDropdownOption Text=""Carrot"" Value=""@(""v-car"")"" IconName=""@BitIconName.Add"" />
+    <BitDropdownOption Text=""Lettuce"" Value=""@(""v-let"")"" IconName=""@BitIconName.ChevronDown"" />
+</BitDropdown>
+
+<BitDropdown Label=""Item icons (Icon - FontAwesome)""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Fruits"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Apple"" Value=""@(""f-app"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-apple-whole"")"" />
+    <BitDropdownOption Text=""Banana"" Value=""@(""f-ban"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-moon"")"" />
+    <BitDropdownOption Text=""Orange"" Value=""@(""f-ora"")"" Icon=""@BitIconInfo.Fa(""solid lemon"")"" IsEnabled=""false"" />
+    <BitDropdownOption Text=""Grape"" Value=""@(""f-gra"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-droplet"")"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Divider"" Value=""@string.Empty"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Vegetables"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Broccoli"" Value=""@(""v-bro"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-seedling"")"" />
+    <BitDropdownOption Text=""Carrot"" Value=""@(""v-car"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-carrot"")"" />
+    <BitDropdownOption Text=""Lettuce"" Value=""@(""v-let"")"" Icon=""@BitIconInfo.Css(""fa-solid fa-leaf"")"" />
+</BitDropdown>
+
+<BitDropdown Label=""Item icons (Icon - Bootstrap Icons)""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Fruits"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Apple"" Value=""@(""f-app"")"" Icon=""@BitIconInfo.Bi(""apple"")"" />
+    <BitDropdownOption Text=""Banana"" Value=""@(""f-ban"")"" Icon=""@BitIconInfo.Bi(""flower1"")"" />
+    <BitDropdownOption Text=""Orange"" Value=""@(""f-ora"")"" Icon=""@BitIconInfo.Css(""bi bi-sun"")"" IsEnabled=""false"" />
+    <BitDropdownOption Text=""Grape"" Value=""@(""f-gra"")"" Icon=""@BitIconInfo.Bi(""droplet-fill"")"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Divider"" Value=""@string.Empty"" />
+    <BitDropdownOption ItemType=""BitDropdownItemType.Header"" Text=""Vegetables"" Value=""@string.Empty"" />
+    <BitDropdownOption Text=""Broccoli"" Value=""@(""v-bro"")"" Icon=""@BitIconInfo.Bi(""tree-fill"")"" />
+    <BitDropdownOption Text=""Carrot"" Value=""@(""v-car"")"" Icon=""@BitIconInfo.Bi(""egg"")"" />
+    <BitDropdownOption Text=""Lettuce"" Value=""@(""v-let"")"" Icon=""@BitIconInfo.Bi(""flower2"")"" />
+</BitDropdown>";
+    private readonly string example15CsharpCode = @"
+private readonly List<BitDropdownItem<string>> basicItems =
+[
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
+    new() { Text = ""Apple"", Value = ""f-app"" },
+    new() { Text = ""Banana"", Value = ""f-ban"" },
+    new() { Text = ""Orange"", Value = ""f-ora"", IsEnabled = false },
+    new() { Text = ""Grape"", Value = ""f-gra"" },
+    new() { ItemType = BitDropdownItemType.Divider },
+    new() { ItemType = BitDropdownItemType.Header, Text = ""Vegetables"" },
+    new() { Text = ""Broccoli"", Value = ""v-bro"" },
+    new() { Text = ""Carrot"", Value = ""v-car"" },
+    new() { Text = ""Lettuce"", Value = ""v-let"" }
+];";
+
+    private readonly string example16RazorCode = @"
 <style>
     .custom-class {
         margin-inline: 1rem;
@@ -946,7 +1019,7 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
         <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
     }
 </BitDropdown>";
-    private readonly string example15CsharpCode = @"
+    private readonly string example16CsharpCode = @"
 private readonly List<BitDropdownItem<string>> basicItems =
 [
     new() { ItemType = BitDropdownItemType.Header, Text = ""Fruits"" },
@@ -975,7 +1048,7 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
     new() { Text = ""Lettuce"", Value = ""v-let"", Class = ""custom-veg"" }
 ];";
 
-    private readonly string example16RazorCode = @"
+    private readonly string example17RazorCode = @"
 <BitDropdown Label=""تک انتخابی""
              Dir=""BitDir.Rtl""
              Placeholder=""لطفا انتخاب کنید""
@@ -1007,7 +1080,7 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
         <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
     }
 </BitDropdown>";
-    private readonly string example16CsharpCode = @"
+    private readonly string example17CsharpCode = @"
 private readonly List<BitDropdownItem<string>> rtlItems =
 [
     new() { ItemType = BitDropdownItemType.Header, Text = ""میوه ها"" },
@@ -1021,4 +1094,7 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
     new() { Text = ""هویج"", Value = ""v-car"" },
     new() { Text = ""کاهو"", Value = ""v-let"" }
 ];";
+
+    private readonly string example18RazorCode = @"";
+    private readonly string example18CsharpCode = @"";
 }

From 22bc01238cb194877e158392c127fa078d936ac8 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sat, 14 Feb 2026 18:13:27 +0330
Subject: [PATCH 07/66] feat(blazorui): add new Icon parameters to
 BitNumberField #12088 (#12089)

---
 .../Inputs/NumberField/BitNumberField.razor   | 31 ++++---
 .../NumberField/BitNumberField.razor.cs       | 77 +++++++++++++++-
 .../NumberField/BitNumberFieldDemo.razor      | 53 ++++++++++-
 .../NumberField/BitNumberFieldDemo.razor.cs   | 89 ++++++++++++++++++-
 .../BitNumberFieldDemo.razor.samples.cs       | 31 ++++++-
 5 files changed, 255 insertions(+), 26 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor
index 2bae936420..5da9143706 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor
@@ -2,6 +2,13 @@
 @inherits BitTextInputBase<TValue>
 @typeparam TValue
 
+@{
+    var icon = BitIconInfo.From(Icon, IconName);
+    var incrementIcon = BitIconInfo.From(IncrementIcon, IncrementIconName ?? "ChevronDownSmall bit-ico-r180");
+    var decrementIcon = BitIconInfo.From(DecrementIcon, DecrementIconName ?? "ChevronDownSmall");
+    var clearButtonIcon = BitIconInfo.From(ClearButtonIcon, ClearButtonIconName ?? "Cancel");
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      style="@StyleBuilder.Value"
@@ -63,7 +70,7 @@
                     aria-label="@DecrementAriaLabel">
                 <span style="@Styles?.DecrementIconContainer" class="bit-nfl-aic @Classes?.DecrementIconContainer">
                     <i style="@Styles?.DecrementIcon"
-                       class="bit-nfl-bic bit-nfl-sbi bit-icon bit-icon--@(DecrementIconName ?? "ChevronDownSmall") @Classes?.DecrementIcon" />
+                       class="bit-nfl-bic bit-nfl-sbi @decrementIcon.GetCssClasses() @Classes?.DecrementIcon" />
                 </span>
             </button>
         }
@@ -138,14 +145,14 @@
                                 aria-hidden="true"
                                 aria-label="Clear text"
                                 disabled="@(IsEnabled is false)">
-                            <i style="@Styles?.ClearButtonIcon" class="bit-icon bit-icon--Cancel @Classes?.ClearButtonIcon" aria-hidden="true" />
+                            <i style="@Styles?.ClearButtonIcon" class="@clearButtonIcon.GetCssClasses() @Classes?.ClearButtonIcon" aria-hidden="true" />
                         </button>
                     }
         }
 
         @if (Mode == BitSpinButtonMode.Compact)
         {
-            <div style="@Styles?.ButtonsContainer" class="bit-nfl-act @Classes?.ButtonsContainer">
+            <span style="@Styles?.ButtonsContainer" class="bit-nfl-act @Classes?.ButtonsContainer">
                 <button @ref="_buttonIncrement"
                         @onpointerup="HandleOnPointerUpOrOut"
                         @onpointerout="HandleOnPointerUpOrOut"
@@ -161,7 +168,7 @@
                         aria-disabled="@(IsEnabled is false)">
                     <span style="@Styles?.IncrementIconContainer" class="bit-nfl-aic @Classes?.IncrementIconContainer">
                         <i style="@Styles?.IncrementIcon"
-                           class="bit-nfl-bic bit-icon bit-icon--@(IncrementIconName ?? "ChevronDownSmall bit-ico-r180") @Classes?.IncrementIcon" />
+                           class="bit-nfl-bic @incrementIcon?.GetCssClasses() @Classes?.IncrementIcon" />
                     </span>
                 </button>
 
@@ -180,10 +187,10 @@
                         aria-disabled="@(IsEnabled is false)">
                     <span style="@Styles?.DecrementIconContainer" class="bit-nfl-aic @Classes?.DecrementIconContainer">
                         <i style="@Styles?.DecrementIcon"
-                           class="bit-nfl-bic bit-icon bit-icon--@(DecrementIconName ?? "ChevronDownSmall") @Classes?.DecrementIcon" />
+                           class="bit-nfl-bic @decrementIcon?.GetCssClasses() @Classes?.DecrementIcon" />
                     </span>
                 </button>
-            </div>
+            </span>
         }
         else if (Mode == BitSpinButtonMode.Inline)
         {
@@ -201,7 +208,7 @@
                     aria-label="@DecrementAriaLabel">
                 <span style="@Styles?.DecrementIconContainer" class="bit-nfl-aic @Classes?.DecrementIconContainer">
                     <i style="@Styles?.DecrementIcon"
-                       class="bit-nfl-bic bit-nfl-sbi bit-icon bit-icon--@(DecrementIconName ?? "ChevronDownSmall") @Classes?.DecrementIcon" />
+                       class="bit-nfl-bic bit-nfl-sbi @decrementIcon?.GetCssClasses() @Classes?.DecrementIcon" />
                 </span>
             </button>
 
@@ -219,7 +226,7 @@
                     aria-label="@IncrementAriaLabel">
                 <span style="@Styles?.IncrementIconContainer" class="bit-nfl-aic @Classes?.IncrementIconContainer">
                     <i style="@Styles?.IncrementIcon"
-                       class="bit-nfl-bic bit-nfl-sbi bit-icon bit-icon--@(IncrementIconName ?? "ChevronDownSmall bit-ico-r180") @Classes?.IncrementIcon" />
+                       class="bit-nfl-bic bit-nfl-sbi @incrementIcon?.GetCssClasses() @Classes?.IncrementIcon" />
                 </span>
             </button>
         }
@@ -239,17 +246,17 @@
                     aria-label="@IncrementAriaLabel">
                 <span style="@Styles?.IncrementIconContainer" class="bit-nfl-aic @Classes?.IncrementIconContainer">
                     <i style="@Styles?.IncrementIcon"
-                       class="bit-nfl-bic bit-nfl-sbi bit-icon bit-icon--@(IncrementIconName ?? "ChevronDownSmall bit-ico-r180") @Classes?.IncrementIcon" />
+                       class="bit-nfl-bic bit-nfl-sbi @incrementIcon?.GetCssClasses() @Classes?.IncrementIcon" />
                 </span>
             </button>
         }
 
-        @if (IconName.HasValue())
+        @if (icon is not null)
         {
             <i style="@Styles?.Icon"
-               class="bit-nfl-lic bit-icon bit-icon--@IconName @Classes?.Icon"
+               class="bit-nfl-lic @icon.GetCssClasses() @Classes?.Icon"
                role="@(IconAriaLabel.HasValue() ? "img" : null)"
-               aria-label="@IconAriaLabel" 
+               aria-label="@IconAriaLabel"
                aria-hidden="@(IconAriaLabel.HasValue() ? null : "true")" />
         }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor.cs
index 5caa680965..235823d862 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/NumberField/BitNumberField.razor.cs
@@ -1,4 +1,4 @@
-using System.Globalization;
+using System.Globalization;
 using System.Text.RegularExpressions;
 using System.Diagnostics.CodeAnalysis;
 
@@ -85,7 +85,23 @@ public BitNumberField()
     [Parameter] public string? DecrementAriaLabel { get; set; }
 
     /// <summary>
-    /// Custom icon name for the decrement button.
+    /// Gets or sets the icon to display on the decrement button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DecrementIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="DecrementIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: DecrementIcon="BitIconInfo.Bi("dash")"
+    /// FontAwesome: DecrementIcon="BitIconInfo.Fa("solid minus")"
+    /// Custom CSS: DecrementIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? DecrementIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon for the decrement button from the built-in Fluent UI icons.
+    /// For external icon libraries, use <see cref="DecrementIcon"/> instead.
     /// </summary>
     [Parameter] public string? DecrementIconName { get; set; }
 
@@ -110,7 +126,23 @@ public BitNumberField()
     [Parameter] public string? IconAriaLabel { get; set; }
 
     /// <summary>
-    /// Icon name for an icon to display alongside the number field's label.
+    /// Gets or sets the icon to display alongside the number field using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("calculator")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid calculator")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display alongside the number field from the built-in Fluent UI icons.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
     /// </summary>
     [Parameter] public string? IconName { get; set; }
 
@@ -120,7 +152,23 @@ public BitNumberField()
     [Parameter] public string? IncrementAriaLabel { get; set; }
 
     /// <summary>
-    /// Custom icon name for the increment button.
+    /// Gets or sets the icon to display on the increment button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IncrementIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IncrementIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: IncrementIcon="BitIconInfo.Bi("plus")"
+    /// FontAwesome: IncrementIcon="BitIconInfo.Fa("solid plus")"
+    /// Custom CSS: IncrementIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? IncrementIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon for the increment button from the built-in Fluent UI icons.
+    /// For external icon libraries, use <see cref="IncrementIcon"/> instead.
     /// </summary>
     [Parameter] public string? IncrementIconName { get; set; }
 
@@ -243,6 +291,27 @@ public BitNumberField()
     /// </summary>
     [Parameter] public RenderFragment? PrefixTemplate { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon to display on the clear button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="ClearButtonIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ClearButtonIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: ClearButtonIcon="BitIconInfo.Bi("x-circle-fill")"
+    /// FontAwesome: ClearButtonIcon="BitIconInfo.Fa("solid xmark")"
+    /// Custom CSS: ClearButtonIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? ClearButtonIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon for the clear button from the built-in Fluent UI icons.
+    /// For external icon libraries, use <see cref="ClearButtonIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? ClearButtonIconName { get; set; }
+
     /// <summary>
     /// Whether to shows the clear button when the BitNumberField has value.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor
index da8588c79d..0c08353b89 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/numberfield"
+@page "/components/numberfield"
 @page "/components/numerictextfield"
 @page "/components/numeric-text-field"
 @page "/components/spinbutton"
@@ -220,7 +220,54 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example14RazorCode" Id="example14">
+    <DemoExample Title="External Icons" RazorCode="@example14RazorCode" Id="example14">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b>, <b>IncrementIcon</b>, and <b>DecrementIcon</b> parameters.</div>
+
+        <br />
+        <br />
+
+        <div class="example-box">
+            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+            <div>Component Icon (FontAwesome):</div>
+            <br />
+            <BitNumberField Label="Label & Icon" TValue="int" Icon="@("fa-solid fa-calculator")" />
+
+            <br />
+
+            <BitNumberField Label="Icon with BitIconInfo.Css" TValue="int" Icon="@BitIconInfo.Css("fa-solid fa-lightbulb")" />
+
+            <br />
+
+            <BitNumberField Label="Icon with BitIconInfo.Fa" TValue="int" Icon="@BitIconInfo.Fa("solid calculator")" />
+
+            <br /><br /><br /><br />
+
+            <div>Increment & Decrement Icons (FontAwesome):</div>
+            <br />
+            <BitNumberField Label="Compact mode" TValue="int" Mode="BitSpinButtonMode.Compact"
+                            IncrementIcon="@BitIconInfo.Fa("solid plus")"
+                            DecrementIcon="@BitIconInfo.Fa("solid minus")" />
+
+            <br /><br /><br /><br />
+
+            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+            <div>Component Icon (Bootstrap):</div>
+            <br />
+            <BitNumberField Label="Icon with BitIconInfo.Bi" TValue="int" Icon="@BitIconInfo.Bi("calculator")" />
+
+            <br /><br /><br /><br />
+
+            <div>Increment & Decrement Icons (Bootstrap):</div>
+            <br />
+            <BitNumberField Label="Spread mode" TValue="int" Mode="BitSpinButtonMode.Spread"
+                            IncrementIcon="@BitIconInfo.Bi("plus-circle-fill")"
+                            DecrementIcon="@BitIconInfo.Bi("dash-circle-fill")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example15RazorCode" Id="example15">
         <div>Explores styling and class customization for BitNumberField, including component styles, custom classes, and detailed style options.</div>
         <br /><br />
         <div class="example-box">
@@ -251,7 +298,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example15RazorCode" Id="example15">
+    <DemoExample Title="RTL" RazorCode="@example16RazorCode" Id="example16">
         <div>Use BitNumberField in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.cs
index d49db1f074..1b288b4ef8 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.NumberField;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.NumberField;
 
 public partial class BitNumberFieldDemo
 {
@@ -56,11 +56,22 @@ public partial class BitNumberFieldDemo
             Description = "Accessible label text for the decrement button (for screen reader users).",
         },
         new()
+        {
+            Name = "DecrementIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display on the decrement button using custom CSS classes for external icon libraries. Takes precedence over DecrementIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "DecrementIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom icon name for the decrement button.",
+            Description = "Gets or sets the name of the icon for the decrement button from the built-in Fluent UI icons. For external icon libraries, use DecrementIcon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -91,11 +102,22 @@ public partial class BitNumberFieldDemo
             Description = "The aria label of the icon for the benefit of screen readers.",
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display alongside the number field using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Icon name for an icon to display alongside the number field's label.",
+            Description = "Gets or sets the name of the icon to display alongside the number field from the built-in Fluent UI icons. For external icon libraries, use Icon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -105,11 +127,22 @@ public partial class BitNumberFieldDemo
             Description = "Accessible label text for the increment button (for screen reader users).",
         },
         new()
+        {
+            Name = "IncrementIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display on the increment button using custom CSS classes for external icon libraries. Takes precedence over IncrementIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IncrementIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom icon name for the increment button.",
+            Description = "Gets or sets the name of the icon for the increment button from the built-in Fluent UI icons. For external icon libraries, use IncrementIcon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -263,6 +296,24 @@ public partial class BitNumberFieldDemo
             Description = "Shows the custom prefix for numeric field.",
         },
         new()
+        {
+            Name = "ClearButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display on the clear button using custom CSS classes for external icon libraries. Takes precedence over ClearButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ClearButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon for the clear button from the built-in Fluent UI icons. For external icon libraries, use ClearButtonIcon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
         {
             Name = "ShowClearButton",
             Type = "bool",
@@ -309,6 +360,36 @@ public partial class BitNumberFieldDemo
     ];
     private readonly List<ComponentSubClass> componentSubClasses =
     [
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Description = "Represents icon information for rendering icons in Bit BlazorUI components. Supports both built-in Fluent UI icons and custom/external icon libraries (e.g. FontAwesome, Bootstrap Icons). Use BitIconInfo.Css(string), BitIconInfo.Fa(string), or BitIconInfo.Bi(string) for external icons.",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon. For external icons, this can be the full CSS class name if BaseClass and Prefix are empty."
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+                },
+            ]
+        },
         new()
         {
             Id = "class-styles",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.samples.cs
index 25504ff105..fdc797ba11 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/NumberField/BitNumberFieldDemo.razor.samples.cs
@@ -147,6 +147,31 @@ public class BitNumberFieldValidationModel
 private BitNumberFieldValidationModel validationModel = new();";
 
     private readonly string example14RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<div>Component Icon (FontAwesome):</div>
+<BitNumberField Label=""Label & Icon"" TValue=""int"" Icon=""@(""fa-solid fa-calculator"")"" />
+
+<BitNumberField Label=""Icon with BitIconInfo.Css"" TValue=""int"" Icon=""@BitIconInfo.Css(""fa-solid fa-lightbulb"")"" />
+
+<BitNumberField Label=""Icon with BitIconInfo.Fa"" TValue=""int"" Icon=""@BitIconInfo.Fa(""solid calculator"")"" />
+
+<div>Increment & Decrement Icons (FontAwesome):</div>
+<BitNumberField Label=""Compact mode"" TValue=""int"" Mode=""BitSpinButtonMode.Compact""
+                IncrementIcon=""@BitIconInfo.Fa(""solid plus"")""
+                DecrementIcon=""@BitIconInfo.Fa(""solid minus"")"" />
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<div>Component Icon (Bootstrap):</div>
+<BitNumberField Label=""Icon with BitIconInfo.Bi"" TValue=""int"" Icon=""@BitIconInfo.Bi(""calculator"")"" />
+
+<div>Increment & Decrement Icons (Bootstrap):</div>
+<BitNumberField Label=""Spread mode"" TValue=""int"" Mode=""BitSpinButtonMode.Spread""
+                IncrementIcon=""@BitIconInfo.Bi(""plus-circle-fill"")""
+                DecrementIcon=""@BitIconInfo.Bi(""dash-circle-fill"")"" />";
+
+    private readonly string example15RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -229,7 +254,7 @@ public class BitNumberFieldValidationModel
                 Label=""Styles""
                 Styles=""@(new() { Root = ""margin-inline: 1rem;"",
                                   Focused = ""--focused-background: #b2b2b25a;"",
-                                  InputWrapper = ""background: var(--focused-background);"",
+                                  InputContainer = ""background: var(--focused-background);"",
                                   Label = ""text-shadow: aqua 0 0 1rem; font-weight: 900; font-size: 1.25rem;"",
                                   Input = ""padding: 0.5rem;"" })"" />
 
@@ -237,12 +262,12 @@ public class BitNumberFieldValidationModel
                 Label=""Classes""
                 @bind-Value=""classesValue""
                 Classes=""@(new() { Root = ""custom-root"",
-                                 InputWrapper = ""custom-input-wrapper"",
+                                 InputContainer = ""custom-input-wrapper"",
                                  Focused = ""custom-focus"",
                                  Input = ""custom-input"",
                                  Label = $""custom-label{(classesValue is null ? string.Empty : "" custom-label-top"")}"" })"" />";
 
-    private readonly string example15RazorCode = @"
+    private readonly string example16RazorCode = @"
 <CascadingValue Value=""BitDir.Rtl"">
 
     <BitNumberField Label=""برچسب در بالا"" TValue=""int"" ShowButtons />

From 65380414983822c5671f47b0b2259b5d49aea531 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sat, 14 Feb 2026 21:42:09 +0330
Subject: [PATCH 08/66] feat(blazorui): add new Icon parameters to BitRating
 #12090 (#12091)

---
 .../Components/Inputs/Rating/BitRating.razor  | 11 ++-
 .../Inputs/Rating/BitRating.razor.cs          | 42 +++++++++--
 .../Inputs/Rating/BitRatingDemo.razor         | 33 ++++++++-
 .../Inputs/Rating/BitRatingDemo.razor.cs      | 70 +++++++++++++++++--
 4 files changed, 142 insertions(+), 14 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor
index 9ad5799b68..556dc7f234 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor
@@ -1,6 +1,11 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<double>
 
+@{
+    var selectedIcon = BitIconInfo.From(SelectedIcon, SelectedIconName ?? "FavoriteStarFill");
+    var unselectedIcon = BitIconInfo.From(UnselectedIcon, UnselectedIconName ?? "FavoriteStar");
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      class="@ClassBuilder.Value"
@@ -36,11 +41,11 @@
             <div class="bit-rtg-ict @Classes?.IconContainer" style="@Styles?.IconContainer">
                 <i aria-hidden="true"
                    style="@Styles?.UnselectedIcon"
-                   class="bit-rtg-iem bit-icon bit-icon--@(percentage == 100 ? SelectedIconName : UnselectedIconName) @Classes?.UnselectedIcon">
+                   class="bit-rtg-iem @(percentage == 100 ? selectedIcon?.GetCssClasses() : unselectedIcon?.GetCssClasses()) @Classes?.UnselectedIcon">
                 </i>
                 <i aria-hidden="true"
                    style=@(FormattableString.Invariant($"width:{percentage}%; {Styles?.SelectedIcon}"))
-                   class="bit-rtg-ifl bit-icon bit-icon--@(percentage > 0 ? SelectedIconName : UnselectedIconName) @Classes?.SelectedIcon">
+                   class="bit-rtg-ifl @(percentage > 0 ? selectedIcon?.GetCssClasses() : unselectedIcon?.GetCssClasses()) @Classes?.SelectedIcon">
                 </i>
             </div>
         </button>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor.cs
index c800be7910..04ba9ac3ba 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Rating/BitRating.razor.cs
@@ -1,4 +1,4 @@
-using System.Diagnostics.CodeAnalysis;
+using System.Diagnostics.CodeAnalysis;
 
 namespace Bit.BlazorUI;
 
@@ -41,9 +41,25 @@ public partial class BitRating : BitInputBase<double>
     [Parameter] public int Max { get; set; } = 5;
 
     /// <summary>
-    /// Custom icon name for selected rating elements, If unset, default will be the FavoriteStarFill icon.
+    /// Gets or sets the icon to display for selected rating elements using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="SelectedIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string SelectedIconName { get; set; } = "FavoriteStarFill";
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="SelectedIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: SelectedIcon="BitIconInfo.Bi("star-fill")"
+    /// FontAwesome: SelectedIcon="BitIconInfo.Fa("solid star")"
+    /// Custom CSS: SelectedIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? SelectedIcon { get; set; }
+
+    /// <summary>
+    /// Custom icon name for selected rating elements. If unset, default will be the FavoriteStarFill icon.
+    /// The icon name should be from the Fluent UI icon set. For external icon libraries, use <see cref="SelectedIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? SelectedIconName { get; set; }
 
     /// <summary>
     /// Size of rating elements.
@@ -57,9 +73,25 @@ public partial class BitRating : BitInputBase<double>
     [Parameter] public BitRatingClassStyles? Styles { get; set; }
 
     /// <summary>
-    /// Custom icon name for unselected rating elements, If unset, default will be the FavoriteStar icon.
+    /// Gets or sets the icon to display for unselected rating elements using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="UnselectedIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="UnselectedIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: UnselectedIcon="BitIconInfo.Bi("star")"
+    /// FontAwesome: UnselectedIcon="BitIconInfo.Fa("solid star")"
+    /// Custom CSS: UnselectedIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? UnselectedIcon { get; set; }
+
+    /// <summary>
+    /// Custom icon name for unselected rating elements. If unset, default will be the FavoriteStar icon.
+    /// The icon name should be from the Fluent UI icon set. For external icon libraries, use <see cref="UnselectedIcon"/> instead.
     /// </summary>
-    [Parameter] public string UnselectedIconName { get; set; } = "FavoriteStar";
+    [Parameter] public string? UnselectedIconName { get; set; }
 
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor
index 07a208eac2..0dfae38a18 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/rating"
+@page "/components/rating"
 
 <PageOutlet Url="components/rating"
             Title="Rating"
@@ -141,7 +141,36 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example9RazorCode" Id="example9">
+    <DemoExample Title="External Icons" RazorCode="@example9RazorCode" Id="example9">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>SelectedIcon</b> and <b>UnselectedIcon</b> parameters.</div>
+        
+        <br />
+        <br />
+        
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+        <div class="example-box">
+            <div>FontAwesome (stars):</div>
+            <BitRating SelectedIcon="@("fa-solid fa-star")" UnselectedIcon="@("fa-regular fa-star")" />
+            <br />
+            <div>FontAwesome (hearts):</div>
+            <BitRating SelectedIcon="@BitIconInfo.Fa("solid heart")" UnselectedIcon="@BitIconInfo.Fa("regular heart")" />
+        </div>
+        
+        <br />
+        
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        
+        <div class="example-box">
+            <div>Bootstrap (stars):</div>
+            <BitRating SelectedIcon="@BitIconInfo.Css("bi bi-star-fill")" UnselectedIcon="@BitIconInfo.Css("bi bi-star")" />
+            <br />
+            <div>Bootstrap (hearts):</div>
+            <BitRating SelectedIcon="@BitIconInfo.Bi("heart-fill")" UnselectedIcon="@BitIconInfo.Bi("heart")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="RTL" RazorCode="@example10RazorCode" Id="example10">
         <div>Use the BitRating component in right-to-left (RTL).</div>
         <br />
         <div dir="rtl" class="example-box">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor.cs
index fa54bb2455..326234c05b 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Rating/BitRatingDemo.razor.cs
@@ -49,11 +49,20 @@ public partial class BitRatingDemo
             Description = "Maximum rating. Must be >= min (0 if AllowZeroStars is true, 1 otherwise).",
         },
         new()
+        {
+            Name = "SelectedIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Icon for selected rating elements using external icon libraries (e.g. FontAwesome, Bootstrap Icons). Takes precedence over SelectedIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "SelectedIconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "FavoriteStarFill",
-            Description = "Custom icon name for selected rating elements.",
+            Description = "Custom icon name for selected rating elements (Fluent UI). For external icon libraries, use SelectedIcon instead.",
         },
         new()
         {
@@ -74,11 +83,20 @@ public partial class BitRatingDemo
             Href = "#rating-class-styles",
         },
         new()
+        {
+            Name = "UnselectedIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Icon for unselected rating elements using external icon libraries (e.g. FontAwesome, Bootstrap Icons). Takes precedence over UnselectedIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "UnselectedIconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "FavoriteStar",
-            Description = "Custom icon name for unselected rating elements.",
+            Description = "Custom icon name for unselected rating elements (Fluent UI). For external icon libraries, use UnselectedIcon instead.",
         }
     ];
 
@@ -127,6 +145,36 @@ public partial class BitRatingDemo
                     Description = "Custom CSS classes/styles for the rating unselected icon.",
                 }
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Description = "Represents icon information for rendering icons. Supports built-in Fluent UI icons and external icon libraries (FontAwesome, Bootstrap Icons, etc.). Use BitIconInfo.Css(\"fa-solid fa-star\"), BitIconInfo.Fa(\"solid star\"), or BitIconInfo.Bi(\"star-fill\") for external icons.",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon.",
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty.",
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For external icon libraries, you might set this to \"fa-\" or leave empty.",
+                },
+            ]
         }
     ];
 
@@ -294,5 +342,19 @@ private void HandleValidSubmit() { }
 private void HandleInvalidSubmit() { }";
 
     private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitRating SelectedIcon=""@(""fa-solid fa-star"")"" UnselectedIcon=""@(""fa-regular fa-star"")"" />
+
+<BitRating SelectedIcon=""@BitIconInfo.Fa(""solid heart"")"" UnselectedIcon=""@BitIconInfo.Fa(""regular heart"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitRating SelectedIcon=""@BitIconInfo.Css(""bi bi-star-fill"")"" UnselectedIcon=""@BitIconInfo.Css(""bi bi-star"")"" />
+
+<BitRating SelectedIcon=""@BitIconInfo.Bi(""heart-fill"")"" UnselectedIcon=""@BitIconInfo.Bi(""heart"")"" />";
+
+    private readonly string example10RazorCode = @"
 <BitRating Dir=""BitDir.Rtl"" />";
 }

From 5817e696450ca2254c16862c09a48ffd42583508 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 15 Feb 2026 22:24:18 +0330
Subject: [PATCH 09/66] feat(blazorui): add new Icon parameters to BitSearchBox
 #12092 (#12093)

---
 .../Inputs/SearchBox/BitSearchBox.razor       | 11 ++-
 .../Inputs/SearchBox/BitSearchBox.razor.cs    | 72 +++++++++++++++++-
 .../Inputs/SearchBox/BitSearchBoxDemo.razor   | 63 +++++++++++++++-
 .../SearchBox/BitSearchBoxDemo.razor.cs       | 73 ++++++++++++++++++-
 .../BitSearchBoxDemo.razor.samples.cs         | 34 ++++++++-
 5 files changed, 237 insertions(+), 16 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor
index 07144a740b..f1300295bd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitTextInputBase<string?>
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -9,12 +9,13 @@
     <div class="bit-srb-cnt @Classes?.InputContainer" style="@Styles?.InputContainer">
         @if (HideIcon is false)
         {
+            var icon = BitIconInfo.From(Icon, IconName ?? "Search");
             <div aria-hidden="true"
                  style="@Styles?.IconWrapper" 
                  class="bit-srb-iwp @Classes?.IconWrapper">
                 <i aria-hidden="true" 
                    style="@Styles?.Icon" 
-                   class="bit-icon bit-icon--@IconName @Classes?.Icon" />
+                   class="@icon?.GetCssClasses() @Classes?.Icon" />
             </div>
         }
 
@@ -82,7 +83,8 @@
                 }
                 else
                 {
-                    <i style="@Styles?.ClearButtonIcon" class="bit-icon bit-icon--Cancel @Classes?.ClearButtonIcon" aria-hidden="true" />
+                    var clearButtonIcon = BitIconInfo.From(ClearButtonIcon, ClearButtonIconName ?? "Cancel");
+                    <i style="@Styles?.ClearButtonIcon" class="@clearButtonIcon?.GetCssClasses() @Classes?.ClearButtonIcon" aria-hidden="true" />
                 }
             </button>
         }
@@ -102,7 +104,8 @@
             }
             else
             {
-                <i style="@Styles?.SearchButtonIcon" class="bit-icon bit-icon--@SearchButtonIconName @Classes?.SearchButtonIcon" aria-hidden="true" />
+                var searchButtonIcon = BitIconInfo.From(SearchButtonIcon, SearchButtonIconName ?? "ChromeBackMirrored");
+                <i style="@Styles?.SearchButtonIcon" class="@searchButtonIcon?.GetCssClasses() @Classes?.SearchButtonIcon" aria-hidden="true" />
             }
         </button>
     }
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs
index 69d620b6a6..9d9bafde0f 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/SearchBox/BitSearchBox.razor.cs
@@ -35,6 +35,29 @@ public partial class BitSearchBox : BitTextInputBase<string?>
     /// </summary>
     [Parameter] public BitSearchBoxClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon to display on the clear button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="ClearButtonIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ClearButtonIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: ClearButtonIcon="BitIconInfo.Bi("x-circle-fill")"
+    /// FontAwesome: ClearButtonIcon="BitIconInfo.Fa("solid xmark")"
+    /// Custom CSS: ClearButtonIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? ClearButtonIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display on the clear button from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// For external icon libraries, use <see cref="ClearButtonIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? ClearButtonIconName { get; set; }
+
     /// <summary>
     /// The custom template for clear button icon.
     /// </summary>
@@ -80,9 +103,32 @@ public partial class BitSearchBox : BitTextInputBase<string?>
     [Parameter] public bool HideClearButton { get; set; }
 
     /// <summary>
-    /// The icon name for the icon shown at the beginning of the search box.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
-    [Parameter] public string IconName { get; set; } = "Search";
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("search")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Search</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
+    [Parameter] public string? IconName { get; set; }
 
     /// <summary>
     /// Sets the inputmode html attribute of the input element.
@@ -143,9 +189,27 @@ public partial class BitSearchBox : BitTextInputBase<string?>
     [Parameter] public RenderFragment? PrefixTemplate { get; set; }
 
     /// <summary>
-    /// Custom icon name for the search button.
+    /// Gets or sets the icon to display on the search button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="SearchButtonIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="SearchButtonIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: SearchButtonIcon="BitIconInfo.Bi("arrow-left")"
+    /// FontAwesome: SearchButtonIcon="BitIconInfo.Fa("solid arrow-left")"
+    /// Custom CSS: SearchButtonIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? SearchButtonIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display on the search button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string SearchButtonIconName { get; set; } = "ChromeBackMirrored";
+    /// <remarks>
+    /// For external icon libraries, use <see cref="SearchButtonIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? SearchButtonIconName { get; set; }
 
     /// <summary>
     /// The custom template for search button icon.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor
index 58b9305379..bb9f7189dd 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/searchbox"
+@page "/components/searchbox"
 @page "/components/search-box"
 
 <PageOutlet Url="components/searchbox"
@@ -319,7 +319,64 @@
             </div>
         </DemoExample>
 
-        <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" Id="example13">
+        <DemoExample Title="External Icons" RazorCode="@example13RazorCode" Id="example13">
+            <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> and <b>SearchButtonIcon</b> parameters.</div>
+
+            <br />
+            <br />
+
+            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+            <div>FontAwesome (Icon):</div>
+            <br />
+            <div class="example-box">
+                <BitSearchBox Placeholder="Search" Icon="@("fa-solid fa-house")" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Css("fa-solid fa-heart")" Color="BitColor.Secondary" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Fa("fa-brands fa-github")" Color="BitColor.Tertiary" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Fa("solid search")" Color="BitColor.Error" />
+            </div>
+
+            <br /><br /><br />
+
+            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+            <div>Bootstrap (Icon):</div>
+            <br />
+            <div class="example-box">
+                <BitSearchBox Placeholder="Search" Icon="@("bi bi-house-fill")" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Css("bi bi-heart-fill")" Color="BitColor.Secondary" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Bi("search")" Color="BitColor.Tertiary" />
+                <br />
+                <BitSearchBox Placeholder="Search" Icon="@BitIconInfo.Bi("gear-fill")" Color="BitColor.Error" />
+            </div>
+
+            <br /><br /><br />
+
+            <div>Search button with external icons (ShowSearchButton + SearchButtonIcon):</div>
+            <br />
+            <div class="example-box">
+                <BitSearchBox Placeholder="Search" ShowSearchButton SearchButtonIcon="@BitIconInfo.Fa("solid search")" />
+                <br />
+                <BitSearchBox Placeholder="Search" ShowSearchButton SearchButtonIcon="@BitIconInfo.Bi("search")" Color="BitColor.Secondary" />
+            </div>
+
+            <br /><br /><br />
+
+            <div>Clear button with external icons (ClearButtonIcon):</div>
+            <br />
+            <div class="example-box">
+                <BitSearchBox Placeholder="Type to see clear icon" ClearButtonIcon="@BitIconInfo.Fa("solid xmark")" />
+                <br />
+                <BitSearchBox Placeholder="Type to see clear icon" ClearButtonIcon="@BitIconInfo.Bi("x-circle-fill")" Color="BitColor.Secondary" />
+            </div>
+        </DemoExample>
+
+        <DemoExample Title="Style & Class" RazorCode="@example14RazorCode" Id="example14">
             <div>Explore styling and class customization for BitSearchBox, including component styles, custom classes, and detailed styles.</div>
             <br /><br />
             <div class="example-box">
@@ -346,7 +403,7 @@
             </div>
         </DemoExample>
 
-        <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
+        <DemoExample Title="RTL" RazorCode="@example15RazorCode" Id="example15">
             <div>Use the BitSearchBox component in right-to-left (RTL).</div><br />
             <div dir="rtl">
                 <div class="example-box">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.cs
index 9098b436e5..86a14ab011 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.cs
@@ -25,6 +25,22 @@ public partial class BitSearchBoxDemo
             Href = "#searchbox-class-styles",
         },
         new()
+        {
+            Name = "ClearButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display on the clear button using custom CSS classes for external icon libraries. Takes precedence over ClearButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ClearButtonIconName",
+            Type = "string?",
+            DefaultValue = "Cancel",
+            Description = "Gets or sets the name of the icon to display on the clear button from the built-in Fluent UI icons.",
+        },
+        new()
         {
             Name = "ClearButtonTemplate",
             Type = "RenderFragment?",
@@ -83,11 +99,22 @@ public partial class BitSearchBoxDemo
             Description = "Whether to hide the clear button when the search box has value.",
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "Search",
-            Description = "The icon name for the icon shown at the beginning of the search box.",
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -166,11 +193,20 @@ public partial class BitSearchBoxDemo
             Description = "The custom template for the prefix of the search box.",
         },
         new()
+        {
+            Name = "SearchButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display on the search button using custom CSS classes for external icon libraries. Takes precedence over SearchButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "SearchButtonIconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "ChromeBackMirrored",
-            Description = "Custom icon name for the search button.",
+            Description = "Gets or sets the name of the icon to display on the search button from the built-in Fluent UI icons.",
         },
         new()
         {
@@ -396,6 +432,35 @@ public partial class BitSearchBoxDemo
                     Description = "Custom CSS classes/styles for the search box's suggest item text.",
                 },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs
index ffe4428c3d..29b17d7f8a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/SearchBox/BitSearchBoxDemo.razor.samples.cs
@@ -242,6 +242,38 @@ public class ValidationSearchBoxModel
 <BitSearchBox Placeholder=""Disabled"" IsEnabled=""false"" />";
 
     private readonly string example13RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""fa-solid fa-house"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" Color=""BitColor.Secondary"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Fa(""fa-brands fa-github"")"" Color=""BitColor.Tertiary"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Fa(""solid search"")"" Color=""BitColor.Error"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""bi bi-house-fill"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" Color=""BitColor.Secondary"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Bi(""search"")"" Color=""BitColor.Tertiary"" />
+
+<BitSearchBox Placeholder=""Search"" Icon=""@BitIconInfo.Bi(""gear-fill"")"" Color=""BitColor.Error"" />
+
+
+<BitSearchBox Placeholder=""Search"" ShowSearchButton SearchButtonIcon=""@BitIconInfo.Fa(""solid search"")"" />
+
+<BitSearchBox Placeholder=""Search"" ShowSearchButton SearchButtonIcon=""@BitIconInfo.Bi(""search"")"" Color=""BitColor.Secondary"" />
+
+
+<BitSearchBox Placeholder=""Type to see clear icon"" ClearButtonIcon=""@BitIconInfo.Fa(""solid xmark"")"" />
+
+<BitSearchBox Placeholder=""Type to see clear icon"" ClearButtonIcon=""@BitIconInfo.Bi(""x-circle-fill"")"" Color=""BitColor.Secondary"" />";
+
+    private readonly string example14RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -310,7 +342,7 @@ public class ValidationSearchBoxModel
                                  IconWrapper = ""custom-icon-wrapper"",
                                  InputContainer = ""custom-input-container"" })"" />";
 
-    private readonly string example14RazorCode = @"
+    private readonly string example15RazorCode = @"
 <BitSearchBox Placeholder=""جستجو"" Dir=""BitDir.Rtl"" />
 <BitSearchBox Placeholder=""جستجو"" Dir=""BitDir.Rtl"" ShowSearchButton />
 <BitSearchBox Placeholder=""جستجو"" Dir=""BitDir.Rtl"" Underlined />";

From be5db15292b1376fba6a558f927be03db4007cbc Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Feb 2026 12:36:35 +0330
Subject: [PATCH 10/66] feat(blazorui): add new Icon parameters to BitTextField
 #12094 (#12095)

---
 .../Inputs/TextField/BitTextField.razor       |  12 +-
 .../Inputs/TextField/BitTextField.razor.cs    |  44 +++++++-
 .../Inputs/TextField/BitTextField.scss        |   2 +-
 .../Inputs/TextField/BitTextFieldDemo.razor   |  51 ++++++++-
 .../TextField/BitTextFieldDemo.razor.cs       | 104 +++++++++++++++++-
 5 files changed, 199 insertions(+), 14 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor
index 83b39b3168..9eab8e4b95 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor
@@ -124,18 +124,24 @@
                         aria-pressed="@(_elementType == BitInputType.Text ? "true" : "false")">
                     <span style="@Styles?.RevealPasswordIconContainer"
                           class="bit-tfl-rpc @Classes?.RevealPasswordIconContainer">
+                        @{
+                            var revealIcon = _elementType == BitInputType.Text
+                                ? BitIconInfo.From(HidePasswordIcon, HidePasswordIconName ?? "Hide3")
+                                : BitIconInfo.From(RevealPasswordIcon, RevealPasswordIconName ?? "View");
+                        }
                         <i aria-hidden="true" 
                            style="@Styles?.RevealPasswordIcon"
-                           class="bit-tfl-rpi bit-icon bit-icon--@(_elementType == BitInputType.Text ? "Hide3" : "View") @Classes?.RevealPasswordIcon" />
+                           class="bit-tfl-rpi @revealIcon.GetCssClasses() @Classes?.RevealPasswordIcon" />
                     </span>
                 </button>
             }
 
-            @if (IconName.HasValue())
+            @if (Icon is not null || IconName.HasValue())
             {
+                var icon = BitIconInfo.From(Icon, IconName);
                 <i aria-hidden="true" 
                    style="@Styles?.Icon"
-                   class="bit-tfl-ico bit-icon bit-icon--@IconName @Classes?.Icon" />
+                   class="bit-tfl-ico @icon?.GetCssClasses() @Classes?.Icon" />
             }
 
             @if (SuffixTemplate is not null)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor.cs
index 63fc72a8f5..0c9c255e1e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.razor.cs
@@ -1,4 +1,4 @@
-using System.Diagnostics.CodeAnalysis;
+using System.Diagnostics.CodeAnalysis;
 
 namespace Bit.BlazorUI;
 
@@ -76,8 +76,26 @@ public partial class BitTextField : BitTextInputBase<string?>
     [Parameter] public bool FullWidth { get; set; }
 
     /// <summary>
-    /// The icon name for the icon shown in the far right end of the text field.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// The icon name for the icon shown in the far right end of the text field from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
@@ -187,6 +205,28 @@ public partial class BitTextField : BitTextInputBase<string?>
     /// </summary>
     [Parameter] public string? RevealPasswordAriaLabel { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon for the reveal password button when password is hidden using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="RevealPasswordIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? RevealPasswordIcon { get; set; }
+
+    /// <summary>
+    /// The icon name for the reveal password button when password is hidden from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? RevealPasswordIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon for the reveal password button when password is shown using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="HidePasswordIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? HidePasswordIcon { get; set; }
+
+    /// <summary>
+    /// The icon name for the reveal password button when password is shown from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? HidePasswordIconName { get; set; }
+
     /// <summary>
     /// For multiline text, Number of rows.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scss
index c8436cb362..abb8ff89cf 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TextField/BitTextField.scss
@@ -216,9 +216,9 @@
 
 .bit-tfl-rpi,
 .bit-tfl-ico {
-    width: spacing(4);
     text-align: center;
     font-size: spacing(2);
+    min-width: spacing(3.5);
 }
 
 .bit-tfl-des {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor
index e6c84bff94..95d18d45ed 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor
@@ -297,7 +297,54 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example16RazorCode" CsharpCode="@example16CsharpCode" Id="example16">
+    <DemoExample Title="External Icons" RazorCode="@example16RazorCode" Id="example16">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+
+        <br />
+        <br />
+        
+        <div class="example-box">
+            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+            <div>FontAwesome:</div>
+            <br />
+            <BitTextField Label="House" Icon="@("fa-solid fa-house")" />
+        
+            <br />
+        
+            <BitTextField Label="Heart" Icon="@BitIconInfo.Css("fa-solid fa-heart")" />
+        
+            <br />
+        
+            <BitTextField Label="GitHub" Icon="@BitIconInfo.Fa("brands github")" />
+        
+            <br />
+        
+            <BitTextField Label="Rocket" Icon="@BitIconInfo.Fa("solid rocket")" />
+        
+            <br /><br /><br />
+
+            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+            <div>Bootstrap:</div>
+            <br />
+            <BitTextField Label="House" Icon="@("bi bi-house-fill")" />
+        
+            <br />
+        
+            <BitTextField Label="Heart" Icon="@BitIconInfo.Css("bi bi-heart-fill")" />
+        
+            <br />
+        
+            <BitTextField Label="GitHub" Icon="@BitIconInfo.Bi("github")" />
+        
+            <br />
+        
+            <BitTextField Label="Gear" Icon="@BitIconInfo.Bi("gear-fill")" />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example17RazorCode" CsharpCode="@example17CsharpCode" Id="example17">
         <div>Explores styling and class customization for BitTextField, including component styles, custom classes, and detailed style options.</div>
         <br /><br />
         <div class="example-box">
@@ -326,7 +373,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example17RazorCode" Id="example17">
+    <DemoExample Title="RTL" RazorCode="@example18RazorCode" Id="example18">
         <div>Use BitTextField in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor.cs
index 3ad40d7561..1d5cfd76dc 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TextField/BitTextFieldDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TextField;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TextField;
 
 public partial class BitTextFieldDemo
 {
@@ -82,11 +82,36 @@ public partial class BitTextFieldDemo
             Description = "Forces the text field fill 100% of its container width.",
         },
         new()
+        {
+            Name = "HidePasswordIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the reveal password button when password is shown using custom CSS classes for external icon libraries.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "HidePasswordIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name for the reveal password button when password is shown from the built-in Fluent UI icons.",
+        },
+        new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name for the icon shown in the far right end of the text field.",
+            Description = "The icon name for the icon shown in the far right end of the text field from the built-in Fluent UI icons.",
         },
         new()
         {
@@ -220,7 +245,23 @@ public partial class BitTextFieldDemo
             Name = "RevealPasswordAriaLabel",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Suffix displayed after the text field contents. This is not included in the value. \r\n Ensure a descriptive label is present to assist screen readers, as the value does not include the suffix.",
+            Description = "Aria label for the reveal password button.",
+        },
+        new()
+        {
+            Name = "RevealPasswordIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the reveal password button when password is hidden using custom CSS classes for external icon libraries.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "RevealPasswordIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name for the reveal password button when password is hidden from the built-in Fluent UI icons.",
         },
         new()
         {
@@ -420,7 +461,36 @@ public partial class BitTextFieldDemo
                     Description = "Custom CSS classes/styles for the BitTextField's description."
                 }
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
     private readonly List<ComponentSubEnum> componentSubEnums =
@@ -923,6 +993,28 @@ private void HandleValidSubmit() { }
 <BitTextField Label=""TertiaryBorder"" Accent=""BitColor.TertiaryBorder"" IconName=""@BitIconName.Calendar"" />";
 
     private readonly string example16RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTextField Label=""House"" Icon=""@(""fa-solid fa-house"")"" />
+
+<BitTextField Label=""Heart"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" />
+
+<BitTextField Label=""GitHub"" Icon=""@BitIconInfo.Fa(""brands github"")"" />
+
+<BitTextField Label=""Rocket"" Icon=""@BitIconInfo.Fa(""solid rocket"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTextField Label=""House"" Icon=""@(""bi bi-house-fill"")"" />
+
+<BitTextField Label=""Heart"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" />
+
+<BitTextField Label=""GitHub"" Icon=""@BitIconInfo.Bi(""github"")"" />
+
+<BitTextField Label=""Gear"" Icon=""@BitIconInfo.Bi(""gear-fill"")"" />";
+
+    private readonly string example17RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -1031,10 +1123,10 @@ private void HandleValidSubmit() { }
                                  Focused = ""custom-focus"",
                                  Input = ""custom-input"",
                                  Label = $""custom-label{(string.IsNullOrEmpty(classesValue) ? string.Empty : "" custom-label-top"")}"" })"" />";
-    private readonly string example16CsharpCode = @"
+    private readonly string example17CsharpCode = @"
 private string? classesValue;";
 
-    private readonly string example17RazorCode = @"
+    private readonly string example18RazorCode = @"
 <BitTextField Dir=""BitDir.Rtl""
               Placeholder=""پست الکترونیکی""
               IconName=""@BitIconName.EditMail"" />

From ef6718ee33322523596885faca9ac82418d3867b Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Feb 2026 15:55:54 +0330
Subject: [PATCH 11/66] feat(blazorui): add new Icon parameters to
 BitTimePicker #12096 (#12097)

---
 .../Inputs/TimePicker/BitTimePicker.razor     |  23 ++-
 .../Inputs/TimePicker/BitTimePicker.razor.cs  |  87 ++++++++++-
 .../Inputs/TimePicker/BitTimePickerDemo.razor |  45 +++++-
 .../TimePicker/BitTimePickerDemo.razor.cs     | 138 +++++++++++++++++-
 .../BitTimePickerDemo.razor.samples.cs        |  30 +++-
 5 files changed, 303 insertions(+), 20 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor
index 8aacab1a99..785636e557 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor
@@ -1,6 +1,14 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<TimeSpan?>
 
+@{
+    var increaseHourIcon = BitIconInfo.From(IncreaseHourIcon, IncreaseHourIconName ?? "ChevronDownSmall bit-ico-r180");
+    var decreaseHourIcon = BitIconInfo.From(DecreaseHourIcon, DecreaseHourIconName ?? "ChevronDownSmall");
+    var increaseMinuteIcon = BitIconInfo.From(IncreaseMinuteIcon, IncreaseMinuteIconName ?? "ChevronDownSmall bit-ico-r180");
+    var decreaseMinuteIcon = BitIconInfo.From(DecreaseMinuteIcon, DecreaseMinuteIconName ?? "ChevronDownSmall");
+    var closeIcon = BitIconInfo.From(CloseButtonIcon, CloseButtonIconName ?? "Cancel");
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      style="@StyleBuilder.Value"
@@ -53,7 +61,8 @@
                 }
                 else
                 {
-                    <i style="@Styles?.Icon" class="bit-tpc-ico bit-icon bit-icon--@IconName @Classes?.Icon" aria-hidden="true" />
+                    var icon = BitIconInfo.From(Icon, IconName ?? "Clock");
+                    <i style="@Styles?.Icon" class="bit-tpc-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
                 }
             </div>
         </div>
@@ -88,7 +97,7 @@
                             style="@Styles?.IncreaseHourButton"
                             class="bit-tpc-tbt @Classes?.IncreaseHourButton"
                             disabled="@(IsEnabled is false)">
-                        <i style="@Styles?.IncreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.IncreaseHourIcon" aria-hidden="true" />
+                        <i style="@Styles?.IncreaseHourIcon" class="@increaseHourIcon?.GetCssClasses() @Classes?.IncreaseHourIcon" aria-hidden="true" />
                     </button>
                     <input @ref="_inputHourRef"
                            @bind="@_hourView"
@@ -110,7 +119,7 @@
                             style="@Styles?.DecreaseHourButton"
                             class="bit-tpc-tbt @Classes?.DecreaseHourButton"
                             disabled="@(IsEnabled is false)">
-                        <i style="@Styles?.DecreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.DecreaseHourIcon" aria-hidden="true" />
+                        <i style="@Styles?.DecreaseHourIcon" class="@decreaseHourIcon?.GetCssClasses() @Classes?.DecreaseHourIcon" aria-hidden="true" />
                     </button>
                 </div>
                 <div style="@Styles?.HourMinuteSeparator" class="bit-tpc-tpr bit-tpc-tdv @Classes?.HourMinuteSeparator">:</div>
@@ -122,7 +131,7 @@
                             style="@Styles?.IncreaseMinuteButton"
                             class="bit-tpc-tbt @Classes?.IncreaseMinuteButton"
                             disabled="@(IsEnabled is false)">
-                        <i style="@Styles?.IncreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.IncreaseMinuteIcon" aria-hidden="true" />
+                        <i style="@Styles?.IncreaseMinuteIcon" class="@increaseMinuteIcon?.GetCssClasses() @Classes?.IncreaseMinuteIcon" aria-hidden="true" />
                     </button>
                     <input @ref="_inputMinuteRef"
                            @bind="@_minuteView"
@@ -144,7 +153,7 @@
                             style="@Styles?.DecreaseMinuteButton"
                             class="bit-tpc-tbt @Classes?.DecreaseMinuteButton"
                             disabled="@(IsEnabled is false)">
-                        <i style="@Styles?.DecreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.DecreaseMinuteIcon" aria-hidden="true" />
+                        <i style="@Styles?.DecreaseMinuteIcon" class="@decreaseMinuteIcon?.GetCssClasses() @Classes?.DecreaseMinuteIcon" aria-hidden="true" />
                     </button>
                 </div>
             </div>
@@ -178,7 +187,7 @@
                         class="bit-tpc-tbt bit-tpc-cbn @Classes?.CloseButton"
                         title="@CloseButtonTitle"
                         aria-label="@CloseButtonTitle">
-                    <i style="@Styles?.CloseButtonIcon" class="bit-icon bit-icon--Cancel @Classes?.CloseButtonIcon" aria-hidden="true" />
+                    <i style="@Styles?.CloseButtonIcon" class="@closeIcon?.GetCssClasses() @Classes?.CloseButtonIcon" aria-hidden="true" />
                 </button>
             }
         </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs
index 502ff2fc7a..1fca701c90 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/TimePicker/BitTimePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Globalization;
+using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
 namespace Bit.BlazorUI;
@@ -115,6 +115,17 @@ private string? _minuteView
     /// </summary>
     [Parameter] public BitTimePickerClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// Gets or sets the close button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="CloseButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? CloseButtonIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the close button icon from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? CloseButtonIconName { get; set; }
+
     /// <summary>
     /// The title of the close button (tooltip).
     /// </summary>
@@ -127,6 +138,28 @@ private string? _minuteView
     [CallOnSet(nameof(OnSetCulture))]
     public CultureInfo? Culture { get; set; }
 
+    /// <summary>
+    /// Gets or sets the decrease hour button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DecreaseHourIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? DecreaseHourIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the decrease hour button icon from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? DecreaseHourIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the decrease minute button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DecreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? DecreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the decrease minute button icon from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? DecreaseMinuteIconName { get; set; }
+
     /// <summary>
     /// Determines the allowed drop directions of the callout.
     /// </summary>
@@ -144,9 +177,35 @@ private string? _minuteView
     [Parameter] public int HourStep { get; set; } = 1;
 
     /// <summary>
-    /// Optional TimePicker icon
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string IconName { get; set; } = "Clock";
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Clock</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery: 
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// The value is case-sensitive and must match a valid icon identifier. 
+    /// If not set or set to <c>null</c>, the default Clock icon will be rendered.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
+    [Parameter] public string? IconName { get; set; }
 
     /// <summary>
     /// TimePicker icon location
@@ -159,6 +218,28 @@ private string? _minuteView
     /// </summary>
     [Parameter] public RenderFragment? IconTemplate { get; set; }
 
+    /// <summary>
+    /// Gets or sets the increase hour button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IncreaseHourIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? IncreaseHourIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the increase hour button icon from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? IncreaseHourIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the increase minute button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IncreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? IncreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the increase minute button icon from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? IncreaseMinuteIconName { get; set; }
+
     /// <summary>
     /// The custom validation error message for the invalid value.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor
index 5fbbf21c8f..7564854e01 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/timepicker"
+@page "/components/timepicker"
 @page "/components/time-picker"
 
 <PageOutlet Url="components/timepicker"
@@ -190,7 +190,46 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+    <DemoExample Title="External Icons" RazorCode="@example13RazorCode" Id="example13">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+
+        <br />
+        <br />
+        
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+        <div>FontAwesome:</div>
+        <br />
+        <div class="example-content">
+            <BitTimePicker Icon="@("fa-solid fa-clock")" Placeholder="Select a time..." />
+            <br />
+            <BitTimePicker Icon="@BitIconInfo.Css("fa-solid fa-hourglass-half")"
+                           Placeholder="Select a time..."
+                           IconLocation="BitIconLocation.Left" />
+            <br />
+            <BitTimePicker Icon="@BitIconInfo.Fa("solid stopwatch")"
+                           Placeholder="Select a time..." />
+        </div>
+        
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <div class="example-content">
+            <BitTimePicker Icon="@("bi bi-clock-fill")" Placeholder="Select a time..." />
+            <br />
+            <BitTimePicker Icon="@BitIconInfo.Css("bi bi-alarm-fill")"
+                           Placeholder="Select a time..."
+                           IconLocation="BitIconLocation.Left" />
+            <br />
+            <BitTimePicker Icon="@BitIconInfo.Bi("stopwatch-fill")"
+                           Placeholder="Select a time..." />
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
         <div>Explore styling and class customization for BitTimePicker, including component styles, custom classes, and detailed styles.</div>
         <br /><br />
         <div>Component's Style & Class:</div>
@@ -228,7 +267,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
+    <DemoExample Title="RTL" RazorCode="@example15RazorCode" Id="example15">
         <div>Use BitTimePicker in right-to-left (RTL).</div>
         <br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.cs
index 95a172e157..fda77d53bb 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TimePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TimePicker;
 
 public partial class BitTimePickerDemo
 {
@@ -35,6 +35,24 @@ public partial class BitTimePickerDemo
             LinkType = LinkType.Link
         },
         new()
+        {
+            Name = "CloseButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the close button icon using custom CSS classes for external icon libraries. Takes precedence over CloseButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "CloseButtonIconName",
+            Type = "string?",
+            DefaultValue = "Cancel",
+            Description = "Gets or sets the name of the close button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
         {
             Name = "CloseButtonTitle",
             Type = "string",
@@ -49,6 +67,42 @@ public partial class BitTimePickerDemo
             Description = "CultureInfo for the TimePicker."
         },
         new()
+        {
+            Name = "DecreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the decrease hour button icon using custom CSS classes for external icon libraries. Takes precedence over DecreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "DecreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "ChevronDownSmall",
+            Description = "Gets or sets the name of the decrease hour button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
+        {
+            Name = "DecreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the decrease minute button icon using custom CSS classes for external icon libraries. Takes precedence over DecreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "DecreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "ChevronDownSmall",
+            Description = "Gets or sets the name of the decrease minute button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
         {
             Name = "DropDirection",
             Type = "BitDropDirection",
@@ -72,11 +126,22 @@ public partial class BitTimePickerDemo
             Description = "Determines increment/decrement steps for time-picker's hour.",
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
-            Type = "string",
+            Type = "string?",
             DefaultValue = "Clock",
-            Description = "Optional TimePicker icon."
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -95,6 +160,42 @@ public partial class BitTimePickerDemo
             Description = "Custom TimePicker icon template."
         },
         new()
+        {
+            Name = "IncreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the increase hour button icon using custom CSS classes for external icon libraries. Takes precedence over IncreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "IncreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "ChevronDownSmall",
+            Description = "Gets or sets the name of the increase hour button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
+        {
+            Name = "IncreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the increase minute button icon using custom CSS classes for external icon libraries. Takes precedence over IncreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "IncreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "ChevronDownSmall",
+            Description = "Gets or sets the name of the increase minute button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
         {
             Name = "IsOpen",
             Type = "bool",
@@ -547,7 +648,36 @@ public partial class BitTimePickerDemo
                     Description = "Custom CSS classes/styles for the close button icon of the BitTimePicker."
                 }
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.samples.cs
index 8131b2f2cb..134cfb75fe 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/TimePicker/BitTimePickerDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TimePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.TimePicker;
 
 public partial class BitTimePickerDemo
 {
@@ -130,6 +130,30 @@ private async Task OpenCallout()
                Placeholder=""Select a time..."" />";
 
     private readonly string example13RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTimePicker Icon=""@(""fa-solid fa-clock"")"" Placeholder=""Select a time..."" />
+
+<BitTimePicker Icon=""@BitIconInfo.Css(""fa-solid fa-hourglass-half"")""
+               Placeholder=""Select a time...""
+               IconLocation=""BitIconLocation.Left"" />
+
+<BitTimePicker Icon=""@BitIconInfo.Fa(""solid stopwatch"")""
+               Placeholder=""Select a time..."" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTimePicker Icon=""@(""bi bi-clock-fill"")"" Placeholder=""Select a time..."" />
+
+<BitTimePicker Icon=""@BitIconInfo.Css(""bi bi-alarm-fill"")""
+               Placeholder=""Select a time...""
+               IconLocation=""BitIconLocation.Left"" />
+
+<BitTimePicker Icon=""@BitIconInfo.Bi(""stopwatch-fill"")""
+               Placeholder=""Select a time..."" />";
+
+    private readonly string example14RazorCode = @"
 <style>
     .custom-class {
         overflow: hidden;
@@ -235,10 +259,10 @@ private async Task OpenCallout()
                                   DecreaseHourButton = ""custom-button"",
                                   IncreaseMinuteButton = ""custom-button"",
                                   DecreaseMinuteButton = ""custom-button"" })"" />";
-    private readonly string example13CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 private TimeSpan? classesValue;";
 
-    private readonly string example14RazorCode = @"
+    private readonly string example15RazorCode = @"
 <BitTimePicker Dir=""BitDir.Rtl""
                Standalone
                Label=""تایم""

From 4fbb8cc266f6e1b832d5cebd4c04543f1766f231 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Feb 2026 20:44:24 +0330
Subject: [PATCH 12/66] feat(blazorui): add new Icon parameters to BitCarousel
 #12098 (#12099)

---
 .../Lists/Carousel/BitCarousel.razor          |   8 +-
 .../Lists/Carousel/BitCarousel.razor.cs       |  50 +++++++-
 .../Lists/Carousel/BitCarousel.scss           |   6 +-
 .../Lists/Carousel/BitCarouselDemo.razor      |  71 ++++++++++-
 .../Lists/Carousel/BitCarouselDemo.razor.cs   | 116 +++++++++++++++++-
 5 files changed, 232 insertions(+), 19 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor
index e66d3424cf..327d693cda 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -22,18 +22,20 @@
 
         @if (HideNextPrev is false)
         {
+            var goLeftIcon = BitIconInfo.From(GoLeftIcon, GoLeftIconName ?? "ChevronRight");
+            var goRightIcon = BitIconInfo.From(GoRightIcon, GoRightIconName ?? "ChevronRight bit-ico-r180");
             <div @onclick="GoLeft"
                  class="bit-csl-lbt @Classes?.Buttons @Classes?.GoLeftButton"
                  style="@_goLeftButtonStyle @Styles?.Buttons @Styles?.GoLeftButton">
                 <i style="@Styles?.GoLeftButtonIcon"
-                   class="bit-icon bit-icon--@(GoLeftIcon ?? "ChevronRight") @Classes?.GoLeftButtonIcon" />
+                   class="@goLeftIcon?.GetCssClasses() @Classes?.GoLeftButtonIcon" />
             </div>
 
             <div @onclick="GoRight"
                  class="bit-csl-rbt @Classes?.Buttons @Classes?.GoRightButton"
                  style="@_goRightButtonStyle @Styles?.Buttons @Styles?.GoRightButton">
                 <i style="@Styles?.GoRightButtonIcon"
-                   class="bit-csl-rbi bit-icon bit-icon--@(GoRightIcon ?? "ChevronRight") @Classes?.GoRightButtonIcon" />
+                   class="@goRightIcon?.GetCssClasses() @Classes?.GoRightButtonIcon" />
             </div>
         }
     </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor.cs
index 08d5bc260d..f68593940a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// Carousel (slide-show) let people show their items in separate slides from two or more items.
@@ -59,14 +59,54 @@ public partial class BitCarousel : BitComponentBase
     [Parameter] public BitCarouselClassStyles? Classes { get; set; }
 
     /// <summary>
-    /// The custom icon name for the go to left button at the right side of the carousel.
+    /// Gets or sets the icon for the go to left button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="GoLeftIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? GoLeftIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="GoLeftIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: GoLeftIcon="BitIconInfo.Bi("chevron-left")"
+    /// FontAwesome: GoLeftIcon="BitIconInfo.Fa("solid chevron-left")"
+    /// Custom CSS: GoLeftIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? GoLeftIcon { get; set; }
 
     /// <summary>
-    /// The custom icon name for the go to right button at the left side of the carousel.
+    /// Gets or sets the name of the icon for the go to left button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string? GoRightIcon { get; set; }
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.ChevronLeft</c>).
+    /// <br />
+    /// For external icon libraries, use <see cref="GoLeftIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? GoLeftIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon for the go to right button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="GoRightIconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="GoRightIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: GoRightIcon="BitIconInfo.Bi("chevron-right")"
+    /// FontAwesome: GoRightIcon="BitIconInfo.Fa("solid chevron-right")"
+    /// Custom CSS: GoRightIcon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? GoRightIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon for the go to right button from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.ChevronRight</c>).
+    /// <br />
+    /// For external icon libraries, use <see cref="GoRightIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? GoRightIconName { get; set; }
 
     /// <summary>
     /// Hides the Dots indicator at the bottom of the BitCarousel.
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss
index d8dff6a986..76fc2d89e1 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Carousel/BitCarousel.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-csl {
     display: flex;
@@ -67,10 +67,6 @@
     left: 0;
 }
 
-.bit-csl-rbi {
-    transform: scaleX(-1);
-}
-
 .bit-csl-dcn {
     text-align: center;
     margin-top: spacing(1.25);
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor
index e836b5e5d4..15f26baf99 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/carousel"
+@page "/components/carousel"
 
 <PageOutlet Url="components/carousel"
             Title="Carousel"
@@ -195,7 +195,74 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example7RazorCode" Id="example7">
+    <DemoExample Title="External Icons" RazorCode="@example7RazorCode" Id="example7">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>GoLeftIcon</b> and <b>GoRightIcon</b> parameters.</div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome (circle-arrow icons):</div>
+        <br />
+        <BitCarousel InfiniteScrolling
+                     GoLeftIcon="@BitIconInfo.Fa("solid circle-arrow-right")"
+                     GoRightIcon="@BitIconInfo.Fa("solid circle-arrow-left")">
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img1.jpg" />
+                <div class="text-title">Aurora</div>
+                <div class="text-description">This is Aurora and it's fantastic</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img2.jpg" />
+                <div class="text-title">Beautiful Mountain</div>
+                <div class="text-description">This is a Beautiful Mountain and it's gorgeous</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img3.jpg" />
+                <div class="text-title">Forest In The Valley</div>
+                <div class="text-description">This is a Forest In The Valley and it's beautiful</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img4.jpg" />
+                <div class="text-title">Road Among The Mountains</div>
+                <div class="text-description">This is a Road Among The Mountains and it's amazing</div>
+            </BitCarouselItem>
+        </BitCarousel>
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap Icons (arrow-left-circle / arrow-right-circle):</div>
+        <br />
+        <BitCarousel InfiniteScrolling
+                     GoLeftIcon="@BitIconInfo.Bi("arrow-right-circle")"
+                     GoRightIcon="@BitIconInfo.Bi("arrow-left-circle")">
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img1.jpg" />
+                <div class="text-title">Aurora</div>
+                <div class="text-description">This is Aurora and it's fantastic</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img2.jpg" />
+                <div class="text-title">Beautiful Mountain</div>
+                <div class="text-description">This is a Beautiful Mountain and it's gorgeous</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img3.jpg" />
+                <div class="text-title">Forest In The Valley</div>
+                <div class="text-description">This is a Forest In The Valley and it's beautiful</div>
+            </BitCarouselItem>
+            <BitCarouselItem>
+                <img class="image" src="_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img4.jpg" />
+                <div class="text-title">Road Among The Mountains</div>
+                <div class="text-description">This is a Road Among The Mountains and it's amazing</div>
+            </BitCarouselItem>
+        </BitCarousel>
+    </DemoExample>
+
+    <DemoExample Title="RTL" RazorCode="@example8RazorCode" Id="example8">
         <div>Use BitCarousel in right-to-left (RTL).</div>
         <br />
         <div>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs
index 2c1cb35331..a3c9508bea 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Carousel/BitCarouselDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Carousel;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Carousel;
 
 public partial class BitCarouselDemo
 {
@@ -44,16 +44,38 @@ public partial class BitCarouselDemo
         new()
         {
             Name = "GoLeftIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the go to left button using custom CSS classes for external icon libraries. Takes precedence over GoLeftIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GoLeftIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The custom icon name for the go to left button at the right side of the carousel."
+            Description = "Gets or sets the name of the icon for the go to left button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
             Name = "GoRightIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the go to right button using custom CSS classes for external icon libraries. Takes precedence over GoRightIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GoRightIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The custom icon name for the go to right button at the left side of the carousel."
+            Description = "Gets or sets the name of the icon for the go to right button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -187,7 +209,36 @@ public partial class BitCarouselDemo
                    Description = "Custom CSS classes/styles for the current dot element of the BitCarousel."
                }
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
     private readonly List<ComponentParameter> componentPublicMembers =
@@ -542,6 +593,63 @@ .item div {
 </div>";
 
     private readonly string example7RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<div>FontAwesome (circle-arrow icons):</div>
+<BitCarousel InfiniteScrolling
+             GoLeftIcon=""@BitIconInfo.Fa(""solid circle-arrow-right"")""
+             GoRightIcon=""@BitIconInfo.Fa(""solid circle-arrow-left"")"">
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img1.jpg"" />
+        <div class=""text-title"">Aurora</div>
+        <div class=""text-description"">This is Aurora and it's fantastic</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img2.jpg"" />
+        <div class=""text-title"">Beautiful Mountain</div>
+        <div class=""text-description"">This is a Beautiful Mountain and it's gorgeous</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img3.jpg"" />
+        <div class=""text-title"">Forest In The Valley</div>
+        <div class=""text-description"">This is a Forest In The Valley and it's beautiful</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img4.jpg"" />
+        <div class=""text-title"">Road Among The Mountains</div>
+        <div class=""text-description"">This is a Road Among The Mountains and it's amazing</div>
+    </BitCarouselItem>
+</BitCarousel>
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<div>Bootstrap Icons (arrow-left-circle / arrow-right-circle):</div>
+<BitCarousel InfiniteScrolling
+             GoLeftIcon=""@BitIconInfo.Bi(""arrow-right-circle"")""
+             GoRightIcon=""@BitIconInfo.Bi(""arrow-left-circle"")"">
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img1.jpg"" />
+        <div class=""text-title"">Aurora</div>
+        <div class=""text-description"">This is Aurora and it's fantastic</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img2.jpg"" />
+        <div class=""text-title"">Beautiful Mountain</div>
+        <div class=""text-description"">This is a Beautiful Mountain and it's gorgeous</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img3.jpg"" />
+        <div class=""text-title"">Forest In The Valley</div>
+        <div class=""text-description"">This is a Forest In The Valley and it's beautiful</div>
+    </BitCarouselItem>
+    <BitCarouselItem>
+        <img class=""image"" src=""_content/Bit.BlazorUI.Demo.Client.Core/images/carousel/img4.jpg"" />
+        <div class=""text-title"">Road Among The Mountains</div>
+        <div class=""text-description"">This is a Road Among The Mountains and it's amazing</div>
+    </BitCarouselItem>
+</BitCarousel>";
+
+    private readonly string example8RazorCode = @"
 <style>
     .item {
         text-align: center;

From 1e7327566f61c65b0b16df03d862dde2b99d2026 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Tue, 17 Feb 2026 21:41:46 +0330
Subject: [PATCH 13/66] feat(blazorui): add new Icon parameters to BitTimeline
 #12100 (#12101)

---
 .../Lists/Timeline/BitTimeline.razor          |  9 +-
 .../Lists/Timeline/BitTimeline.razor.cs       | 24 ++++++
 .../Lists/Timeline/BitTimelineItem.cs         | 17 +++-
 .../Timeline/BitTimelineNameSelectors.cs      |  5 ++
 .../Lists/Timeline/BitTimelineOption.cs       | 17 +++-
 .../Lists/Timeline/BitTimelineDemo.razor      |  2 +-
 .../Lists/Timeline/BitTimelineDemo.razor.cs   | 83 +++++++++++++++----
 .../Pages/Components/Lists/Timeline/Event.cs  |  4 +-
 .../Timeline/_BitTimelineCustomDemo.razor     | 35 +++++++-
 .../Timeline/_BitTimelineCustomDemo.razor.cs  | 43 ++++++++++
 .../_BitTimelineCustomDemo.razor.samples.cs   | 80 +++++++++++++++++-
 .../Lists/Timeline/_BitTimelineItemDemo.razor | 35 +++++++-
 .../Timeline/_BitTimelineItemDemo.razor.cs    | 44 +++++++++-
 .../_BitTimelineItemDemo.razor.samples.cs     | 68 ++++++++++++++-
 .../Timeline/_BitTimelineOptionDemo.razor     | 59 ++++++++++++-
 .../Timeline/_BitTimelineOptionDemo.razor.cs  | 46 +++++++++-
 16 files changed, 527 insertions(+), 44 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor
index c4bf36d4e4..4c9bdf90a5 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 @typeparam TItem
 
@@ -15,6 +15,7 @@
     {
         var item = _items[i];
 
+        var icon = GetIcon(item);
         var hideDot = GetHideDot(item);
         var iconName = GetIconName(item);
         var dotTemplate = GetDotTemplate(item);
@@ -22,6 +23,8 @@
         var isEnabled = IsEnabled && GetIsEnabled(item);
         var secondaryContent = GetSecondaryContent(item);
 
+        icon = BitIconInfo.From(icon, iconName);
+
         <div @onclick="() => HandleOnItemClick(item)"
              tabindex="@(isEnabled ? 0 : -1)"
              disabled="@(isEnabled is false)"
@@ -48,9 +51,9 @@
                     else
                     {
                         <div style="@Styles?.Dot" class="bit-tln-dot @Classes?.Dot">
-                            @if (iconName.HasValue())
+                            @if (icon is not null)
                             {
-                                <i style="@Styles?.Icon" class="bit-tln-ico bit-icon bit-icon--@iconName @Classes?.Icon" />
+                                <i style="@Styles?.Icon" class="bit-tln-ico @icon.GetCssClasses() @Classes?.Icon" />
                             }
                         </div>
                     }
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor.cs
index f099106d8d..ff759181b9 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimeline.razor.cs
@@ -265,6 +265,30 @@ private async Task HandleOnItemClick(TItem item)
         return item.GetValueFromProperty<string?>(NameSelectors.Class.Name);
     }
 
+    private BitIconInfo? GetIcon(TItem? item)
+    {
+        if (item is null) return null;
+
+        if (item is BitTimelineItem timelineItem)
+        {
+            return timelineItem.Icon;
+        }
+
+        if (item is BitTimelineOption timelineOption)
+        {
+            return timelineOption.Icon;
+        }
+
+        if (NameSelectors is null) return null;
+
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            return NameSelectors.Icon.Selector!(item);
+        }
+
+        return item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+    }
+
     private string? GetIconName(TItem? item)
     {
         if (item is null) return null;
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineItem.cs
index ba7f8157f0..25fa790638 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineItem.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitTimelineItem
 {
@@ -22,6 +22,21 @@ public class BitTimelineItem
     /// </summary>
     public bool HideDot { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon = BitIconInfo.Fa("solid house")
+    /// Custom CSS: Icon = BitIconInfo.Css("my-icon-class")
+    /// </example>
+    public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render in the timeline item.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineNameSelectors.cs
index 9df2aace6e..25daffe5b4 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineNameSelectors.cs
@@ -22,6 +22,11 @@ public class BitTimelineNameSelectors<TItem>
     /// </summary>
     public BitNameSelectorPair<TItem, bool> HideDot { get; set; } = new(nameof(BitTimelineItem.HideDot));
 
+    /// <summary>
+    /// Icon field name and selector of the custom input class.
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitTimelineItem.Icon));
+
     /// <summary>
     /// IconName field name and selector of the custom input class.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineOption.cs
index d051b6ffc3..34702f580b 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineOption.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Lists/Timeline/BitTimelineOption.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitTimelineOption : ComponentBase, IDisposable
 {
@@ -28,6 +28,21 @@ public partial class BitTimelineOption : ComponentBase, IDisposable
     /// </summary>
     [Parameter] public bool HideDot { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render in the timeline option.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor
index 2a238d202d..20e0a3b9db 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/timeline"
+@page "/components/timeline"
 @inherits AppComponentBase
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor.cs
index 7b7eccd7ab..7a7fbde031 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/BitTimelineDemo.razor.cs
@@ -140,6 +140,15 @@ public partial class BitTimelineDemo
                    Description = "Hides the item's dot.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to render in the item. Takes precedence over IconName.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -260,6 +269,15 @@ public partial class BitTimelineDemo
                    Description = "Hides the option's dot.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to render in the option. Takes precedence over IconName.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -379,6 +397,15 @@ public partial class BitTimelineDemo
                     LinkType = LinkType.Link,
                 },
                 new()
+                {
+                    Name = "Icon",
+                    Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                    DefaultValue = "new(nameof(BitTimelineItem.Icon))",
+                    Description = "Icon field name and selector of the custom input class.",
+                    Href = "#name-selector-pair",
+                    LinkType = LinkType.Link,
+                },
+                new()
                 {
                     Name = "IconName",
                     Type = "BitNameSelectorPair<TItem, string?>",
@@ -433,15 +460,6 @@ public partial class BitTimelineDemo
                     LinkType = LinkType.Link,
                 },
                 new()
-                {
-                    Name = "IsEnabled",
-                    Type = "BitNameSelectorPair<TItem, bool>",
-                    DefaultValue = "new(nameof(BitTimelineItem.IsEnabled))",
-                    Description = "IsEnabled field name and selector of the custom input class.",
-                    Href = "#name-selector-pair",
-                    LinkType = LinkType.Link,
-                },
-                new()
                 {
                     Name = "SecondaryContent",
                     Type = "BitNameSelectorPair<TItem, RenderFragment?>",
@@ -510,65 +528,94 @@ public partial class BitTimelineDemo
                    Name = "Root",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the root element of the BitButton."
+                   Description = "Custom CSS classes/styles for the root element of the BitTimeline."
                },
                new()
                {
                    Name = "Item",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the item of the BitButton."
+                   Description = "Custom CSS classes/styles for the item of the BitTimeline."
                },
                new()
                {
                    Name = "PrimaryContent",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the primary content of the BitButton."
+                   Description = "Custom CSS classes/styles for the primary content of the BitTimeline."
                },
                new()
                {
                    Name = "PrimaryText",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the primary text of the BitButton."
+                   Description = "Custom CSS classes/styles for the primary text of the BitTimeline."
                },
                new()
                {
                    Name = "SecondaryContent",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the secondary content of the BitButton."
+                   Description = "Custom CSS classes/styles for the secondary content of the BitTimeline."
                },
                new()
                {
                    Name = "SecondaryText",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the secondary text of the BitButton."
+                   Description = "Custom CSS classes/styles for the secondary text of the BitTimeline."
                },
                new()
                {
                    Name = "Divider",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the divider of the BitButton."
+                   Description = "Custom CSS classes/styles for the divider of the BitTimeline."
                },
                new()
                {
                    Name = "Dot",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the dot of the BitButton."
+                   Description = "Custom CSS classes/styles for the dot of the BitTimeline."
                },
                new()
                {
                    Name = "Icon",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the icon of the BitButton."
+                   Description = "Custom CSS classes/styles for the icon of the BitTimeline."
                }
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/Event.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/Event.cs
index 7f3fd337be..30ad774c81 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/Event.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/Event.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
 
 public class Event
 {
@@ -10,6 +10,8 @@ public class Event
 
     public string? FirstText { get; set; }
 
+    public BitIconInfo? ExternalIcon { get; set; }
+
     public string? Icon { get; set; }
 
     public bool Disabled { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor
index e1d599f874..35f2fb9c90 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <BitTimeline Items="basicCustoms" NameSelectors="nameSelectors" />
 </DemoExample>
 
@@ -154,7 +154,36 @@
     <BitTimeline Horizontal Size="BitSize.Large" Variant="BitVariant.Text" Items="iconCustoms" NameSelectors="nameSelectors" />
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+<DemoExample Title="External Icons" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+    <div>External icon libraries like FontAwesome and Bootstrap Icons can be used with the Icon parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div><b>FontAwesome Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal Items="externalIconCustoms1" NameSelectors="nameSelectors" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="externalIconCustoms2" NameSelectors="nameSelectors" Variant="BitVariant.Outline" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="externalIconCustoms3" NameSelectors="nameSelectors" Variant="BitVariant.Text" />
+
+    <br /><br /><br /><br />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+    <div><b>Bootstrap Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal Items="bootstrapIconCustoms1" NameSelectors="nameSelectors" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="bootstrapIconCustoms2" NameSelectors="nameSelectors" Variant="BitVariant.Outline" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="bootstrapIconCustoms3" NameSelectors="nameSelectors" Variant="BitVariant.Text" />
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br /><br />
     <div>Component's Style & Class:</div><br />
@@ -180,7 +209,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+<DemoExample Title="RTL" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
     <div>Use the BitTimeline component in right-to-left (RTL).</div>
     <br /><br /><br />
     <div>Vertical</div><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.cs
index 2900c8cb14..cf76e252c5 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.cs
@@ -13,6 +13,7 @@ public partial class _BitTimelineCustomDemo
         DotTemplate = { Selector = i => i.DotContent },
         PrimaryContent = { Selector = i => i.FirstContent },
         SecondaryContent = { Selector = i => i.SecondContent },
+        Icon = { Selector = i => i.ExternalIcon },
     };
 
     private List<Event> basicCustoms =
@@ -43,6 +44,48 @@ public partial class _BitTimelineCustomDemo
         new() { FirstText = "Custom 3" }
     ];
 
+    private List<Event> externalIconCustoms1 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = "fa-solid fa-plus" },
+        new() { FirstText = "Custom 2", ExternalIcon = "fa-solid fa-pen", SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = "fa-solid fa-trash" }
+    ];
+
+    private List<Event> externalIconCustoms2 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = BitIconInfo.Css("fa-solid fa-plus") },
+        new() { FirstText = "Custom 2", ExternalIcon = BitIconInfo.Css("fa-solid fa-pen"), SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = BitIconInfo.Css("fa-solid fa-trash") }
+    ];
+
+    private List<Event> externalIconCustoms3 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = BitIconInfo.Fa("solid plus") },
+        new() { FirstText = "Custom 2", ExternalIcon = BitIconInfo.Fa("solid pen"), SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = BitIconInfo.Fa("solid trash") }
+    ];
+
+    private List<Event> bootstrapIconCustoms1 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = "bi bi-plus-lg" },
+        new() { FirstText = "Custom 2", ExternalIcon = "bi bi-pencil", SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = "bi bi-trash" }
+    ];
+
+    private List<Event> bootstrapIconCustoms2 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = BitIconInfo.Css("bi bi-plus-lg") },
+        new() { FirstText = "Custom 2", ExternalIcon = BitIconInfo.Css("bi bi-pencil"), SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = BitIconInfo.Css("bi bi-trash") }
+    ];
+
+    private List<Event> bootstrapIconCustoms3 =
+    [
+        new() { FirstText = "Custom 1", ExternalIcon = BitIconInfo.Bi("plus-lg") },
+        new() { FirstText = "Custom 2", ExternalIcon = BitIconInfo.Bi("pencil"), SecondText = "Custom 2 Secondary" },
+        new() { FirstText = "Custom 3", ExternalIcon = BitIconInfo.Bi("trash") }
+    ];
+
     private List<Event> styleClassCustoms =
     [
         new() { FirstText = "Styled", Style = "color: dodgerblue;", Icon = BitIconName.Brush },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cs
index eb7c94639c..91fed69ec7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineCustomDemo.razor.samples.cs
@@ -334,6 +334,80 @@ public class Event
 ];";
 
     private readonly string example10RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTimeline Horizontal Items=""externalIconCustoms1"" NameSelectors=""nameSelectors"" />
+
+<BitTimeline Horizontal Items=""externalIconCustoms2"" NameSelectors=""nameSelectors"" Variant=""BitVariant.Outline"" />
+
+<BitTimeline Horizontal Items=""externalIconCustoms3"" NameSelectors=""nameSelectors"" Variant=""BitVariant.Text"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconCustoms1"" NameSelectors=""nameSelectors"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconCustoms2"" NameSelectors=""nameSelectors"" Variant=""BitVariant.Outline"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconCustoms3"" NameSelectors=""nameSelectors"" Variant=""BitVariant.Text"" />";
+    private readonly string example10CsharpCode = @"
+public class Event
+{
+    public string? FirstText { get; set; }
+    public string? SecondText { get; set; }
+    public BitIconInfo? ExternalIcon { get; set; }
+}
+
+BitTimelineNameSelectors<Event> nameSelectors = new()
+{
+    PrimaryText = { Selector = i => i.FirstText },
+    SecondaryText = { Selector = i => i.SecondText },
+    Icon = { Selector = i => i.ExternalIcon },
+};
+
+private List<Event> externalIconCustoms1 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = ""fa-solid fa-plus"" },
+    new() { FirstText = ""Custom 2"", ExternalIcon = ""fa-solid fa-pen"", SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = ""fa-solid fa-trash"" }
+];
+
+private List<Event> externalIconCustoms2 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = BitIconInfo.Css(""fa-solid fa-plus"") },
+    new() { FirstText = ""Custom 2"", ExternalIcon = BitIconInfo.Css(""fa-solid fa-pen""), SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = BitIconInfo.Css(""fa-solid fa-trash"") }
+];
+
+private List<Event> externalIconCustoms3 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = BitIconInfo.Fa(""solid plus"") },
+    new() { FirstText = ""Custom 2"", ExternalIcon = BitIconInfo.Fa(""solid pen""), SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = BitIconInfo.Fa(""solid trash"") }
+];
+
+private List<Event> bootstrapIconCustoms1 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = ""bi bi-plus-lg"" },
+    new() { FirstText = ""Custom 2"", ExternalIcon = ""bi bi-pencil"", SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = ""bi bi-trash"" }
+];
+
+private List<Event> bootstrapIconCustoms2 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = BitIconInfo.Css(""bi bi-plus-lg"") },
+    new() { FirstText = ""Custom 2"", ExternalIcon = BitIconInfo.Css(""bi bi-pencil""), SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = BitIconInfo.Css(""bi bi-trash"") }
+];
+
+private List<Event> bootstrapIconCustoms3 =
+[
+    new() { FirstText = ""Custom 1"", ExternalIcon = BitIconInfo.Bi(""plus-lg"") },
+    new() { FirstText = ""Custom 2"", ExternalIcon = BitIconInfo.Bi(""pencil""), SecondText = ""Custom 2 Secondary"" },
+    new() { FirstText = ""Custom 3"", ExternalIcon = BitIconInfo.Bi(""trash"") }
+];";
+
+    private readonly string example11RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -389,7 +463,7 @@ public class Event
                                 Icon = ""custom-icon"",
                                 Item = ""custom-item-text"",
                                 Divider = ""custom-divider"" })"" />";
-    private readonly string example10CsharpCode = @"
+    private readonly string example11CsharpCode = @"
 public class Event
 {
     public string? FirstText { get; set; }
@@ -428,10 +502,10 @@ public class Event
     new() { FirstText = ""Custom 3"", Icon = BitIconName.Delete }
 };";
 
-    private readonly string example11RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitTimeline Dir=""BitDir.Rtl"" Items=""basicRtlCustoms"" NameSelectors=""nameSelectors"" />
 <BitTimeline Horizontal Dir=""BitDir.Rtl"" Items=""basicRtlCustoms"" NameSelectors=""nameSelectors"" />";
-    private readonly string example11CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 public class Event
 {
     public string? FirstText { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor
index 1411d32ce9..914dde052a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <BitTimeline Items="basicItems" />
 </DemoExample>
 
@@ -154,7 +154,36 @@
     <BitTimeline Horizontal Size="BitSize.Large" Variant="BitVariant.Text" Items="iconItems" />
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+<DemoExample Title="External Icons" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+    <div>External icon libraries like FontAwesome and Bootstrap Icons can be used with the Icon parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div><b>FontAwesome Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal Items="externalIconItems1" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="externalIconItems2" Variant="BitVariant.Outline" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="externalIconItems3" Variant="BitVariant.Text" />
+
+    <br /><br /><br /><br />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+    <div><b>Bootstrap Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal Items="bootstrapIconItems1" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="bootstrapIconItems2" Variant="BitVariant.Outline" />
+    <br /><br /><br />
+    <BitTimeline Horizontal Items="bootstrapIconItems3" Variant="BitVariant.Text" />
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br /><br />
     <div>Component's Style & Class:</div><br />
@@ -180,7 +209,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+<DemoExample Title="RTL" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
     <div>Use the BitTimeline component in right-to-left (RTL).</div>
     <br /><br /><br />
     <div>Vertical</div><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.cs
index 71299a7d8d..b561107fd7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
 
 public partial class _BitTimelineItemDemo
 {
@@ -30,6 +30,48 @@ public partial class _BitTimelineItemDemo
         new() { PrimaryText = "Item 3" }
     ];
 
+    private List<BitTimelineItem> externalIconItems1 =
+    [
+        new() { PrimaryText = "Item 1", Icon = "fa-solid fa-plus" },
+        new() { PrimaryText = "Item 2", Icon = "fa-solid fa-pen", SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = "fa-solid fa-trash" }
+    ];
+
+    private List<BitTimelineItem> externalIconItems2 =
+    [
+        new() { PrimaryText = "Item 1", Icon = BitIconInfo.Css("fa-solid fa-plus") },
+        new() { PrimaryText = "Item 2", Icon = BitIconInfo.Css("fa-solid fa-pen"), SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = BitIconInfo.Css("fa-solid fa-trash") }
+    ];
+
+    private List<BitTimelineItem> externalIconItems3 =
+    [
+        new() { PrimaryText = "Item 1", Icon = BitIconInfo.Fa("solid plus") },
+        new() { PrimaryText = "Item 2", Icon = BitIconInfo.Fa("solid pen"), SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = BitIconInfo.Fa("solid trash") }
+    ];
+
+    private List<BitTimelineItem> bootstrapIconItems1 =
+    [
+        new() { PrimaryText = "Item 1", Icon = "bi bi-plus-lg" },
+        new() { PrimaryText = "Item 2", Icon = "bi bi-pencil", SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = "bi bi-trash" }
+    ];
+
+    private List<BitTimelineItem> bootstrapIconItems2 =
+    [
+        new() { PrimaryText = "Item 1", Icon = BitIconInfo.Css("bi bi-plus-lg") },
+        new() { PrimaryText = "Item 2", Icon = BitIconInfo.Css("bi bi-pencil"), SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = BitIconInfo.Css("bi bi-trash") }
+    ];
+
+    private List<BitTimelineItem> bootstrapIconItems3 =
+    [
+        new() { PrimaryText = "Item 1", Icon = BitIconInfo.Bi("plus-lg") },
+        new() { PrimaryText = "Item 2", Icon = BitIconInfo.Bi("pencil"), SecondaryText = "Item 2 Secondary" },
+        new() { PrimaryText = "Item 3", Icon = BitIconInfo.Bi("trash") }
+    ];
+
     private List<BitTimelineItem> styleClassItems =
     [
         new() { PrimaryText = "Styled", Style = "color: dodgerblue;", IconName = BitIconName.Brush },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cs
index 68056d69e1..989607879f 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineItemDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
 
 public partial class _BitTimelineItemDemo
 {
@@ -205,6 +205,66 @@ public partial class _BitTimelineItemDemo
 ];";
 
     private readonly string example10RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTimeline Horizontal Items=""externalIconItems1"" />
+
+<BitTimeline Horizontal Items=""externalIconItems2"" Variant=""BitVariant.Outline"" />
+
+<BitTimeline Horizontal Items=""externalIconItems3"" Variant=""BitVariant.Text"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconItems1"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconItems2"" Variant=""BitVariant.Outline"" />
+
+<BitTimeline Horizontal Items=""bootstrapIconItems3"" Variant=""BitVariant.Text"" />";
+    private readonly string example10CsharpCode = @"
+private List<BitTimelineItem> externalIconItems1 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = ""fa-solid fa-plus"" },
+    new() { PrimaryText = ""Item 2"", Icon = ""fa-solid fa-pen"", SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = ""fa-solid fa-trash"" }
+];
+
+private List<BitTimelineItem> externalIconItems2 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = BitIconInfo.Css(""fa-solid fa-plus"") },
+    new() { PrimaryText = ""Item 2"", Icon = BitIconInfo.Css(""fa-solid fa-pen""), SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = BitIconInfo.Css(""fa-solid fa-trash"") }
+];
+
+private List<BitTimelineItem> externalIconItems3 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = BitIconInfo.Fa(""solid plus"") },
+    new() { PrimaryText = ""Item 2"", Icon = BitIconInfo.Fa(""solid pen""), SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = BitIconInfo.Fa(""solid trash"") }
+];
+
+private List<BitTimelineItem> bootstrapIconItems1 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = ""bi bi-plus-lg"" },
+    new() { PrimaryText = ""Item 2"", Icon = ""bi bi-pencil"", SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = ""bi bi-trash"" }
+];
+
+private List<BitTimelineItem> bootstrapIconItems2 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = BitIconInfo.Css(""bi bi-plus-lg"") },
+    new() { PrimaryText = ""Item 2"", Icon = BitIconInfo.Css(""bi bi-pencil""), SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = BitIconInfo.Css(""bi bi-trash"") }
+];
+
+private List<BitTimelineItem> bootstrapIconItems3 =
+[
+    new() { PrimaryText = ""Item 1"", Icon = BitIconInfo.Bi(""plus-lg"") },
+    new() { PrimaryText = ""Item 2"", Icon = BitIconInfo.Bi(""pencil""), SecondaryText = ""Item 2 Secondary"" },
+    new() { PrimaryText = ""Item 3"", Icon = BitIconInfo.Bi(""trash"") }
+];";
+
+    private readonly string example11RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -258,7 +318,7 @@ public partial class _BitTimelineItemDemo
                                 Icon = ""custom-icon"",
                                 Item = ""custom-item-text"",
                                 Divider = ""custom-divider"" })"" />";
-    private readonly string example10CsharpCode = @"
+    private readonly string example11CsharpCode = @"
 private List<BitTimelineItem> basicItems =
 [
     new() { PrimaryText = ""Item 1"" },
@@ -279,10 +339,10 @@ public partial class _BitTimelineItemDemo
     new() { PrimaryText = ""Item 3"", IconName = BitIconName.Delete }
 ];";
 
-    private readonly string example11RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitTimeline Dir=""BitDir.Rtl"" Items=""basicRtlItems"" />
 <BitTimeline Horizontal Dir=""BitDir.Rtl"" Items=""basicRtlItems"" />";
-    private readonly string example11CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 private List<BitTimelineItem> basicRtlItems =
 [
     new() { PrimaryText = ""گزینه ۱"" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor
index 4297840faf..afcea3917c 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
     <BitTimeline TItem="BitTimelineOption">
         <BitTimelineOption PrimaryText="Option 1" />
         <BitTimelineOption PrimaryText="Option 2" SecondaryText="Option 2 Secondary" />
@@ -456,7 +456,60 @@
     </BitTimeline>
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example10RazorCode" Id="example10">
+<DemoExample Title="External Icons" RazorCode="@example10RazorCode" Id="example10">
+    <div>External icon libraries like FontAwesome and Bootstrap Icons can be used with the Icon parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div><b>FontAwesome Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@("fa-solid fa-plus")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@("fa-solid fa-pen")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@("fa-solid fa-trash")" />
+    </BitTimeline>
+    <br /><br /><br />
+    <BitTimeline Horizontal Variant="BitVariant.Outline" TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@BitIconInfo.Css("fa-solid fa-plus")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@BitIconInfo.Css("fa-solid fa-pen")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@BitIconInfo.Css("fa-solid fa-trash")" />
+    </BitTimeline>
+    <br /><br /><br />
+    <BitTimeline Horizontal Variant="BitVariant.Text" TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@BitIconInfo.Fa("solid plus")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@BitIconInfo.Fa("solid pen")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@BitIconInfo.Fa("solid trash")" />
+    </BitTimeline>
+
+    <br /><br /><br /><br />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+    <div><b>Bootstrap Icons:</b></div>
+    <br />
+    <BitTimeline Horizontal TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@("bi bi-plus-lg")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@("bi bi-pencil")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@("bi bi-trash")" />
+    </BitTimeline>
+    <br /><br /><br />
+    <BitTimeline Horizontal Variant="BitVariant.Outline" TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@BitIconInfo.Css("bi bi-plus-lg")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@BitIconInfo.Css("bi bi-pencil")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@BitIconInfo.Css("bi bi-trash")" />
+    </BitTimeline>
+    <br /><br /><br />
+    <BitTimeline Horizontal Variant="BitVariant.Text" TItem="BitTimelineOption">
+        <BitTimelineOption PrimaryText="Option 1" Icon="@BitIconInfo.Bi("plus-lg")" />
+        <BitTimelineOption PrimaryText="Option 2" Icon="@BitIconInfo.Bi("pencil")" SecondaryText="Option 2 Secondary" />
+        <BitTimelineOption PrimaryText="Option 3" Icon="@BitIconInfo.Bi("trash")" />
+    </BitTimeline>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br /><br />
     <div>Component's style & class:</div><br />
@@ -502,7 +555,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example11RazorCode" Id="example11">
+<DemoExample Title="RTL" RazorCode="@example12RazorCode" Id="example12">
     <div>Use the BitTimeline component in right-to-left (RTL).</div>
     <br /><br /><br />
     <div>Vertical</div><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cs
index cda9ec5bd8..c80208a8e0 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Lists/Timeline/_BitTimelineOptionDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Lists.Timeline;
 
 public partial class _BitTimelineOptionDemo
 {
@@ -431,6 +431,48 @@ public partial class _BitTimelineOptionDemo
 </BitTimeline>";
 
     private readonly string example10RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTimeline Horizontal TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@(""fa-solid fa-plus"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@(""fa-solid fa-pen"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@(""fa-solid fa-trash"")"" />
+</BitTimeline>
+
+<BitTimeline Horizontal Variant=""BitVariant.Outline"" TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@BitIconInfo.Css(""fa-solid fa-plus"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@BitIconInfo.Css(""fa-solid fa-pen"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@BitIconInfo.Css(""fa-solid fa-trash"")"" />
+</BitTimeline>
+
+<BitTimeline Horizontal Variant=""BitVariant.Text"" TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@BitIconInfo.Fa(""solid plus"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@BitIconInfo.Fa(""solid pen"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@BitIconInfo.Fa(""solid trash"")"" />
+</BitTimeline>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTimeline Horizontal TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@(""bi bi-plus-lg"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@(""bi bi-pencil"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@(""bi bi-trash"")"" />
+</BitTimeline>
+
+<BitTimeline Horizontal Variant=""BitVariant.Outline"" TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@BitIconInfo.Css(""bi bi-plus-lg"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@BitIconInfo.Css(""bi bi-pencil"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@BitIconInfo.Css(""bi bi-trash"")"" />
+</BitTimeline>
+
+<BitTimeline Horizontal Variant=""BitVariant.Text"" TItem=""BitTimelineOption"">
+    <BitTimelineOption PrimaryText=""Option 1"" Icon=""@BitIconInfo.Bi(""plus-lg"")"" />
+    <BitTimelineOption PrimaryText=""Option 2"" Icon=""@BitIconInfo.Bi(""pencil"")"" SecondaryText=""Option 2 Secondary"" />
+    <BitTimelineOption PrimaryText=""Option 3"" Icon=""@BitIconInfo.Bi(""trash"")"" />
+</BitTimeline>";
+
+    private readonly string example11RazorCode = @"
 <style>
     .custom-class {
         color: dodgerblue;
@@ -507,7 +549,7 @@ public partial class _BitTimelineOptionDemo
         <BitTimelineOption PrimaryText=""Option 3"" IconName=""@BitIconName.Delete"" />
     </BitTimeline>";
 
-    private readonly string example11RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitTimeline Dir=""BitDir.Rtl"" TItem=""BitTimelineOption"">
     <BitTimelineOption PrimaryText=""گزینه ۱"" />
     <BitTimelineOption PrimaryText=""گزینه ۲"" SecondaryText=""گزینه ۲ ثانویه"" />

From f626d1ac9b03ee49e94f1be3c1cd8a64930cac3d Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Wed, 18 Feb 2026 15:43:23 +0330
Subject: [PATCH 14/66] feat(blazorui): add new Icon parameters to
 BitBreadcrumb #12102 (#12103)

---
 .../Navs/Breadcrumb/BitBreadcrumb.razor       | 44 +++++------
 .../Navs/Breadcrumb/BitBreadcrumb.razor.cs    | 37 +++++++--
 .../Navs/Breadcrumb/BitBreadcrumbItem.cs      |  5 ++
 .../Breadcrumb/BitBreadcrumbNameSelectors.cs  |  5 ++
 .../Navs/Breadcrumb/BitBreadcrumbOption.cs    |  5 ++
 .../Breadcrumb/BitBreadcrumbDemo.razor.cs     | 75 ++++++++++++++++++-
 .../Components/Navs/Breadcrumb/PageInfo.cs    |  4 +-
 .../Breadcrumb/_BitBreadcrumbCustomDemo.razor | 41 +++++++++-
 .../_BitBreadcrumbCustomDemo.razor.cs         | 37 ++++++++-
 .../_BitBreadcrumbCustomDemo.razor.samples.cs | 73 ++++++++++++++++++
 .../Breadcrumb/_BitBreadcrumbItemDemo.razor   | 48 +++++++++++-
 .../_BitBreadcrumbItemDemo.razor.cs           | 34 ++++++++-
 .../_BitBreadcrumbItemDemo.razor.samples.cs   | 52 +++++++++++++
 .../Breadcrumb/_BitBreadcrumbOptionDemo.razor | 56 +++++++++++++-
 .../_BitBreadcrumbOptionDemo.razor.samples.cs | 39 ++++++++++
 15 files changed, 520 insertions(+), 35 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor
index cb7df53ec3..a9b437ed90 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 @typeparam TItem
 
@@ -35,7 +35,8 @@
                         }
                         else
                         {
-                            <i style="@Styles?.OverflowButtonIcon" class="bit-icon bit-icon--@(OverflowIconName ?? "More") @Classes?.OverflowButtonIcon" />
+                            var overflowIcon = BitIconInfo.From(OverflowIcon, OverflowIconName ?? "More");
+                            <i style="@Styles?.OverflowButtonIcon" class="@overflowIcon?.GetCssClasses() @Classes?.OverflowButtonIcon" />
                         }
                     </button>
                 }
@@ -58,10 +59,10 @@
                             }
                             else
                             {
-                                var iconName = GetIconName(item);
-                                @if (iconName.HasValue())
+                                var icon = GetIcon(item);
+                                @if (icon is not null)
                                 {
-                                    <i style="@Styles?.ItemIcon" class="bit-icon bit-icon--@iconName @Classes?.ItemIcon" />
+                                    <i style="@Styles?.ItemIcon" class="@icon.GetCssClasses() @Classes?.ItemIcon" />
                                 }
                                 <span style="@Styles?.ItemText" class="@Classes?.ItemText">@GetItemText(item)</span>
                             }
@@ -84,10 +85,10 @@
                             }
                             else
                             {
-                                var iconName = GetIconName(item);
-                                @if (iconName.HasValue())
+                                var icon = GetIcon(item);
+                                @if (icon is not null)
                                 {
-                                    <i style="@Styles?.ItemIcon" class="bit-icon bit-icon--@iconName @Classes?.ItemIcon" />
+                                    <i style="@Styles?.ItemIcon" class="@icon.GetCssClasses() @Classes?.ItemIcon" />
                                 }
                                 <span style="@Styles?.ItemText" class="@Classes?.ItemText">@GetItemText(item)</span>
                             }
@@ -108,10 +109,10 @@
                             }
                             else
                             {
-                                var iconName = GetIconName(item);
-                                @if (iconName.HasValue())
+                                var icon = GetIcon(item);
+                                @if (icon is not null)
                                 {
-                                    <i style="@Styles?.ItemIcon" class="bit-icon bit-icon--@iconName @Classes?.ItemIcon" />
+                                    <i style="@Styles?.ItemIcon" class="@icon.GetCssClasses() @Classes?.ItemIcon" />
                                 }
                                 <span style="@Styles?.ItemText" class="@Classes?.ItemText">@GetItemText(item)</span>
                             }
@@ -129,8 +130,9 @@
                     }
                     else
                     {
+                        var dividerIcon = BitIconInfo.From(DividerIcon, DividerIconName ?? "ChevronRight bit-brc-trd");
                         <i style="@Styles?.DividerIcon"
-                           class="bit-brc-div bit-icon bit-icon--@(DividerIconName ?? "ChevronRight bit-brc-trd") @Classes?.DividerIcon" />
+                           class="bit-brc-div @dividerIcon?.GetCssClasses() @Classes?.DividerIcon" />
                     }
                 </li>
             }
@@ -163,10 +165,10 @@
                             }
                             else
                             {
-                                var iconName = GetIconName(item);
-                                @if (iconName.HasValue())
+                                var icon = GetIcon(item);
+                                @if (icon is not null)
                                 {
-                                    <i style="@Styles?.OverflowItemIcon" class="bit-icon bit-icon--@iconName @Classes?.OverflowItemIcon" />
+                                    <i style="@Styles?.OverflowItemIcon" class="@icon.GetCssClasses() @Classes?.OverflowItemIcon" />
                                 }
                                 <span style="@Styles?.OverflowItemText" class="@Classes?.OverflowItemText">@GetItemText(item)</span>
                             }
@@ -189,10 +191,10 @@
                             }
                             else
                             {
-                                var iconName = GetIconName(item);
-                                @if (iconName.HasValue())
+                                var icon = GetIcon(item);
+                                @if (icon is not null)
                                 {
-                                    <i style="@Styles?.OverflowItemIcon" class="bit-icon bit-icon--@iconName @Classes?.OverflowItemIcon" />
+                                    <i style="@Styles?.OverflowItemIcon" class="@icon.GetCssClasses() @Classes?.OverflowItemIcon" />
                                 }
                                 <span style="@Styles?.OverflowItemText" class="@Classes?.OverflowItemText">@GetItemText(item)</span>
                             }
@@ -213,10 +215,10 @@
                               }
                               else
                               {
-                                  var iconName = GetIconName(item);
-                                  @if (iconName.HasValue())
+                                  var icon = GetIcon(item);
+                                  @if (icon is not null)
                                   {
-                                      <i style="@Styles?.OverflowItemIcon" class="bit-icon bit-icon--@iconName @Classes?.OverflowItemIcon" />
+                                      <i style="@Styles?.OverflowItemIcon" class="@icon.GetCssClasses() @Classes?.OverflowItemIcon" />
                                   }
                                   <span style="@Styles?.OverflowItemText" class="@Classes?.OverflowItemText">@GetItemText(item)</span>
                               }
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs
index 005c033b18..813ebfa115 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// Breadcrumbs should be used as a navigational aid in your app or site. They indicate the current page’s location within a hierarchy and help the user understand where they are in relation to the rest of that hierarchy.
@@ -34,6 +34,11 @@ public partial class BitBreadcrumb<TItem> : BitComponentBase where TItem : class
     /// </summary>
     [Parameter] public BitBreadcrumbClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// Render a custom divider icon in place of the default chevron >
+    /// </summary>
+    [Parameter] public BitIconInfo? DividerIcon { get; set; }
+
     /// <summary>
     /// Render a custom divider in place of the default chevron >
     /// </summary>
@@ -85,6 +90,11 @@ public partial class BitBreadcrumb<TItem> : BitComponentBase where TItem : class
     /// </summary>
     [Parameter] public uint OverflowIndex { get; set; }
 
+    /// <summary>
+    /// Render a custom overflow icon in place of the default icon.
+    /// </summary>
+    [Parameter] public BitIconInfo? OverflowIcon { get; set; }
+
     /// <summary>
     /// Render a custom overflow icon in place of the default icon.
     /// </summary>
@@ -453,26 +463,41 @@ private string GetStyles(TItem item, bool isOverflowItem)
         return item.GetValueFromProperty<string?>(NameSelectors.Text.Name);
     }
 
-    private string? GetIconName(TItem item)
+    private BitIconInfo? GetIcon(TItem item)
     {
         if (item is BitBreadcrumbItem breadcrumbItem)
         {
-            return breadcrumbItem.IconName;
+            return BitIconInfo.From(breadcrumbItem.Icon, breadcrumbItem.IconName);
         }
 
         if (item is BitBreadcrumbOption bitBreadcrumbOption)
         {
-            return bitBreadcrumbOption.IconName;
+            return BitIconInfo.From(bitBreadcrumbOption.Icon, bitBreadcrumbOption.IconName);
         }
 
         if (NameSelectors is null) return null;
 
+        BitIconInfo? icon = null;
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            icon = NameSelectors.Icon.Selector!(item);
+        }
+        else
+        {
+            icon = item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+        }
+
+        string? iconName = null;
         if (NameSelectors.IconName.Selector is not null)
         {
-            return NameSelectors.IconName.Selector!(item);
+            iconName = NameSelectors.IconName.Selector!(item);
+        }
+        else
+        {
+            iconName = item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
         }
 
-        return item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
+        return BitIconInfo.From(icon, iconName);
     }
 
     private bool GetReversedIcon(TItem item)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbItem.cs
index d4856e8b51..9e66ab98f8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbItem.cs
@@ -13,6 +13,11 @@ public class BitBreadcrumbItem
     /// </summary>
     public string? Href { get; set; }
 
+    /// <summary>
+    /// Icon to render next to the item text.
+    /// </summary>
+    public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render next to the item text.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbNameSelectors.cs
index 5c64263c6b..7c2b27a65f 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbNameSelectors.cs
@@ -12,6 +12,11 @@ public class BitBreadcrumbNameSelectors<TItem> where TItem : class
     /// </summary>
     public BitNameSelectorPair<TItem, string?> Href { get; set; } = new(nameof(BitBreadcrumbItem.Href));
 
+    /// <summary>
+    /// The Icon field name and selector of the custom input class.
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitBreadcrumbItem.Icon));
+
     /// <summary>
     /// The IconName field name and selector of the custom input class.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbOption.cs
index 366954ca95..0624b25992 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbOption.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumbOption.cs
@@ -21,6 +21,11 @@ public partial class BitBreadcrumbOption : ComponentBase, IDisposable
     /// </summary>
     [Parameter] public string? Href { get; set; }
 
+    /// <summary>
+    /// Icon to render next to the item text.
+    /// </summary>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render next to the item text.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/BitBreadcrumbDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/BitBreadcrumbDemo.razor.cs
index 13243a4504..f2553e7de8 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/BitBreadcrumbDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/BitBreadcrumbDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
 
 public partial class BitBreadcrumbDemo
 {
@@ -21,6 +21,15 @@ public partial class BitBreadcrumbDemo
             Href = "#class-styles",
         },
         new()
+        {
+            Name = "DividerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Render a custom divider icon in place of the default chevron.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "DividerIconName",
             Type = "string?",
@@ -94,6 +103,15 @@ public partial class BitBreadcrumbDemo
             Description = "Optional index where overflow items will be collapsed."
         },
         new()
+        {
+            Name = "OverflowIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Render a custom overflow icon in place of the default icon.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "OverflowIconName",
             Type = "string",
@@ -171,6 +189,14 @@ public partial class BitBreadcrumbDemo
                    Description = "Style attribute for breadcrumb item.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   Description = "Icon to render next to the item text.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -252,6 +278,14 @@ public partial class BitBreadcrumbDemo
                    Description = "Style attribute for breadcrumb option.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   Description = "Icon to render next to the item text.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -489,6 +523,15 @@ public partial class BitBreadcrumbDemo
                    Href = "#name-selector-pair"
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                   DefaultValue = "new(nameof(BitBreadcrumbItem.Icon))",
+                   Description = "The Icon field name and selector of the custom input class.",
+                   LinkType = LinkType.Link,
+                   Href = "#name-selector-pair"
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "BitNameSelectorPair<TItem, string?>",
@@ -570,5 +613,35 @@ public partial class BitBreadcrumbDemo
                }
             ]
         },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Description = "Represents icon information for rendering icons. Supports built-in Fluent UI icons and external icon libraries (FontAwesome, Bootstrap Icons, etc.). Use BitIconInfo.Css(\"fa-solid fa-star\"), BitIconInfo.Fa(\"solid star\"), or BitIconInfo.Bi(\"star-fill\") for external icons.",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon. For external icons, this can be the full CSS class name if BaseClass and Prefix are empty."
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+                },
+            ]
+        },
     ];
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/PageInfo.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/PageInfo.cs
index 7c9be354d3..2a0adc3046 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/PageInfo.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/PageInfo.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
 
 public class PageInfo
 {
@@ -12,6 +12,8 @@ public class PageInfo
 
     public string? Icon { get; set; }
 
+    public BitIconInfo? IconInfo { get; set; }
+
     public bool IsCurrent { get; set; }
 
     public bool IsEnabled { get; set; } = true;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor
index 4f4fa2b24e..2204f4b31d 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="example-box">
         <div>
             <div>Basic</div>
@@ -175,6 +175,45 @@
     </div>
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
+    <div>External icon libraries like FontAwesome can be used with the Icon parameter.</div>
+    <br /><br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <div class="example-box">
+        <div>
+            <div>Implicit string conversion (auto-detects external icons)</div>
+            <BitBreadcrumb Items="CustomBreadcrumbItemsWithExternalIcon1"
+                           NameSelectors="nameSelectors"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+        <br />
+        <div>
+            <div>BitIconInfo.Css (uses CSS classes directly)</div>
+            <BitBreadcrumb Items="CustomBreadcrumbItemsWithExternalIcon2"
+                           NameSelectors="nameSelectors"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+        <br />
+        <div>
+            <div>BitIconInfo.Fa (FontAwesome helper)</div>
+            <BitBreadcrumb Items="CustomBreadcrumbItemsWithExternalIcon3"
+                           NameSelectors="nameSelectors"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+        <br />
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        <div>
+            <div>BitIconInfo.Bi (Bootstrap Icons helper)</div>
+            <BitBreadcrumb Items="CustomBreadcrumbItemsWithExternalIcon4"
+                           NameSelectors="nameSelectors"
+                           MaxDisplayedItems="3" OverflowIndex="2" />
+        </div>
+    </div>
+</DemoExample>
+
 <DemoExample Title="Class & Style" RazorCode="@example7RazorCode" CsharpCode="@example7CsharpCode" Id="example7">
     <div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
     <br /><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.cs
index 850b35253e..4fabc5e078 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
 
 public partial class _BitBreadcrumbCustomDemo
 {
@@ -74,6 +74,38 @@ public partial class _BitBreadcrumbCustomDemo
         new() { Name = "پوشه ششم" },
     ];
 
+    private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon1 =
+    [
+        new() { Name = "Home", IconInfo = "fa-solid fa-house" },
+        new() { Name = "Products", IconInfo = "fa-solid fa-box" },
+        new() { Name = "Electronics", IconInfo = "fa-solid fa-microchip" },
+        new() { Name = "Laptops", IconInfo = "fa-solid fa-laptop", IsCurrent = true }
+    ];
+
+    private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon2 =
+    [
+        new() { Name = "Home", IconInfo = BitIconInfo.Css("fa-solid fa-house") },
+        new() { Name = "Products", IconInfo = BitIconInfo.Css("fa-solid fa-box") },
+        new() { Name = "Electronics", IconInfo = BitIconInfo.Css("fa-solid fa-microchip") },
+        new() { Name = "Laptops", IconInfo = BitIconInfo.Css("fa-solid fa-laptop"), IsCurrent = true }
+    ];
+
+    private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon3 =
+    [
+        new() { Name = "Home", IconInfo = BitIconInfo.Fa("solid house") },
+        new() { Name = "Products", IconInfo = BitIconInfo.Fa("solid box") },
+        new() { Name = "Electronics", IconInfo = BitIconInfo.Fa("solid microchip") },
+        new() { Name = "Laptops", IconInfo = BitIconInfo.Fa("solid laptop"), IsCurrent = true }
+    ];
+
+    private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon4 =
+    [
+        new() { Name = "Home", IconInfo = BitIconInfo.Bi("house-fill") },
+        new() { Name = "Products", IconInfo = BitIconInfo.Bi("box-seam-fill") },
+        new() { Name = "Electronics", IconInfo = BitIconInfo.Bi("cpu-fill") },
+        new() { Name = "Laptops", IconInfo = BitIconInfo.Bi("laptop-fill"), IsCurrent = true }
+    ];
+
     private BitBreadcrumbNameSelectors<PageInfo> nameSelectors = new()
     {
         Text = { Selector = c => c.Name },
@@ -83,7 +115,8 @@ public partial class _BitBreadcrumbCustomDemo
         Style = { Selector = c => c.HtmlStyle },
         IconName = { Selector = c => c.Icon },
         Template = { Name = nameof(PageInfo.Fragment) },
-        OverflowTemplate = { Name = nameof(PageInfo.OverflowFragment) }
+        OverflowTemplate = { Name = nameof(PageInfo.OverflowFragment) },
+        Icon = { Selector = c => c.IconInfo },
     };
 
     private void HandleOnCustomClick(PageInfo model)
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.samples.cs
index de61847a32..974264b9c5 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbCustomDemo.razor.samples.cs
@@ -385,6 +385,79 @@ private void RemoveCustomItem()
     }
 }";
 
+    private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitBreadcrumb Items=""CustomBreadcrumbItemsWithExternalIcon1""
+               NameSelectors=""externalIconNameSelectors""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<BitBreadcrumb Items=""CustomBreadcrumbItemsWithExternalIcon2""
+               NameSelectors=""externalIconNameSelectors""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<BitBreadcrumb Items=""CustomBreadcrumbItemsWithExternalIcon3""
+               NameSelectors=""externalIconNameSelectors""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitBreadcrumb Items=""CustomBreadcrumbItemsWithExternalIcon4""
+               NameSelectors=""externalIconNameSelectors""
+               MaxDisplayedItems=""3"" OverflowIndex=""2"" />";
+    private readonly string example9CsharpCode = @"
+public class PageInfo
+{
+    public string? Name { get; set; }
+    public string? Address { get; set; }
+    public BitIconInfo? IconInfo { get; set; }
+    public bool IsCurrent { get; set; }
+    public bool IsEnabled { get; set; } = true;
+}
+
+private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon1 =
+[
+    new() { Name = ""Home"", IconInfo = ""fa-solid fa-house"" },
+    new() { Name = ""Products"", IconInfo = ""fa-solid fa-box"" },
+    new() { Name = ""Electronics"", IconInfo = ""fa-solid fa-microchip"" },
+    new() { Name = ""Laptops"", IconInfo = ""fa-solid fa-laptop"", IsCurrent = true }
+];
+
+private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon2 =
+[
+    new() { Name = ""Home"", IconInfo = BitIconInfo.Css(""fa-solid fa-house"") },
+    new() { Name = ""Products"", IconInfo = BitIconInfo.Css(""fa-solid fa-box"") },
+    new() { Name = ""Electronics"", IconInfo = BitIconInfo.Css(""fa-solid fa-microchip"") },
+    new() { Name = ""Laptops"", IconInfo = BitIconInfo.Css(""fa-solid fa-laptop""), IsCurrent = true }
+];
+
+private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon3 =
+[
+    new() { Name = ""Home"", IconInfo = BitIconInfo.Fa(""solid house"") },
+    new() { Name = ""Products"", IconInfo = BitIconInfo.Fa(""solid box"") },
+    new() { Name = ""Electronics"", IconInfo = BitIconInfo.Fa(""solid microchip"") },
+    new() { Name = ""Laptops"", IconInfo = BitIconInfo.Fa(""solid laptop""), IsCurrent = true }
+];
+
+private readonly List<PageInfo> CustomBreadcrumbItemsWithExternalIcon4 =
+[
+    new() { Name = ""Home"", IconInfo = BitIconInfo.Bi(""house-fill"") },
+    new() { Name = ""Products"", IconInfo = BitIconInfo.Bi(""box-seam-fill"") },
+    new() { Name = ""Electronics"", IconInfo = BitIconInfo.Bi(""cpu-fill"") },
+    new() { Name = ""Laptops"", IconInfo = BitIconInfo.Bi(""laptop-fill""), IsCurrent = true }
+];
+
+private BitBreadcrumbNameSelectors<PageInfo> externalIconNameSelectors = new()
+{
+    Text = { Selector = c => c.Name },
+    Href = { Selector = c => c.Address },
+    IsSelected = { Selector = c => c.IsCurrent },
+    Icon = { Selector = c => c.IconInfo },
+};";
+
     private readonly string example7RazorCode = @"
 <style>
     .custom-class {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor
index 3350284bfb..776216f839 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="example-box">
         <div>
             <div>Basic</div>
@@ -149,6 +149,52 @@
     </div>
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
+    <div>External icon libraries like FontAwesome can be used with the Icon parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div class="example-box">
+        <div>
+            <div>Implicit string conversion (auto-detects external icons)</div>
+            <BitBreadcrumb Items="BreadcrumbItemsWithExternalIcon1"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+
+        <br />
+
+        <div>
+            <div>BitIconInfo.Css (uses CSS classes directly)</div>
+            <BitBreadcrumb Items="BreadcrumbItemsWithExternalIcon2"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+
+        <br />
+
+        <div>
+            <div>BitIconInfo.Fa (FontAwesome helper)</div>
+            <BitBreadcrumb Items="BreadcrumbItemsWithExternalIcon3"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })" />
+        </div>
+
+        <br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>
+            <div>BitIconInfo.Bi (Bootstrap Icons helper)</div>
+            <BitBreadcrumb Items="BreadcrumbItemsWithExternalIcon4"
+                           MaxDisplayedItems="3" OverflowIndex="2" />
+        </div>
+    </div>
+</DemoExample>
+
 <DemoExample Title="Class & Style" RazorCode="@example7RazorCode" CsharpCode="@example7CsharpCode" Id="example7">
     <div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
     <br /><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.cs
index 0413f86f7d..75047fd6d7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Breadcrumb;
 
 public partial class _BitBreadcrumbItemDemo
 {
@@ -65,6 +65,38 @@ public partial class _BitBreadcrumbItemDemo
         new() { Text = "Item 4", IsSelected = true }
     ];
 
+    private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon1 =
+    [
+        new() { Text = "Home", Icon = "fa-solid fa-house" },
+        new() { Text = "Products", Icon = "fa-solid fa-box" },
+        new() { Text = "Electronics", Icon = "fa-solid fa-microchip" },
+        new() { Text = "Laptops", Icon = "fa-solid fa-laptop", IsSelected = true }
+    ];
+
+    private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon2 =
+    [
+        new() { Text = "Home", Icon = BitIconInfo.Css("fa-solid fa-house") },
+        new() { Text = "Products", Icon = BitIconInfo.Css("fa-solid fa-box") },
+        new() { Text = "Electronics", Icon = BitIconInfo.Css("fa-solid fa-microchip") },
+        new() { Text = "Laptops", Icon = BitIconInfo.Css("fa-solid fa-laptop"), IsSelected = true }
+    ];
+
+    private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon3 =
+    [
+        new() { Text = "Home", Icon = BitIconInfo.Fa("solid house") },
+        new() { Text = "Products", Icon = BitIconInfo.Fa("solid box") },
+        new() { Text = "Electronics", Icon = BitIconInfo.Fa("solid microchip") },
+        new() { Text = "Laptops", Icon = BitIconInfo.Fa("solid laptop"), IsSelected = true }
+    ];
+
+    private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon4 =
+    [
+        new() { Text = "Home", Icon = BitIconInfo.Bi("house-fill") },
+        new() { Text = "Products", Icon = BitIconInfo.Bi("box-seam-fill") },
+        new() { Text = "Electronics", Icon = BitIconInfo.Bi("cpu-fill") },
+        new() { Text = "Laptops", Icon = BitIconInfo.Bi("laptop-fill"), IsSelected = true }
+    ];
+
     private readonly List<BitBreadcrumbItem> RtlBreadcrumbItems =
     [
         new() { Text = "پوشه اول" },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.samples.cs
index e265ef43ec..3f933c3f93 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbItemDemo.razor.samples.cs
@@ -207,6 +207,58 @@ private void RemoveCustomItem()
     }
 }";
 
+    private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitBreadcrumb Items=""BreadcrumbItemsWithExternalIcon1""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<BitBreadcrumb Items=""BreadcrumbItemsWithExternalIcon2""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<BitBreadcrumb Items=""BreadcrumbItemsWithExternalIcon3""
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"" />
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitBreadcrumb Items=""BreadcrumbItemsWithExternalIcon4""
+               MaxDisplayedItems=""3"" OverflowIndex=""2"" />";
+    private readonly string example9CsharpCode = @"
+private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon1 =
+[
+    new() { Text = ""Home"", Icon = ""fa-solid fa-house"" },
+    new() { Text = ""Products"", Icon = ""fa-solid fa-box"" },
+    new() { Text = ""Electronics"", Icon = ""fa-solid fa-microchip"" },
+    new() { Text = ""Laptops"", Icon = ""fa-solid fa-laptop"", IsSelected = true }
+];
+
+private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon2 =
+[
+    new() { Text = ""Home"", Icon = BitIconInfo.Css(""fa-solid fa-house"") },
+    new() { Text = ""Products"", Icon = BitIconInfo.Css(""fa-solid fa-box"") },
+    new() { Text = ""Electronics"", Icon = BitIconInfo.Css(""fa-solid fa-microchip"") },
+    new() { Text = ""Laptops"", Icon = BitIconInfo.Css(""fa-solid fa-laptop""), IsSelected = true }
+];
+
+private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon3 =
+[
+    new() { Text = ""Home"", Icon = BitIconInfo.Fa(""solid house"") },
+    new() { Text = ""Products"", Icon = BitIconInfo.Fa(""solid box"") },
+    new() { Text = ""Electronics"", Icon = BitIconInfo.Fa(""solid microchip"") },
+    new() { Text = ""Laptops"", Icon = BitIconInfo.Fa(""solid laptop""), IsSelected = true }
+];
+
+private readonly List<BitBreadcrumbItem> BreadcrumbItemsWithExternalIcon4 =
+[
+    new() { Text = ""Home"", Icon = BitIconInfo.Bi(""house-fill"") },
+    new() { Text = ""Products"", Icon = BitIconInfo.Bi(""box-seam-fill"") },
+    new() { Text = ""Electronics"", Icon = BitIconInfo.Bi(""cpu-fill"") },
+    new() { Text = ""Laptops"", Icon = BitIconInfo.Bi(""laptop-fill""), IsSelected = true }
+];";
+
     private readonly string example7RazorCode = @"
 <style>
     .custom-class {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor
index 8868926342..15aaa863bc 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
     <div class="example-box">
         <div>
             <div>Basic</div>
@@ -233,6 +233,60 @@
     </div>
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example9RazorCode" Id="example9">
+    <div>External icon libraries like FontAwesome can be used with the Icon parameter.</div>
+    <br /><br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <div class="example-box">
+        <div>
+            <div>Implicit string conversion (auto-detects external icons)</div>
+            <BitBreadcrumb TItem="BitBreadcrumbOption"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })">
+                <BitBreadcrumbOption Text="Home" Icon="@("fa-solid fa-house")" />
+                <BitBreadcrumbOption Text="Products" Icon="@("fa-solid fa-box")" />
+                <BitBreadcrumbOption Text="Electronics" Icon="@("fa-solid fa-microchip")" />
+                <BitBreadcrumbOption Text="Laptops" Icon="@("fa-solid fa-laptop")" IsSelected />
+            </BitBreadcrumb>
+        </div>
+        <br />
+        <div>
+            <div>BitIconInfo.Css (uses CSS classes directly)</div>
+            <BitBreadcrumb TItem="BitBreadcrumbOption"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })">
+                <BitBreadcrumbOption Text="Home" Icon="@BitIconInfo.Css("fa-solid fa-house")" />
+                <BitBreadcrumbOption Text="Products" Icon="@BitIconInfo.Css("fa-solid fa-box")" />
+                <BitBreadcrumbOption Text="Electronics" Icon="@BitIconInfo.Css("fa-solid fa-microchip")" />
+                <BitBreadcrumbOption Text="Laptops" Icon="@BitIconInfo.Css("fa-solid fa-laptop")" IsSelected />
+            </BitBreadcrumb>
+        </div>
+        <br />
+        <div>
+            <div>BitIconInfo.Fa (FontAwesome helper)</div>
+            <BitBreadcrumb TItem="BitBreadcrumbOption"
+                           MaxDisplayedItems="3" OverflowIndex="2"
+                           Styles="@(new() { ItemIcon = "line-height:unset" })">
+                <BitBreadcrumbOption Text="Home" Icon="@BitIconInfo.Fa("solid house")" />
+                <BitBreadcrumbOption Text="Products" Icon="@BitIconInfo.Fa("solid box")" />
+                <BitBreadcrumbOption Text="Electronics" Icon="@BitIconInfo.Fa("solid microchip")" />
+                <BitBreadcrumbOption Text="Laptops" Icon="@BitIconInfo.Fa("solid laptop")" IsSelected />
+            </BitBreadcrumb>
+        </div>
+        <br />
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        <div>
+            <div>BitIconInfo.Bi (Bootstrap Icons helper)</div>
+            <BitBreadcrumb TItem="BitBreadcrumbOption" MaxDisplayedItems="3" OverflowIndex="2">
+                <BitBreadcrumbOption Text="Home" Icon="@BitIconInfo.Bi("house-fill")" />
+                <BitBreadcrumbOption Text="Products" Icon="@BitIconInfo.Bi("box-seam-fill")" />
+                <BitBreadcrumbOption Text="Electronics" Icon="@BitIconInfo.Bi("cpu-fill")" />
+                <BitBreadcrumbOption Text="Laptops" Icon="@BitIconInfo.Bi("laptop-fill")" IsSelected />
+            </BitBreadcrumb>
+        </div>
+    </div>
+</DemoExample>
+
 <DemoExample Title="Class & Style" RazorCode="@example7RazorCode" Id="example7">
     <div>Customize the appearance of BitBreadcrumb using styles and CSS classes.</div>
     <br /><br />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor.samples.cs
index 2c3515dd1c..6f14ca779b 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Breadcrumb/_BitBreadcrumbOptionDemo.razor.samples.cs
@@ -170,6 +170,45 @@ public partial class _BitBreadcrumbOptionDemo
 private uint MaxDisplayedItems = 3;
 private int CustomizedSelectedOptionNumber = 4;";
 
+    private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitBreadcrumb TItem=""BitBreadcrumbOption"" 
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"">
+    <BitBreadcrumbOption Text=""Home"" Icon=""@(""fa-solid fa-house"")"" />
+    <BitBreadcrumbOption Text=""Products"" Icon=""@(""fa-solid fa-box"")"" />
+    <BitBreadcrumbOption Text=""Electronics"" Icon=""@(""fa-solid fa-microchip"")"" />
+    <BitBreadcrumbOption Text=""Laptops"" Icon=""@(""fa-solid fa-laptop"")"" IsSelected />
+</BitBreadcrumb>
+
+<BitBreadcrumb TItem=""BitBreadcrumbOption"" 
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"">
+    <BitBreadcrumbOption Text=""Home"" Icon=""@BitIconInfo.Css(""fa-solid fa-house"")"" />
+    <BitBreadcrumbOption Text=""Products"" Icon=""@BitIconInfo.Css(""fa-solid fa-box"")"" />
+    <BitBreadcrumbOption Text=""Electronics"" Icon=""@BitIconInfo.Css(""fa-solid fa-microchip"")"" />
+    <BitBreadcrumbOption Text=""Laptops"" Icon=""@BitIconInfo.Css(""fa-solid fa-laptop"")"" IsSelected />
+</BitBreadcrumb>
+
+<BitBreadcrumb TItem=""BitBreadcrumbOption"" 
+               MaxDisplayedItems=""3"" OverflowIndex=""2""
+               Styles=""@(new() { ItemIcon = ""line-height:unset"" })"">
+    <BitBreadcrumbOption Text=""Home"" Icon=""@BitIconInfo.Fa(""solid house"")"" />
+    <BitBreadcrumbOption Text=""Products"" Icon=""@BitIconInfo.Fa(""solid box"")"" />
+    <BitBreadcrumbOption Text=""Electronics"" Icon=""@BitIconInfo.Fa(""solid microchip"")"" />
+    <BitBreadcrumbOption Text=""Laptops"" Icon=""@BitIconInfo.Fa(""solid laptop"")"" IsSelected />
+</BitBreadcrumb>
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitBreadcrumb TItem=""BitBreadcrumbOption"" MaxDisplayedItems=""3"" OverflowIndex=""2"">
+    <BitBreadcrumbOption Text=""Home"" Icon=""@BitIconInfo.Bi(""house-fill"")"" />
+    <BitBreadcrumbOption Text=""Products"" Icon=""@BitIconInfo.Bi(""box-seam-fill"")"" />
+    <BitBreadcrumbOption Text=""Electronics"" Icon=""@BitIconInfo.Bi(""cpu-fill"")"" />
+    <BitBreadcrumbOption Text=""Laptops"" Icon=""@BitIconInfo.Bi(""laptop-fill"")"" IsSelected />
+</BitBreadcrumb>";
+
     private readonly string example7RazorCode = @"
 <style>
     .custom-class {

From 7f460fce4aec841ef917ea3c9176badf9213b8f8 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Wed, 18 Feb 2026 17:06:27 +0330
Subject: [PATCH 15/66] feat(blazorui): add new Icon parameters to BitDropMenu
 #12105 (#12106)

---
 .../Navs/DropMenu/BitDropMenu.razor           | 10 ++-
 .../Navs/DropMenu/BitDropMenu.razor.cs        | 50 +++++++++++++--
 .../Navs/DropMenu/BitDropMenuDemo.razor       | 61 +++++++++++++++++--
 .../Navs/DropMenu/BitDropMenuDemo.razor.cs    | 57 ++++++++++++++++-
 .../DropMenu/BitDropMenuDemo.razor.samples.cs | 44 +++++++++++--
 5 files changed, 204 insertions(+), 18 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor
index 6e47497bae..8bda87aba3 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor
@@ -19,9 +19,11 @@
         }
         else
         {
-            @if (IconName.HasValue())
+            var icon = BitIconInfo.From(Icon, IconName);
+
+            if (icon is not null)
             {
-                <i style="@Styles?.Icon" class="bit-drm-icn bit-icon bit-icon--@IconName @Classes?.Icon" />
+                <i style="@Styles?.Icon" class="bit-drm-icn @icon.GetCssClasses() @Classes?.Icon" />
             }
 
             @if (Text.HasValue())
@@ -31,8 +33,10 @@
                 </div>
             }
 
+            var chevronIcon = BitIconInfo.From(ChevronDownIcon, ChevronDownIconName ?? "ChevronRight bit-ico-r90");
+
             <i style="@Styles?.ChevronDown"
-               class="bit-icon bit-icon--@(ChevronDownIcon ?? "ChevronRight bit-ico-r90") @Classes?.ChevronDown" />
+               class="@chevronIcon?.GetCssClasses() @Classes?.ChevronDown" />
         }
     </button>
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs
index 4927eafe02..e3c765e94c 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/DropMenu/BitDropMenu.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// DropMenu component is a versatile dropdown menu used in Blazor applications. It allows you to create a button that, when clicked, opens a callout or dropdown menu.
@@ -20,9 +20,30 @@ public partial class BitDropMenu : BitComponentBase
     [Parameter] public RenderFragment? Body { get; set; }
 
     /// <summary>
-    /// The icon name of the chevron down part of the drop menu.
+    /// Gets or sets the icon for the chevron down part of the drop menu using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="ChevronDownIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? ChevronDownIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ChevronDownIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: ChevronDownIcon="BitIconInfo.Bi("chevron-down")"
+    /// FontAwesome: ChevronDownIcon="BitIconInfo.Fa("solid chevron-down")"
+    /// Custom CSS: ChevronDownIcon="BitIconInfo.Css("my-chevron-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? ChevronDownIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon name for the chevron down part of the drop menu from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set. When null, defaults to "ChevronRight bit-ico-r90".
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// For external icon libraries, use <see cref="ChevronDownIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? ChevronDownIconName { get; set; }
 
     /// <summary>
     /// The content of the callout of the drop menu.
@@ -35,8 +56,29 @@ public partial class BitDropMenu : BitComponentBase
     [Parameter] public BitDropMenuClassStyles? Classes { get; set; }
 
     /// <summary>
-    /// The icon to show inside the header of the drop menu.
+    /// Gets or sets the icon to display inside the header of the drop menu using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display inside the header of the drop menu from the built-in Fluent UI icons.
     /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.AddFriend</c>).
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor
index 8e49c6a680..eb47d69a55 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/dropmenu"
+@page "/components/dropmenu"
 
 <PageOutlet Url="components/dropmenu"
             Title="DropMenu"
@@ -44,7 +44,7 @@
             </BitStack>
         </BitDropMenu>
         <br /><br />
-        <BitDropMenu Text="ChevronDownIcon" ChevronDownIcon="@BitIconName.DoubleChevronDown">
+        <BitDropMenu Text="ChevronDownIcon" ChevronDownIconName="@BitIconName.DoubleChevronDown">
             <BitStack Gap="1rem" Style="padding:0.5rem">
                 <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
             </BitStack>
@@ -104,7 +104,60 @@
         </BitDropMenu>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example6RazorCode" Id="example6">
+    <DemoExample Title="External Icons" RazorCode="@example6RazorCode" Id="example6">
+        <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> and <b>ChevronDownIcon</b> parameters.</div>
+        <br />
+        <div>
+            For details on <b>BitIconInfo</b> and its factory methods (<c>BitIconInfo.Css</c>, <c>BitIconInfo.Fa</c>, <c>BitIconInfo.Bi</c>), 
+            see the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table. Built-in Fluent UI icons are documented at 
+            <BitLink Href="https://blazorui.bitplatform.dev/iconography" Target="_blank">Iconography</BitLink>.
+        </div>
+        
+        <br />
+        <br />
+        
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+        <div>FontAwesome:</div>
+        <br />
+        <BitDropMenu Text="House" Icon="@("fa-solid fa-house")">
+            <BitStack Gap="1rem" Style="padding:0.5rem">
+                <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
+            </BitStack>
+        </BitDropMenu>
+        <br /><br />
+        <BitDropMenu Text="Heart" Icon="@BitIconInfo.Css("fa-solid fa-heart")">
+            <BitStack Gap="1rem" Style="padding:0.5rem">
+                <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
+            </BitStack>
+        </BitDropMenu>
+        <br /><br />
+        <BitDropMenu Text="GitHub" Icon="@BitIconInfo.Fa("fa-brands fa-github")">
+            <BitStack Gap="1rem" Style="padding:0.5rem">
+                <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
+            </BitStack>
+        </BitDropMenu>
+
+        <br /><br /><br /><br />
+        
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        
+        <div>Bootstrap Icons:</div>
+        <br />
+        <BitDropMenu Text="House" Icon="@("bi bi-house-fill")">
+            <BitStack Gap="1rem" Style="padding:0.5rem">
+                <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
+            </BitStack>
+        </BitDropMenu>
+        <br /><br />
+        <BitDropMenu Text="Gear" Icon="@BitIconInfo.Bi("gear-fill")" ChevronDownIcon="@BitIconInfo.Bi("chevron-down")">
+            <BitStack Gap="1rem" Style="padding:0.5rem">
+                <BitText Typography="BitTypography.Subtitle1">This is the content</BitText>
+            </BitStack>
+        </BitDropMenu>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example7RazorCode" Id="example7">
         <div>Further customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
         <br /><br />
         <div>Component's Style & Class:</div><br />
@@ -144,7 +197,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example7RazorCode" Id="example7">
+    <DemoExample Title="RTL" RazorCode="@example8RazorCode" Id="example8">
         <div>Use BitDropMenu in right-to-left (RTL).</div>
         <br />
         <div class="example-content" dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.cs
index 419beacc69..57276b1cfa 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.DropMenu;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.DropMenu;
 
 public partial class BitDropMenuDemo
 {
@@ -14,9 +14,20 @@ public partial class BitDropMenuDemo
         new()
         {
             Name = "ChevronDownIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the chevron down part of the drop menu using custom CSS classes for external icon libraries. Takes precedence over ChevronDownIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "ChevronDownIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the chevron down part of the drop menu."
+            Description = "The icon name for the chevron down part of the drop menu from the built-in Fluent UI icons. For external icon libraries, use ChevronDownIcon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
         },
         new()
         {
@@ -35,11 +46,22 @@ public partial class BitDropMenuDemo
             Href = "#class-styles"
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the header using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon to show inside the header of the drop menu."
+            Description = "The name of the icon to display inside the header from the built-in Fluent UI icons. For external icon libraries, use Icon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
         },
         new()
         {
@@ -173,6 +195,35 @@ public partial class BitDropMenuDemo
                     Description = "Custom CSS classes/styles for the callout of the BitDropMenu."
                 },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon."
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+                },
+            ]
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.samples.cs
index 2c3a0de787..88d2cc0396 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/DropMenu/BitDropMenuDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.DropMenu;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.DropMenu;
 
 public partial class BitDropMenuDemo
 {
@@ -34,7 +34,7 @@ public partial class BitDropMenuDemo
     </BitStack>
 </BitDropMenu>
 
-<BitDropMenu Text=""ChevronDownIcon"" ChevronDownIcon=""@BitIconName.DoubleChevronDown"">
+<BitDropMenu Text=""ChevronDownIconName"" ChevronDownIconName=""@BitIconName.DoubleChevronDown"">
     <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
         <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
     </BitStack>
@@ -89,6 +89,42 @@ public partial class BitDropMenuDemo
 private int clickCounter;";
 
     private readonly string example6RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitDropMenu Text=""House"" Icon=""@(""fa-solid fa-house"")"">
+    <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
+        <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
+    </BitStack>
+</BitDropMenu>
+
+<BitDropMenu Text=""Heart"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"">
+    <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
+        <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
+    </BitStack>
+</BitDropMenu>
+
+<BitDropMenu Text=""GitHub"" Icon=""@BitIconInfo.Fa(""fa-brands fa-github"")"">
+    <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
+        <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
+    </BitStack>
+</BitDropMenu>
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitDropMenu Text=""House"" Icon=""@(""bi bi-house-fill"")"">
+    <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
+        <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
+    </BitStack>
+</BitDropMenu>
+
+<BitDropMenu Text=""Gear"" Icon=""@BitIconInfo.Bi(""gear-fill"")""
+             ChevronDownIcon=""@BitIconInfo.Bi(""chevron-down"")"">
+    <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
+        <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
+    </BitStack>
+</BitDropMenu>";
+
+    private readonly string example7RazorCode = @"
 <style>
     .custom-class {
         border-radius: 1rem;
@@ -138,7 +174,7 @@ public partial class BitDropMenuDemo
 
 <BitDropMenu Text=""Styled Drop menu""
              Styles=""@(new() { Root = ""background-color: peachpuff; border-color: peachpuff; min-width: 6rem;"",
-                               Text = ""color: tomato; font-weight: bold;""
+                               Text = ""color: tomato; font-weight: bold;"",
                                Opened = ""border-color: tomato; background-color: goldenrod;"" })"">
     <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
         <BitText Typography=""BitTypography.Subtitle1"">This is the content</BitText>
@@ -154,7 +190,7 @@ public partial class BitDropMenuDemo
     </BitStack>
 </BitDropMenu>";
 
-    private readonly string example7RazorCode = @"
+    private readonly string example8RazorCode = @"
 <BitDropMenu Text=""منو"" Dir=""BitDir.Rtl"">
     <BitStack Gap=""1rem"" Style=""padding:0.5rem"">
         <BitText Typography=""BitTypography.Subtitle1"">این یک محتوای تستی می باشد.</BitText>

From fcee14dad9a7805efecb592446f5a637d66ba25e Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 18 Feb 2026 18:11:17 +0100
Subject: [PATCH 16/66] feat(deps): update project dependencies #12074 (#12075)

---
 .devcontainer/devcontainer.json               |   2 +-
 .github/workflows/bit.ci.release.yml          |   4 +-
 .../Bit.Besql.Demo.Client.csproj              |   2 +-
 .../Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj |   6 +-
 ...it.ci.release.slnx => Bit.CI.Release.slnx} |   0
 .../Bit.BlazorUI.Extras.csproj                |   2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  10 +-
 .../Bit.BlazorUI.Demo.Shared.csproj           |   8 +-
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |   8 +-
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |   4 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |   6 +-
 .../Bit.Bswup.Demo/Bit.Bswup.Demo.csproj      |   4 +-
 .../Bit.Bswup.NewDemo.Client.csproj           |   2 +-
 .../Bit.Bswup.NewDemo.csproj                  |   2 +-
 .../Client/Bit.Bswup.Demo.Client.csproj       |   4 +-
 .../Server/Bit.Bswup.Demo.Server.csproj       |   2 +-
 .../Bit.Butil.Demo.Maui.csproj                |   6 +-
 .../Bit.Butil.Demo.Web.csproj                 |   4 +-
 .../Bit.ResxTranslator.csproj                 |  12 +-
 .../.devcontainer/devcontainer.json           |   2 +-
 ...earch with Vector Embeddings (Advanced).md |   2 +-
 .../Bit.Boilerplate/.vscode/mcp.json          |   2 +-
 .../20260119232453_Initial.Designer.cs        |   2 +-
 .../AppOfflineDbContextModelSnapshot.cs       |   2 +-
 .../src/Directory.Packages.props              | 130 +++++++++---------
 .../Attachments/AttachmentController.cs       |   4 +
 .../Program.Services.cs                       |  10 +-
 .../Boilerplate.Server.AppHost.csproj         |   2 +-
 .../WebApplicationBuilderExtensions.cs        |   6 +-
 .../Bit.Websites.Careers.Client.csproj        |   4 +-
 .../Bit.Websites.Careers.Server.csproj        |   8 +-
 .../Bit.Websites.Careers.Shared.csproj        |   6 +-
 .../Bit.Websites.Platform.Client.csproj       |   6 +-
 .../Templates03GettingStartedPage.razor       |   2 +-
 .../Bit.Websites.Platform.Server.csproj       |  12 +-
 .../Bit.Websites.Platform.Shared.csproj       |   6 +-
 .../Bit.Websites.Sales.Client.csproj          |   4 +-
 .../Bit.Websites.Sales.Server.csproj          |   8 +-
 .../Bit.Websites.Sales.Shared.csproj          |   6 +-
 src/global.json                               |   2 +-
 40 files changed, 160 insertions(+), 154 deletions(-)
 rename src/{bit.ci.release.slnx => Bit.CI.Release.slnx} (100%)

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 266b7cbb20..e6a705e341 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -14,7 +14,7 @@
     },
     "ghcr.io/devcontainers/features/node:1": { "version": "24" }
   },
-  "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.102",
+  "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.103",
   "postStartCommand": "dotnet workload install wasm-tools && dotnet dev-certs https --trust",
   "waitFor": "onCreateCommand",
   "customizations": {
diff --git a/.github/workflows/bit.ci.release.yml b/.github/workflows/bit.ci.release.yml
index 602331f849..f56f9c341c 100644
--- a/.github/workflows/bit.ci.release.yml
+++ b/.github/workflows/bit.ci.release.yml
@@ -43,7 +43,7 @@ jobs:
 
     - name: InstallNodejsDependencies
       continue-on-error: true # Error MSB4057, not all csproj files have InstallNodejsDependencies target.
-      run: dotnet build src/bit.ci.release.slnx -t:InstallNodejsDependencies -m:1 -f net10.0
+      run: dotnet build src/Bit.CI.Release.slnx -t:InstallNodejsDependencies -m:1 -f net10.0
 
     - name: dotnet build
-      run: dotnet build src/bit.ci.release.slnx -c Release
+      run: dotnet build src/Bit.CI.Release.slnx -c Release
diff --git a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
index 3aa2fcaeab..2412eb6867 100644
--- a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
@@ -10,7 +10,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
index 5036530f2d..32e6e7210f 100644
--- a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
@@ -8,7 +8,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\Bit.Besql.Demo.Client\Bit.Besql.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
@@ -17,11 +17,11 @@
              and open Nuget Package Manager Console, and select `Bit.Besql.Demo.Client` project as default project
              Then run either Add-Migration MigrationName -OutputDir Data\Migrations or
              Optimize-DbContext -OutputDir Data\CompiledModel commands. -->
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.2">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.3">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.2">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.3">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/bit.ci.release.slnx b/src/Bit.CI.Release.slnx
similarity index 100%
rename from src/bit.ci.release.slnx
rename to src/Bit.CI.Release.slnx
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
index effcab97e6..8058b3aeab 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
@@ -25,7 +25,7 @@
     <ItemGroup>
         <FrameworkReference Include="Microsoft.AspNetCore.App" PrivateAssets="all" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" PrivateAssets="all" />
-        <PackageReference Include="Jint" Version="4.5.0" PrivateAssets="all" />
+        <PackageReference Include="Jint" Version="4.6.0" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index e2bb419dd5..c632fa51f3 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -19,19 +19,19 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Jint" Version="4.5.0" />
+        <PackageReference Include="Jint" Version="4.6.0" />
         <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.2.0-preview.1.26063.2" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageReference Include="MimeTypeMapOfficial" Version="1.0.17" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.2" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.InMemory.Storage" Version="9.0.0" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.2.0" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="0.8.0-preview.1" />
     </ItemGroup>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index 54f6a7f05b..e61071063b 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -13,10 +13,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.2" />
-        <PackageReference Include="System.Text.Json" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
+        <PackageReference Include="System.Text.Json" Version="10.0.3" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 95f80042b1..eea6f1316d 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -24,10 +24,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 3d36f486cd..1f811d8706 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -117,8 +117,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.31" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.31" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.40" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
     </ItemGroup>
 
     <!-- Build Properties must be defined within these property groups to ensure successful publishing
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index 4cee85072c..20f09e919e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -39,9 +39,9 @@
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
 
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.31" />
-        <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3719.77" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.40" />
+        <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageReference Include="Velopack" Version="0.0.1298" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
         <Content Include="..\Bit.BlazorUI.Demo.Client.Maui\wwwroot\index.html" Link="wwwroot\index.html">
diff --git a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
index 509c24ca81..e1091b0747 100644
--- a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
+++ b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
@@ -8,8 +8,8 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.2" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
index 3016f39e26..6231201df9 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
@@ -13,7 +13,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
index 0250022365..387fcfc728 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
@@ -8,7 +8,7 @@
 
   <ItemGroup>
     <ProjectReference Include="..\Bit.Bswup.NewDemo.Client\Bit.Bswup.NewDemo.Client.csproj" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
   </ItemGroup>
 
 </Project>
diff --git a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
index 051242f4c9..2927c5e463 100644
--- a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
+++ b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
@@ -9,8 +9,8 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.2" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
 
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
     </ItemGroup>
diff --git a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
index c30fea7269..e23137a92e 100644
--- a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
+++ b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
@@ -8,7 +8,7 @@
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
         <ProjectReference Include="..\Client\Bit.Bswup.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
index f15a8bcb91..841bcac12f 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
@@ -50,9 +50,9 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.31" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.31" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.40" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
index 7a2d32b243..05db089ba7 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
@@ -7,8 +7,8 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.2" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
   </ItemGroup>
 
   <ItemGroup>
diff --git a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
index f98341c455..f3d0d26276 100644
--- a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
+++ b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
@@ -14,13 +14,13 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.2.0" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.2.0-preview.1.26063.2" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.3" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
index 9fada3351f..e6c9704075 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
@@ -1,6 +1,6 @@
 {
     "name": "Boilerplate",
-    "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.102",
+    "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.103",
     "hostRequirements": {
         "cpus": 8
     },
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/25- RAG - Semantic Search with Vector Embeddings (Advanced).md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/25- RAG - Semantic Search with Vector Embeddings (Advanced).md
index ccc89be302..c85a6438c5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/25- RAG - Semantic Search with Vector Embeddings (Advanced).md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/25- RAG - Semantic Search with Vector Embeddings (Advanced).md	
@@ -95,7 +95,7 @@ The project supports multiple embedding model providers. You configure them in `
 services.AddEmbeddingGenerator(sp => new LocalTextEmbeddingGenerationService()
     .AsEmbeddingGenerator())
     .UseLogging()
-    .UseOpenTelemetry();
+    .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
 ```
 
 **Characteristics**:
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/mcp.json b/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/mcp.json
index 2ebbd4540a..58770f22b0 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/mcp.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/mcp.json
@@ -1,7 +1,7 @@
 {
     "servers": {
         "DeepWiki": {
-            "type": "sse",
+            "type": "http",
             "url": "https://mcp.deepwiki.com/mcp"
         },
         "MicrosoftLearn": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
index 4973f469ef..fc95635baf 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
@@ -17,7 +17,7 @@ partial class Initial
     protected override void BuildTargetModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.2");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.3");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
index 605e882fdb..7cb080ac6a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
@@ -14,7 +14,7 @@ partial class AppOfflineDbContextModelSnapshot : ModelSnapshot
     protected override void BuildModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.2");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.3");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 5307eebeda..19dcd0508f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -15,29 +15,29 @@
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
         <PackageVersion Include="HtmlSanitizer" Version="9.0.892" />
-        <PackageVersion Include="libphonenumber-csharp" Version="9.0.23" />
+        <PackageVersion Include="libphonenumber-csharp" Version="9.0.24" />
         <PackageVersion Include="Meziantou.Framework.Win32.Jobs" Version="3.5.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" />
         <PackageVersion Include="Asp.Versioning.Mvc" Version="8.1.1" />
         <PackageVersion Include="Asp.Versioning.Mvc.ApiExplorer" Version="8.1.1" />
         <PackageVersion Include="EmbedIO" Version="3.5.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.3" />
         <PackageVersion Include="AspNetCore.HealthChecks.Hangfire" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.31" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.31" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.31" />
-        <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3719.77" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.40" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.40" />
+        <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageVersion Include="MSTest" Version="4.1.0" />
         <PackageVersion Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageVersion Include="OpenTelemetry.Instrumentation.EntityFrameworkCore" Version="1.15.0-beta.1" />
@@ -50,30 +50,30 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.36" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.41" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.3" />
         <!--/+:msbuild-conditional:noEmit -->
         <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="0.8.0-preview.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.0-preview.1.25616.3" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.0" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.1-preview.1.26105.8" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.1" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.0" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.0" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.1" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.1" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'Sqlite' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.Sqlite" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.0" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.1" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.SqlServer.Extensions" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.0" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.0" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.0" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.1" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.1" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.1" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'S3' OR '$(filesStorage)' == '') " Include="CommunityToolkit.Aspire.Hosting.Minio" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.0-preview.1.25616.3" />
-        <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.2.0" />
-        <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.2.0" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.1-preview.1.26105.8" />
+        <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.3.0" />
+        <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.3.0" />
         <PackageVersion Include="OpenTelemetry.Exporter.OpenTelemetryProtocol" Version="1.15.0" />
         <PackageVersion Include="OpenTelemetry.Extensions.Hosting" Version="1.15.0" />
         <PackageVersion Include="OpenTelemetry.Instrumentation.AspNetCore" Version="1.15.0" />
@@ -81,70 +81,70 @@
         <PackageVersion Include="OpenTelemetry.Instrumentation.Runtime" Version="1.15.0" />
         <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.23" />
         <PackageVersion Include="Hangfire.EntityFrameworkCore" Version="0.9.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.AspNetCore" Version="6.0.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.0.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.0.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.AspNetCore" Version="6.1.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.1.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.1.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Xamarin.Firebase.Messaging" Version="125.0.1" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Plugin.LocalNotification" Version="13.0.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="AdsPush" Version="2.0.0" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="9.0.5" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="9.0.5" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="9.0.5" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.2" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="9.0.5" />
-        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.2" />
-        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.32.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.2.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.2.0-preview.1.26063.2" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
+        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
+        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.3.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.70.0-preview" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.70.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-preview.260205.1" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.71.0-preview" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.71.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-preview.260212.1" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="BlazorApplicationInsights" Version="3.3.0" />
-        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.2" />
+        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.3" />
         <PackageVersion Condition=" '$(database)' == 'PostgreSQL' OR '$(database)' == '' " Include="Npgsql.EntityFrameworkCore.PostgreSQL" Version="10.0.0" />
         <PackageVersion Condition=" '$(database)' == 'MySql' OR '$(database)' == '' " Include="Pomelo.EntityFrameworkCore.MySql" Version="9.0.0" />
         <PackageVersion Condition=" '$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '' " Include="FluentStorage.Azure.Blobs" Version="6.0.2" />
         <PackageVersion Condition=" '$(filesStorage)' == 'S3' OR '$(filesStorage)' == '' " Include="FluentStorage.AWS" Version="6.0.2" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.AspNetCore" Version="1.4.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta7" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.0" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.0" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.1" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.5.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
-        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.2" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.2" />
+        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.3" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.3" />
         <!--/-:msbuild-conditional:noEmit -->
         <PackageVersion Include="Humanizer" Version="3.0.1" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
         <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.2" />
         <PackageVersion Include="FluentEmail.Smtp" Version="3.0.2" />
         <PackageVersion Include="FluentStorage" Version="6.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.3" />
         <PackageVersion Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.3" />
         <PackageVersion Include="Swashbuckle.AspNetCore" Version="10.0.0" />
         <PackageVersion Include="Microsoft.Identity.Web" Version="4.3.0" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.3" />
         <PackageVersion Include="AspNet.Security.OAuth.Apple" Version="10.0.0" />
         <PackageVersion Include="AspNet.Security.OAuth.GitHub" Version="10.0.0" />
         <PackageVersion Include="Riok.Mapperly" Version="4.3.1" />
         <PackageVersion Include="Twilio" Version="7.14.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.2" />
-        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.2" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.3" />
         <PackageVersion Include="System.Text.Json" Version="10.0.0" />
         <PackageVersion Include="FakeItEasy" Version="9.0.1" />
         <PackageVersion Include="Microsoft.Playwright.MSTest.v4" Version="1.58.0" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Attachments/AttachmentController.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Attachments/AttachmentController.cs
index 4415b87859..61ff38e47c 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Attachments/AttachmentController.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Attachments/AttachmentController.cs
@@ -68,6 +68,10 @@ public async Task<IActionResult> UploadProductPrimaryImage(Guid productId, IForm
     [AppResponseCache(MaxAge = 3600 * 24 * 7, UserAgnostic = true)]
     public async Task<IActionResult> GetAttachment(Guid attachmentId, AttachmentKind kind, CancellationToken cancellationToken = default)
     {
+        // If the backend is hosted behind a CDN (which is recommended for production), the GetAttachment method's returned stream will be cached on CDN edge servers.
+        // Alternatively, you can generate URLs that allow clients to download files directly from the file storage, further reducing the load on the backend.
+        // If security is a concern, you can generate short-lived signed URLs for the file storage. These signed URLs can be validated either at the CDN edge or on the file storage server, ensuring that only authorized users can access the files.
+
         var filePath = GetFilePath(attachmentId, kind);
 
         if (await blobStorage.ExistsAsync(filePath, cancellationToken) is false)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index f4919370fc..eeeb833a63 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -517,7 +517,7 @@ void AddDbContext(DbContextOptionsBuilder options)
             }).AsIChatClient())
             .UseLogging()
             .UseFunctionInvocation()
-            .UseOpenTelemetry();
+            .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
             // .UseDistributedCache()
         }
         else if (string.IsNullOrEmpty(appSettings.AI?.AzureOpenAI?.ChatApiKey) is false)
@@ -531,7 +531,7 @@ void AddDbContext(DbContextOptionsBuilder options)
                 }).AsIChatClient(appSettings.AI.AzureOpenAI.ChatModel))
             .UseLogging()
             .UseFunctionInvocation()
-            .UseOpenTelemetry();
+            .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
             // .UseDistributedCache()
         }
 
@@ -543,7 +543,7 @@ void AddDbContext(DbContextOptionsBuilder options)
                 Transport = new HttpClientPipelineTransport(sp.GetRequiredService<IHttpClientFactory>().CreateClient("AI"))
             }).AsIEmbeddingGenerator())
             .UseLogging()
-            .UseOpenTelemetry();
+            .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
             // .UseDistributedCache()
         }
         else if (string.IsNullOrEmpty(appSettings.AI?.AzureOpenAI?.EmbeddingApiKey) is false)
@@ -555,7 +555,7 @@ void AddDbContext(DbContextOptionsBuilder options)
                     Transport = new Azure.Core.Pipeline.HttpClientTransport(sp.GetRequiredService<IHttpClientFactory>().CreateClient("AI"))
                 }).AsIEmbeddingGenerator(appSettings.AI.AzureOpenAI.EmbeddingModel))
             .UseLogging()
-            .UseOpenTelemetry();
+            .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
             // .UseDistributedCache()
         }
         else if (string.IsNullOrEmpty(appSettings.AI?.HuggingFace?.EmbeddingEndpoint) is false)
@@ -565,7 +565,7 @@ void AddDbContext(DbContextOptionsBuilder options)
                   apiKey: appSettings.AI.HuggingFace.EmbeddingApiKey,
                   httpClient: sp.GetRequiredService<IHttpClientFactory>().CreateClient("AI"), loggerFactory: sp.GetRequiredService<ILoggerFactory>()))
             .UseLogging()
-            .UseOpenTelemetry();
+            .UseOpenTelemetry(configure: c => c.EnableSensitiveData = env.IsDevelopment());
             // .UseDistributedCache()
         }
         //#endif
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
index aa4a612288..1036039851 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Aspire.AppHost.Sdk/13.1.0">
+<Project Sdk="Aspire.AppHost.Sdk/13.1.1">
 
     <PropertyGroup>
         <OutputType>Exe</OutputType>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
index fc007f5edf..eece28d0fd 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
@@ -159,7 +159,8 @@ private static TBuilder ConfigureOpenTelemetry<TBuilder>(this TBuilder builder)
                     .AddHttpClientInstrumentation()
                     .AddRuntimeInstrumentation();
 
-                metrics.AddMeter(ActivitySource.Current.Name);
+                metrics.AddMeter(ActivitySource.Current.Name)
+                    .AddMeter("Experimental.Microsoft.Extensions.AI");
             })
             .WithTracing(tracing =>
             {
@@ -189,7 +190,8 @@ private static TBuilder ConfigureOpenTelemetry<TBuilder>(this TBuilder builder)
                     .AddEntityFrameworkCoreInstrumentation(options => options.Filter = (providerName, command) => command?.CommandText?.Contains("Hangfire") is false /* Ignore Hangfire */)
                     .AddHangfireInstrumentation();
 
-                tracing.AddSource(ActivitySource.Current.Name);
+                tracing.AddSource(ActivitySource.Current.Name)
+                    .AddSource("Experimental.Microsoft.Extensions.AI");
             })
             .ConfigureResource(resource =>
             {
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index 21438e2cb7..a43d07da74 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index 958380bbdd..ceb05d456a 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -20,11 +20,11 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.2" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index c4702d1294..2e96e00658 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.2" />
-        <PackageReference Include="System.Text.Json" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
+        <PackageReference Include="System.Text.Json" Version="10.0.3" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 4505c77d9a..8ea0b336e8 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -23,7 +23,7 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
@@ -45,8 +45,8 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 9bd50023ad..42557c5cca 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -99,7 +99,7 @@
                             {
                                 <br />
                                 <BitAccordion Title="Ubuntu instructions">
-                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.102/dotnet-sdk-10.0.102-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
+                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.103/dotnet-sdk-10.0.103-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
 mkdir -p $HOME/.dotnet
 tar zxf $HOME/dotnet.tar.gz -C "$HOME/.dotnet"
 echo 'PATH=$HOME/.dotnet:$HOME/.dotnet/tools:$PATH' >> ~/.bashrc
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index ee6cbed402..9b2c250a4c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -21,15 +21,15 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.2.0-preview.1.26063.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.2.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="0.8.0-preview.1" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.2" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index c4702d1294..2e96e00658 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.2" />
-        <PackageReference Include="System.Text.Json" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
+        <PackageReference Include="System.Text.Json" Version="10.0.3" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index 4499d38421..b9580c72e0 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index 7aa9301c7c..c7ddc328dc 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -20,11 +20,11 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.2" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.2" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.2" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index c4702d1294..2e96e00658 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.2" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.2" />
-        <PackageReference Include="System.Text.Json" Version="10.0.2" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
+        <PackageReference Include="System.Text.Json" Version="10.0.3" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/global.json b/src/global.json
index 17c722f72d..eceef3a7a6 100644
--- a/src/global.json
+++ b/src/global.json
@@ -1,6 +1,6 @@
 {
     "sdk": {
-        "version": "10.0.102",
+        "version": "10.0.103",
         "rollForward": "disable"
     },
     "test": {

From 6c5a07ccb95cdabbdb44c5df7bcb818df836866e Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sat, 21 Feb 2026 14:32:34 +0330
Subject: [PATCH 17/66] feat(blazorui): add new Icon parameters to BitNav
 #12107 (#12110)

---
 .../Navs/Nav/BitNav.razor.internal.cs         |  39 +-
 .../Navs/Nav/BitNav.razor.parameters.cs       |  12 +-
 .../Components/Navs/Nav/BitNavItem.cs         |  13 +
 .../Navs/Nav/BitNavNameSelectors.cs           |   5 +
 .../Components/Navs/Nav/BitNavOption.razor.cs |  13 +
 .../Components/Navs/Nav/_BitNavChild.razor    |  15 +-
 .../Extensions/ObjectExtensions.cs            |  14 +-
 .../Components/Navs/Nav/BitNavDemo.razor      |   4 +-
 .../Components/Navs/Nav/BitNavDemo.razor.cs   |  69 ++-
 .../Pages/Components/Navs/Nav/CarMenu.cs      |   2 +-
 .../Pages/Components/Navs/Nav/FoodMenu.cs     |   4 +-
 .../Pages/Components/Navs/Nav/Section.cs      |   2 +-
 .../Navs/Nav/_BitNavCustomDemo.razor          |  46 +-
 .../Navs/Nav/_BitNavCustomDemo.razor.cs       | 418 +++++++++++-------
 .../Components/Navs/Nav/_BitNavItemDemo.razor |  14 +-
 .../Navs/Nav/_BitNavItemDemo.razor.cs         |  57 ++-
 .../Navs/Nav/_BitNavOptionDemo.razor          |  24 +-
 .../Navs/Nav/_BitNavOptionDemo.razor.cs       |  18 +-
 18 files changed, 561 insertions(+), 208 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.internal.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.internal.cs
index 4752100592..b22316c812 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.internal.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.internal.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitNav<TItem>
 {
@@ -217,6 +217,43 @@ internal bool GetForceAnchor(TItem item)
         return item.GetValueFromProperty(NameSelectors.ForceAnchor.Name, false);
     }
 
+    internal BitIconInfo? GetIcon(TItem item)
+    {
+        if (item is BitNavItem navItem)
+        {
+            return BitIconInfo.From(navItem.Icon, navItem.IconName);
+        }
+
+        if (item is BitNavOption navOption)
+        {
+            return BitIconInfo.From(navOption.Icon, navOption.IconName);
+        }
+
+        if (NameSelectors is null) return null;
+
+        BitIconInfo? icon = null;
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            icon = NameSelectors.Icon.Selector!(item);
+        }
+        else
+        {
+            icon = item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+        }
+
+        string? iconName = null;
+        if (NameSelectors.IconName.Selector is not null)
+        {
+            iconName = NameSelectors.IconName.Selector!(item);
+        }
+        else
+        {
+            iconName = item.GetValueFromProperty<string?>(NameSelectors.IconName.Name);
+        }
+
+        return BitIconInfo.From(icon, iconName);
+    }
+
     internal string? GetIconName(TItem item)
     {
         if (item is BitNavItem navItem)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.parameters.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.parameters.cs
index f9eb458d98..9e646a62a8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.parameters.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNav.razor.parameters.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitNav<TItem>
 {
@@ -13,10 +13,18 @@ public partial class BitNav<TItem>
     /// </summary>
     [Parameter] public bool AllExpanded { get; set; }
 
+    /// <summary>
+    /// The icon for the chevron-down element of each nav item.
+    /// Takes precedence over <see cref="ChevronDownIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ChevronDownIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? ChevronDownIcon { get; set; }
+
     /// <summary>
     /// The custom icon name of the chevron-down element of each nav item.
     /// </summary>
-    [Parameter] public string? ChevronDownIcon { get; set; }
+    [Parameter] public string? ChevronDownIconName { get; set; }
 
     /// <summary>
     /// Items to render as children.
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavItem.cs
index 635f43e122..99c5b6b4c5 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavItem.cs
@@ -47,6 +47,19 @@ public class BitNavItem
     /// </summary>
     public bool ForceAnchor { get; set; }
 
+    /// <summary>
+    /// Icon to render next to the nav item.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    /// <example>
+    /// Bootstrap: Icon=BitIconInfo.Bi("gear-fill")
+    /// FontAwesome: Icon=BitIconInfo.Fa("solid house")
+    /// Custom CSS: Icon=BitIconInfo.Css("my-icon-class")
+    /// </example>
+    public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render next to the nav item.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavNameSelectors.cs
index 3d3a816801..2d8d21926d 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavNameSelectors.cs
@@ -47,6 +47,11 @@ public class BitNavNameSelectors<TItem>
     /// </summary>
     public BitNameSelectorPair<TItem, bool?> ForceAnchor { get; set; } = new(nameof(BitNavItem.ForceAnchor));
 
+    /// <summary>
+    /// The Icon field name and selector of the custom input class (see <see cref="BitNavItem.Icon"/>).
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitNavItem.Icon));
+
     /// <summary>
     /// The IconName field name and selector of the custom input class (see <see cref="BitNavItem.IconName"/>).
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavOption.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavOption.razor.cs
index c553645173..e48897a683 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavOption.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/BitNavOption.razor.cs
@@ -61,6 +61,19 @@ public partial class BitNavOption : ComponentBase, IDisposable
     /// </summary>
     [Parameter] public bool ForceAnchor { get; set; }
 
+    /// <summary>
+    /// Icon to render next to the nav option.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </summary>
+    /// <example>
+    /// Bootstrap: Icon=BitIconInfo.Bi("gear-fill")
+    /// FontAwesome: Icon=BitIconInfo.Fa("solid house")
+    /// Custom CSS: Icon=BitIconInfo.Css("my-icon-class")
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// Name of an icon to render next to the nav option.
     /// </summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor
index 13b479a432..3ee519234e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Nav/_BitNavChild.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @typeparam TItem
 
 <li role="listitem" style="@Nav.GetStyle(Item)" class="@Nav.GetClass(Item)">
@@ -13,7 +13,8 @@
         var text = Nav.GetText(Item);
         var childItems = Nav.GetChildItems(Item);
         var description = Nav.GetDescription(Item);
-        var iconName = Nav.GetIconName(Item);
+        var chevronIcon = BitIconInfo.From(Nav.ChevronDownIcon, Nav.ChevronDownIconName ?? $"ChevronRight {(isExpanded ? "bit-nav-exp" : "bit-ico-r90")}");
+        var icon = Nav.GetIcon(Item);
         var url = Nav.GetUrl(Item);
         var title = Nav.GetTitle(Item);
         var target = Nav.GetTarget(Item);
@@ -66,7 +67,7 @@
                             <div class="bit-nav-iit" style="@(Nav.ReversedChevron ? "flex-flow:row-reverse" : null)">
                                 @if (Nav.NoCollapse is false)
                                 {
-                                    <i class="bit-icon bit-icon--@(Nav.ChevronDownIcon ?? "ChevronRight") @(Nav.ChevronDownIcon.HasValue() ? "" : (isExpanded ? "bit-nav-exp" : "bit-ico-r90"))" aria-hidden="true" />
+                                    <i class="@chevronIcon?.GetCssClasses()" aria-hidden="true" />
                                 }
                                 <span class="bit-nav-ghd">@text</span>
                             </div>
@@ -82,7 +83,7 @@
                         <div class="bit-nav-iit" style="@(Nav.ReversedChevron ? "flex-flow:row-reverse" : null)">
                             @if (Nav.NoCollapse is false)
                             {
-                                <i class="bit-icon bit-icon--@(Nav.ChevronDownIcon ?? "ChevronRight") @(Nav.ChevronDownIcon.HasValue() ? "" : (isExpanded ? "bit-nav-exp" : "bit-ico-r90"))" aria-hidden="true" />
+                                <i class="@chevronIcon?.GetCssClasses()" aria-hidden="true" />
                             }
                             <span class="bit-nav-ghd">@text</span>
                         </div>
@@ -144,7 +145,7 @@
                                  class="bit-nav-cbt @Nav.Classes?.ToggleButton"
                                  aria-expanded="@(isExpanded ? "true" : "false")"
                                  aria-label="@(isExpanded ? colAriaLabel : expAriaLabel)">
-                                <i class="bit-icon bit-icon--@(Nav.ChevronDownIcon ?? "ChevronRight") @(Nav.ChevronDownIcon.HasValue() ? "" : (isExpanded ? "bit-nav-exp" : "bit-ico-r90"))" aria-hidden="true" />
+                                <i class="@chevronIcon?.GetCssClasses()" aria-hidden="true" />
                             </div>
                         }
                         <div style="@GetItemStyles()"
@@ -159,9 +160,9 @@
                             }
                             else
                             {
-                                @if (iconName.HasValue())
+                                @if (icon is not null)
                                 {
-                                    <i style="@Nav.Styles?.ItemIcon" class="bit-nav-iic bit-icon bit-icon--@iconName @Nav.Classes?.ItemIcon" aria-hidden="true" />
+                                    <i style="@Nav.Styles?.ItemIcon" class="bit-nav-iic @icon.GetCssClasses() @Nav.Classes?.ItemIcon" aria-hidden="true" />
                                 }
                                 <span style="@Nav.Styles?.ItemText" class="bit-nav-itx @Nav.Classes?.ItemText">@text</span>
                             }
diff --git a/src/BlazorUI/Bit.BlazorUI/Extensions/ObjectExtensions.cs b/src/BlazorUI/Bit.BlazorUI/Extensions/ObjectExtensions.cs
index d95ea976a5..8892330e62 100644
--- a/src/BlazorUI/Bit.BlazorUI/Extensions/ObjectExtensions.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Extensions/ObjectExtensions.cs
@@ -1,4 +1,4 @@
-using System.Diagnostics.CodeAnalysis;
+using System.Diagnostics.CodeAnalysis;
 using System.Globalization;
 
 namespace Bit.BlazorUI;
@@ -30,6 +30,18 @@ internal static class ObjectExtensions
             if (value is null) return defaultValue;
         }
 
+        if (value is T tValue)
+        {
+            return tValue;
+        }
+
+        var implicitOp = targetType.GetMethod("op_Implicit", [value.GetType()]);
+        if (implicitOp is not null)
+        {
+            var result = implicitOp.Invoke(null, [value]);
+            return result is null ? defaultValue : (T)result;
+        }
+
         return (T)Convert.ChangeType(value, targetType, CultureInfo.InvariantCulture);
     }
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor
index b90be9e7e4..259efbdd27 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/nav"
+@page "/components/nav"
 @inherits AppComponentBase
 
 <PageOutlet Url="components/nav"
@@ -8,7 +8,7 @@
 <div>
     <DemoPage Name="Nav"
               SecondaryNames="@(["Tree", "TreeView"])"
-              Description="A navigation pane (Nav) provides links to the main areas of an app or site. This component can also be sued as a TreeView to show parent-child data in a tree."
+              Description="A navigation pane (Nav) provides links to the main areas of an app or site. This component can also be used as a TreeView to show parent-child data in a tree."
               Parameters="componentParameters"
               PublicMembers="componentPublicMembers"
               SubClasses="componentSubClasses"
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor.cs
index 99a5d600e3..ee25e163de 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/BitNavDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Nav;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Nav;
 
 public partial class BitNavDemo
 {
@@ -23,9 +23,18 @@ public partial class BitNavDemo
         new()
         {
             Name = "ChevronDownIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the chevron-down element of each nav item. Takes precedence over ChevronDownIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ChevronDownIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The custom icon name of the chevron-down element of the BitNav component.",
+            Description = "The custom icon name of the chevron-down element of each nav item.",
         },
         new()
         {
@@ -337,6 +346,15 @@ public partial class BitNavDemo
                    Description = "Forces an anchor element render instead of button.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to render next to the nav item. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -512,6 +530,15 @@ public partial class BitNavDemo
                    Description = "Forces an anchor element render instead of button.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "The icon to render next to the nav option. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
@@ -687,6 +714,15 @@ public partial class BitNavDemo
                    Description = "The ForceAnchor field name and selector of the custom input class."
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                   DefaultValue = "new(nameof(BitNavItem.Icon))",
+                   Description = "The Icon field name and selector of the custom input class.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "BitNameSelectorPair<TItem, string?>",
@@ -853,6 +889,35 @@ public partial class BitNavDemo
                    Description = "Custom CSS classes/styles for the separator of the BitNav."
                },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/CarMenu.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/CarMenu.cs
index 27eecde80b..030448d869 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/CarMenu.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/CarMenu.cs
@@ -9,6 +9,6 @@ public class CarMenu
     public string? ExpandedAriaLabel { get; set; }
     public string? CollapsedAriaLabel { get; set; }
     public bool IsExpandedParent { get; set; }
-    public List<CarMenu> Links { get; set; } = [];
     public string? Comment { get; set; }
+    public List<CarMenu> Links { get; set; } = [];
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/FoodMenu.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/FoodMenu.cs
index a1c0202ea7..f18ab4ab3a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/FoodMenu.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/FoodMenu.cs
@@ -3,8 +3,8 @@
 public class FoodMenu
 {
     public string Name { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? Image { get; set; }
     public bool IsExpanded { get; set; }
-    public List<FoodMenu> Childs { get; set; } = [];
     public string? Comment { get; set; }
+    public List<FoodMenu> Childs { get; set; } = [];
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/Section.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/Section.cs
index bdbaabbbec..bd75a1e189 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/Section.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/Section.cs
@@ -3,7 +3,7 @@
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor
index c2cf085c24..e5b101ee6d 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor
@@ -1,13 +1,13 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <BitNav Items="customBasicNavItems"
-            NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+            NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                      ChildItems =  { Name = nameof(Section.Links) },
                                      Description =  { Name = nameof(Section.Comment) } })" />
 </DemoExample>
 
 <DemoExample Title="FitWidth" RazorCode="@example2RazorCode" CsharpCode="@example2CsharpCode" Id="example2">
     <BitNav Items="customBasicNavItems" FitWidth
-            NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+            NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                      ChildItems =  { Name = nameof(Section.Links) },
                                      Description =  { Name = nameof(Section.Comment) } })" />
 </DemoExample>
@@ -32,7 +32,7 @@
             Mode="BitNavMode.Manual"
             DefaultSelectedItem="customFoodNavItems[0].Childs[2]"
             NameSelectors="@(new() { Text =  { Selector = item => item.Name },
-                                     IconName =  { Selector = item => item.Icon },
+                                     IconName =  { Selector = item => item.Image },
                                      ChildItems =  { Selector = item => item.Childs },
                                      Description =  { Selector = item => item.Comment } })" />
     <br /><br /><br />
@@ -43,7 +43,7 @@
                 Mode="BitNavMode.Manual"
                 DefaultSelectedItem="customFoodNavItems[0].Childs[2]"
                 NameSelectors="@(new() { Text =  { Selector = item => item.Name },
-                                         IconName =  { Selector = item => item.Icon },
+                                         IconName =  { Selector = item => item.Image },
                                          ChildItems =  { Selector = item => item.Childs },
                                          Description =  { Selector = item => item.Comment } })"
                 OnSelectItem="(FoodMenu item) => CustomSelectedFoodName = FoodMenuDropdownItems.Single(i => i.Text == item.Name).Text" />
@@ -60,7 +60,7 @@
     <BitToggle @bind-Value="iconOnly" Label="Hide texts?" Inline />
     <br />
     <BitNav Items="customIconOnlyNavItems" Mode="BitNavMode.Manual" IconOnly="iconOnly"
-            NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+            NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                      ChildItems =  { Name = nameof(Section.Links) },
                                      Description =  { Name = nameof(Section.Comment) } })" />
 </DemoExample>
@@ -90,13 +90,13 @@
     <BitNav Items="customFoodNavItems"
             Mode="BitNavMode.Manual"
             NameSelectors="@(new() { Text =  { Selector = item => item.Name },
-                                     IconName =  { Selector = item => item.Icon },
+                                     IconName =  { Selector = item => item.Image },
                                      ChildItems =  { Selector = item => item.Childs },
                                      Description =  { Selector = item => item.Comment } })">
         <ItemTemplate Context="item">
             <div class="nav-custom-item">
                 <BitCheckbox />
-                <BitIcon IconName="@item.Icon" />
+                <BitIcon IconName="@item.Image" />
                 <span>@item.Name</span>
             </div>
         </ItemTemplate>
@@ -111,7 +111,7 @@
                 OnSelectItem="(FoodMenu item) => CustomSelectedItem = item"
                 OnItemToggle="(FoodMenu item) => CustomToggledItem = item"
                 NameSelectors="@(new() { Text =  { Selector = item => item.Name },
-                                                   IconName =  { Selector = item => item.Icon },
+                                                   IconName =  { Selector = item => item.Image },
                                                    ChildItems =  { Selector = item => item.Childs },
                                                    Description =  { Selector = item => item.Comment } })" />
         <div>
@@ -125,14 +125,30 @@
 <DemoExample Title="AllExpanded & NoCollapse" RazorCode="@example8RazorCode" CsharpCode="@example8CsharpCode" Id="example8">
     <BitNav AllExpanded NoCollapse
             Items="customNoCollapseNavItems"
-            NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+            NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                      ChildItems =  { Name = nameof(Section.Links) },
                                      Description =  { Name = nameof(Section.Comment) } })" />
 </DemoExample>
 
-<DemoExample Title="Custom Styles" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
+<DemoExample Title="External Icons" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
+    <div>
+        Use icons from external libraries like FontAwesome with the <BitLink Href="#bit-icon-info">Icon</BitLink> selector in 
+        <BitLink Href="#name-selectors">NameSelectors</BitLink>. See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.
+        Built-in Fluent UI icons use <BitLink Href="#nav-item">IconName</BitLink>.
+    </div>
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <BitNav Items="customExternalIconNavItems"
+            NameSelectors="@(new() { Text =  { Name = nameof(Section.Text) },
+                                     Icon =  { Name = nameof(Section.ImageName) },
+                                     Url =  { Name = nameof(Section.Url) },
+                                     ChildItems =  { Name = nameof(Section.Links) },
+                                     Description =  { Name = nameof(Section.Comment) } })" />
+</DemoExample>
+
+<DemoExample Title="Custom Styles" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
     <BitNav Items="customCustomStyleNavItems"
-            NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+            NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                      ChildItems =  { Name = nameof(Section.Links) },
                                      Description =  { Name = nameof(Section.Comment) } })"
             Styles="@(new() { ItemContainer = "border: 1px solid green; margin: 2px;",
@@ -141,12 +157,12 @@
                               ItemIcon = "color: gold; margin-right: 15px;" })" />
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+<DemoExample Title="RTL" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
     <div dir="rtl">
         <BitNav Dir="BitDir.Rtl"
                 Items="customRtlNavItems"
-                NameSelectors="@(new() { IconName =  { Name = nameof(Section.Icon) },
+                NameSelectors="@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                          ChildItems =  { Name = nameof(Section.Links) },
                                          Description =  { Name = nameof(Section.Comment) } })" />
     </div>
-</DemoExample>
\ No newline at end of file
+</DemoExample>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor.cs
index fceff44fa3..1b5c52eea7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavCustomDemo.razor.cs
@@ -10,7 +10,7 @@ public partial class _BitNavCustomDemo
             Comment = "the bit platform description",
             Links =
             [
-                new() { Text = "Home", Icon = BitIconName.Home, Url = "https://bitplatform.dev/" },
+                new() { Text = "Home", ImageName = BitIconName.Home, Url = "https://bitplatform.dev/" },
                 new()
                 {
                     Text = "Products & Services",
@@ -21,18 +21,18 @@ public partial class _BitNavCustomDemo
                             Text = "Project Templates",
                             Links =
                             [
-                                new() { Text = "Todo sample", Icon = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
-                                new() { Text = "AdminPanel sample", Icon = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "Todo sample", ImageName = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "AdminPanel sample", ImageName = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
                             ]
                         },
-                        new() { Text = "BlazorUI", Icon = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
-                        new() { Text = "Cloud hosting solutions", Icon = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
-                        new() { Text = "Bit academy", Icon = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "BlazorUI", ImageName = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
+                        new() { Text = "Cloud hosting solutions", ImageName = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "Bit academy", ImageName = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
                     ]
                 },
-                new() { Text = "Pricing", Icon = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
-                new() { Text = "About", Icon = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
-                new() { Text = "Contact us", Icon = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
+                new() { Text = "Pricing", ImageName = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
+                new() { Text = "About", ImageName = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "Contact us", ImageName = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
             ],
         },
         new()
@@ -40,31 +40,31 @@ public partial class _BitNavCustomDemo
             Text = "Community",
             Links =
             [
-                new() { Text = "Linkedin", Icon = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
-                new() { Text = "Twitter", Icon = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
-                new() { Text = "Github repo", Icon = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
+                new() { Text = "Linkedin", ImageName = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
+                new() { Text = "Twitter", ImageName = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
+                new() { Text = "Github repo", ImageName = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
             ]
         },
-        new() { Text = "Iconography", Icon = BitIconName.AppIconDefault, Url = "/iconography" },
+        new() { Text = "Iconography", ImageName = BitIconName.AppIconDefault, Url = "/iconography" },
     ];
 
     private static readonly List<Section> customIconOnlyNavItems =
     [
-        new() { Text = "Home", Icon = BitIconName.Home },
+        new() { Text = "Home", ImageName = BitIconName.Home },
         new() {
             Text = "AdminPanel sample",
-            Icon = BitIconName.LocalAdmin,
+            ImageName = BitIconName.LocalAdmin,
             Links =
             [
-                new() { Text = "Dashboard", Icon = BitIconName.ViewDashboard },
-                new() { Text = "Categories", Icon = BitIconName.BuildQueue },
-                new() { Text = "Products", Icon = BitIconName.Product },
+                new() { Text = "Dashboard", ImageName = BitIconName.ViewDashboard },
+                new() { Text = "Categories", ImageName = BitIconName.BuildQueue },
+                new() { Text = "Products", ImageName = BitIconName.Product },
             ]
         },
-        new() { Text = "Todo sample", Icon = BitIconName.ToDoLogoOutline},
-        new() { Text = "BlazorUI", Icon = BitIconName.F12DevTools },
-        new() { Text = "Bit academy", Icon = BitIconName.LearningTools, IsEnabled = false },
-        new() { Text = "Contact us", Icon = BitIconName.Contact },
+        new() { Text = "Todo sample", ImageName = BitIconName.ToDoLogoOutline},
+        new() { Text = "BlazorUI", ImageName = BitIconName.F12DevTools },
+        new() { Text = "Bit academy", ImageName = BitIconName.LearningTools, IsEnabled = false },
+        new() { Text = "Contact us", ImageName = BitIconName.Contact },
     ];
 
     private static readonly List<CarMenu> customCarNavItems =
@@ -131,7 +131,7 @@ public partial class _BitNavCustomDemo
         new()
         {
             Name = "Fast foods",
-            Icon = BitIconName.HeartBroken,
+            Image = BitIconName.HeartBroken,
             IsExpanded = true,
             Comment = "List of fast foods",
             Childs =
@@ -165,7 +165,7 @@ public partial class _BitNavCustomDemo
         new()
         {
             Name = "Fruits",
-            Icon = BitIconName.Health,
+            Image = BitIconName.Health,
             Childs =
             [
                 new() { Name = "Apple" },
@@ -185,7 +185,7 @@ public partial class _BitNavCustomDemo
             Comment = "the bit platform description",
             Links =
             [
-                new() { Text = "Home", Icon = BitIconName.Home, Url = "https://bitplatform.dev/" },
+                new() { Text = "Home", ImageName = BitIconName.Home, Url = "https://bitplatform.dev/" },
                 new()
                 {
                     Text = "Products & Services",
@@ -196,18 +196,18 @@ public partial class _BitNavCustomDemo
                             Text = "Project Templates",
                             Links =
                             [
-                                new() { Text = "Todo sample", Icon = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
-                                new() { Text = "AdminPanel sample", Icon = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "Todo sample", ImageName = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "AdminPanel sample", ImageName = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
                             ]
                         },
-                        new() { Text = "BlazorUI", Icon = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
-                        new() { Text = "Cloud hosting solutions", Icon = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
-                        new() { Text = "Bit academy", Icon = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "BlazorUI", ImageName = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
+                        new() { Text = "Cloud hosting solutions", ImageName = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "Bit academy", ImageName = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
                     ]
                 },
-                new() { Text = "Pricing", Icon = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
-                new() { Text = "About", Icon = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
-                new() { Text = "Contact us", Icon = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
+                new() { Text = "Pricing", ImageName = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
+                new() { Text = "About", ImageName = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "Contact us", ImageName = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
             ],
         },
         new()
@@ -215,12 +215,37 @@ public partial class _BitNavCustomDemo
             Text = "Community",
             Links =
             [
-                new() { Text = "Linkedin", Icon = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
-                new() { Text = "Twitter", Icon = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
-                new() { Text = "Github repo", Icon = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
+                new() { Text = "Linkedin", ImageName = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
+                new() { Text = "Twitter", ImageName = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
+                new() { Text = "Github repo", ImageName = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
             ]
         },
-        new() { Text = "Iconography", Icon = BitIconName.AppIconDefault, Url = "/iconography" },
+        new() { Text = "Iconography", ImageName = BitIconName.AppIconDefault, Url = "/iconography" },
+    ];
+
+    private static readonly List<Section> customExternalIconNavItems =
+    [
+        new()
+        {
+            Text = "bit platform",
+            Comment = "Nav with external icons (FontAwesome)",
+            Links =
+            [
+                new() { Text = "Home", ImageName = BitIconInfo.Css("fa-solid fa-house"), Url = "https://bitplatform.dev/" },
+                new()
+                {
+                    Text = "Products & Services",
+                    Links =
+                    [
+                        new() { Text = "BlazorUI", ImageName = BitIconInfo.Fa("solid code"), Url = "https://bitplatform.dev/components" },
+                        new() { Text = "Pricing", ImageName = BitIconInfo.Css("fa-solid fa-tag"), Url = "https://bitplatform.dev/pricing" },
+                    ]
+                },
+                new() { Text = "About", ImageName = BitIconInfo.Fa("solid circle-info"), Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "Contact us", ImageName = BitIconInfo.Css("fa-solid fa-envelope"), Url = "https://bitplatform.dev/contact-us" },
+            ],
+        },
+        new() { Text = "Iconography", ImageName = BitIconInfo.Css("fa-solid fa-icons"), Url = "/iconography" },
     ];
 
     private static readonly List<Section> customCustomStyleNavItems =
@@ -231,7 +256,7 @@ public partial class _BitNavCustomDemo
             Comment = "the bit platform description",
             Links =
             [
-                new() { Text = "Home", Icon = BitIconName.Home, Url = "https://bitplatform.dev/" },
+                new() { Text = "Home", ImageName = BitIconName.Home, Url = "https://bitplatform.dev/" },
                 new()
                 {
                     Text = "Products & Services",
@@ -242,18 +267,18 @@ public partial class _BitNavCustomDemo
                             Text = "Project Templates",
                             Links =
                             [
-                                new() { Text = "Todo sample", Icon = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
-                                new() { Text = "AdminPanel sample", Icon = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "Todo sample", ImageName = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "AdminPanel sample", ImageName = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
                             ]
                         },
-                        new() { Text = "BlazorUI", Icon = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
-                        new() { Text = "Cloud hosting solutions", Icon = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
-                        new() { Text = "Bit academy", Icon = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "BlazorUI", ImageName = BitIconName.F12DevTools, Url = "https://bitplatform.dev/components" },
+                        new() { Text = "Cloud hosting solutions", ImageName = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "Bit academy", ImageName = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
                     ]
                 },
-                new() { Text = "Pricing", Icon = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
-                new() { Text = "About", Icon = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
-                new() { Text = "Contact us", Icon = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
+                new() { Text = "Pricing", ImageName = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
+                new() { Text = "About", ImageName = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "Contact us", ImageName = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
             ],
         },
         new()
@@ -261,12 +286,12 @@ public partial class _BitNavCustomDemo
             Text = "Community",
             Links =
             [
-                new() { Text = "Linkedin", Icon = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
-                new() { Text = "Twitter", Icon = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
-                new() { Text = "Github repo", Icon = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
+                new() { Text = "Linkedin", ImageName = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
+                new() { Text = "Twitter", ImageName = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
+                new() { Text = "Github repo", ImageName = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
             ]
         },
-        new() { Text = "Iconography", Icon = BitIconName.AppIconDefault, Url = "/iconography" },
+        new() { Text = "Iconography", ImageName = BitIconName.AppIconDefault, Url = "/iconography" },
     ];
 
     private static readonly List<Section> customRtlNavItems =
@@ -277,7 +302,7 @@ public partial class _BitNavCustomDemo
             Comment = "توضیحاتِ پلتفرمِ بیت",
             Links =
             [
-                new() { Text = "خانه", Icon = BitIconName.Home, Url = "https://bitplatform.dev/" },
+                new() { Text = "خانه", ImageName = BitIconName.Home, Url = "https://bitplatform.dev/" },
                 new()
                 {
                     Text = "محصولات و خدمات",
@@ -288,18 +313,18 @@ public partial class _BitNavCustomDemo
                             Text = "قالب های پروژه",
                             Links =
                             [
-                                new() { Text = "نمونه ی Todo", Icon = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
-                                new() { Text = "نمونه ی AdminPanel", Icon = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "نمونه ی Todo", ImageName = BitIconName.ToDoLogoOutline, Url = "https://bitplatform.dev/templates/overview" },
+                                new() { Text = "نمونه ی AdminPanel", ImageName = BitIconName.LocalAdmin, Url = "https://bitplatform.dev/templates/overview" },
                             ]
                         },
-                        new() { Text = "رابط کاربری Blazor", Icon = BitIconName.F12DevTools, Url = "https://blazorui.bitplatform.dev/" },
-                        new() { Text = "راه های هاست ابری", Icon = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
-                        new() { Text = "آکادمی بیت", Icon = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "رابط کاربری Blazor", ImageName = BitIconName.F12DevTools, Url = "https://blazorui.bitplatform.dev/" },
+                        new() { Text = "راه های هاست ابری", ImageName = BitIconName.Cloud, Url = "https://bitplatform.dev/#", IsEnabled = false },
+                        new() { Text = "آکادمی بیت", ImageName = BitIconName.LearningTools, Url = "https://bitplatform.dev/#", IsEnabled = false },
                     ]
                 },
-                new() { Text = "قیمت", Icon = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
-                new() { Text = "درباره ما", Icon = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
-                new() { Text = "ارتباط با ما", Icon = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
+                new() { Text = "قیمت", ImageName = BitIconName.Money, Url = "https://bitplatform.dev/pricing" },
+                new() { Text = "درباره ما", ImageName = BitIconName.Info, Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "ارتباط با ما", ImageName = BitIconName.Contact, Url = "https://bitplatform.dev/contact-us" },
             ],
         },
         new()
@@ -307,12 +332,12 @@ public partial class _BitNavCustomDemo
             Text = "انجمن ها",
             Links =
             [
-                new() { Text = "لینکدین", Icon = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
-                new() { Text = "توییتر", Icon = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
-                new() { Text = "گیتهاب", Icon = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
+                new() { Text = "لینکدین", ImageName = BitIconName.LinkedInLogo, Url = "https://www.linkedin.com/company/bitplatformhq" },
+                new() { Text = "توییتر", ImageName = BitIconName.Globe, Url = "https://twitter.com/bitplatformhq" },
+                new() { Text = "گیتهاب", ImageName = BitIconName.GitGraph, Url = "https://github.com/bitfoundation/bitplatform" },
             ]
         },
-        new() { Text = "شمایل نگاری", Icon = BitIconName.AppIconDefault, Url = "/iconography" },
+        new() { Text = "شمایل نگاری", ImageName = BitIconName.AppIconDefault, Url = "/iconography" },
     ];
 
     private bool iconOnly;
@@ -347,17 +372,18 @@ public partial class _BitNavCustomDemo
 
     private readonly string example1RazorCode = @"
 <BitNav Items=""customBasicNavItems""
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })"" />";
     private readonly string example1CsharpCode = @"
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
@@ -369,7 +395,7 @@ public class Section
         Comment = ""the bit platform description"",
         Links =
         [
-            new() { Text = ""Home"", Icon = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
+            new() { Text = ""Home"", ImageName = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
             new()
             {
                 Text = ""Products & Services"",
@@ -380,18 +406,18 @@ public class Section
                         Text = ""Project Templates"",
                         Links =
                         [
-                            new() { Text = ""Todo sample"", Icon = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
-                            new() { Text = ""AdminPanel sample"", Icon = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""Todo sample"", ImageName = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""AdminPanel sample"", ImageName = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
                         ]
                     },
-                    new() { Text = ""BlazorUI"", Icon = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
-                    new() { Text = ""Cloud hosting solutions"", Icon = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
-                    new() { Text = ""Bit academy"", Icon = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""BlazorUI"", ImageName = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Cloud hosting solutions"", ImageName = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""Bit academy"", ImageName = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
                 ]
             },
-            new() { Text = ""Pricing"", Icon = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
-            new() { Text = ""About"", Icon = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
-            new() { Text = ""Contact us"", Icon = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
+            new() { Text = ""Pricing"", ImageName = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
+            new() { Text = ""About"", ImageName = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", ImageName = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
         ],
     },
     new()
@@ -399,27 +425,28 @@ public class Section
         Text = ""Community"",
         Links =
         [
-            new() { Text = ""Linkedin"", Icon = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
-            new() { Text = ""Twitter"", Icon = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
-            new() { Text = ""Github repo"", Icon = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
+            new() { Text = ""Linkedin"", ImageName = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
+            new() { Text = ""Twitter"", ImageName = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
+            new() { Text = ""Github repo"", ImageName = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
         ]
     },
-    new() { Text = ""Iconography"", Icon = BitIconName.AppIconDefault, Url = ""/iconography"" },
+    new() { Text = ""Iconography"", ImageName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 
     private readonly string example2RazorCode = @"
 <BitNav Items=""customBasicNavItems"" FitWidth
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })"" />";
     private readonly string example2CsharpCode = @"
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
@@ -431,7 +458,7 @@ public class Section
         Comment = ""the bit platform description"",
         Links =
         [
-            new() { Text = ""Home"", Icon = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
+            new() { Text = ""Home"", ImageName = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
             new()
             {
                 Text = ""Products & Services"",
@@ -442,18 +469,18 @@ public class Section
                         Text = ""Project Templates"",
                         Links =
                         [
-                            new() { Text = ""Todo sample"", Icon = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
-                            new() { Text = ""AdminPanel sample"", Icon = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""Todo sample"", ImageName = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""AdminPanel sample"", ImageName = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
                         ]
                     },
-                    new() { Text = ""BlazorUI"", Icon = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
-                    new() { Text = ""Cloud hosting solutions"", Icon = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
-                    new() { Text = ""Bit academy"", Icon = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""BlazorUI"", ImageName = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Cloud hosting solutions"", ImageName = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""Bit academy"", ImageName = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
                 ]
             },
-            new() { Text = ""Pricing"", Icon = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
-            new() { Text = ""About"", Icon = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
-            new() { Text = ""Contact us"", Icon = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
+            new() { Text = ""Pricing"", ImageName = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
+            new() { Text = ""About"", ImageName = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", ImageName = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
         ],
     },
     new()
@@ -461,12 +488,12 @@ public class Section
         Text = ""Community"",
         Links =
         [
-            new() { Text = ""Linkedin"", Icon = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
-            new() { Text = ""Twitter"", Icon = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
-            new() { Text = ""Github repo"", Icon = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
+            new() { Text = ""Linkedin"", ImageName = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
+            new() { Text = ""Twitter"", ImageName = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
+            new() { Text = ""Github repo"", ImageName = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
         ]
     },
-    new() { Text = ""Iconography"", Icon = BitIconName.AppIconDefault, Url = ""/iconography"" },
+    new() { Text = ""Iconography"", ImageName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 
     private readonly string example3RazorCode = @"
@@ -491,6 +518,7 @@ public class CarMenu
     public string ExpandedAriaLabel { get; set; }
     public string CollapsedAriaLabel { get; set; }
     public bool IsExpandedParent { get; set; }
+    public string? Comment { get; set; }
     public List<CarMenu> Links { get; set; } = [];
 }
 
@@ -558,7 +586,7 @@ public class CarMenu
         Mode=""BitNavMode.Manual""
         DefaultSelectedItem=""customCarNavItems[0].Childs[2]""
         NameSelectors=""@(new() { Text =  { Selector = item => item.Name },
-                                 IconName =  { Selector = item => item.Icon },
+                                 IconName =  { Selector = item => item.Image },
                                  ChildItems =  { Selector = item => item.Childs },
                                  Description =  { Selector = item => item.Comment } })"" />
 
@@ -568,7 +596,7 @@ public class CarMenu
         Mode=""BitNavMode.Manual""
         DefaultSelectedItem=""customCarNavItems[0].Childs[2]""
         NameSelectors=""@(new() { Text =  { Selector = item => item.Name },
-                                 IconName =  { Selector = item => item.Icon },
+                                 IconName =  { Selector = item => item.Image },
                                  ChildItems =  { Selector = item => item.Childs },
                                  Description =  { Selector = item => item.Comment } })""
         OnSelectItem=""(FoodMenu item) => CustomSelectedFoodName = FoodMenuDropdownItems.Single(i => i.Text == item.Name).Text"" />
@@ -581,8 +609,9 @@ public class CarMenu
 public class FoodMenu
 {
     public string Name { get; set; } = string.Empty;
-    public string Icon { get; set; }
+    public string Image { get; set; }
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<FoodMenu> Childs { get; set; } = [];
 }
 
@@ -591,7 +620,7 @@ public class FoodMenu
     new()
     {
         Name = ""Fast foods"",
-        Icon = BitIconName.HeartBroken,
+        Image = BitIconName.HeartBroken,
         IsExpanded = true,
         Comment = ""List of fast foods"",
         Childs =
@@ -625,7 +654,7 @@ public class FoodMenu
     new()
     {
         Name = ""Fruits"",
-        Icon = BitIconName.Health,
+        Image = BitIconName.Health,
         Childs =
         [
             new() { Name = ""Apple"" },
@@ -662,7 +691,7 @@ public class FoodMenu
     private readonly string example5RazorCode = @"
 <BitToggle @bind-Value=""iconOnly"" Label=""Hide texts?"" Inline />
 <BitNav Items=""customIconOnlyNavItems"" Mode=""BitNavMode.Manual"" IconOnly=""iconOnly""
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })"" />";
     private readonly string example5CsharpCode = @"
@@ -671,30 +700,31 @@ public class FoodMenu
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
 private static readonly List<Section> customIconOnlyNavItems =
 [
-    new() { Text = ""Home"", Icon = BitIconName.Home },
+    new() { Text = ""Home"", ImageName = BitIconName.Home },
     new() {
         Text = ""AdminPanel sample"",
-        Icon = BitIconName.LocalAdmin,
+        ImageName = BitIconName.LocalAdmin,
         Links =
         [
-            new() { Text = ""Dashboard"", Icon = BitIconName.ViewDashboard },
-            new() { Text = ""Categories"", Icon = BitIconName.BuildQueue },
-            new() { Text = ""Products"", Icon = BitIconName.Product },
+            new() { Text = ""Dashboard"", ImageName = BitIconName.ViewDashboard },
+            new() { Text = ""Categories"", ImageName = BitIconName.BuildQueue },
+            new() { Text = ""Products"", ImageName = BitIconName.Product },
         ]
     },
-    new() { Text = ""Todo sample"", Icon = BitIconName.ToDoLogoOutline},
-    new() { Text = ""BlazorUI"", Icon = BitIconName.F12DevTools },
-    new() { Text = ""Bit academy"", Icon = BitIconName.LearningTools, IsEnabled = false },
-    new() { Text = ""Contact us"", Icon = BitIconName.Contact },
+    new() { Text = ""Todo sample"", ImageName = BitIconName.ToDoLogoOutline},
+    new() { Text = ""BlazorUI"", ImageName = BitIconName.F12DevTools },
+    new() { Text = ""Bit academy"", ImageName = BitIconName.LearningTools, IsEnabled = false },
+    new() { Text = ""Contact us"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example6RazorCode = @"
@@ -736,10 +766,10 @@ public class Section
 
 
 
-<BitNav Items=""customCarNavItems""
+<BitNav Items=""customFoodNavItems""
         Mode=""BitNavMode.Manual""
         NameSelectors=""@(new() { Text =  { Selector = item => item.Name },
-                                 IconName =  { Selector = item => item.Icon },
+                                 IconName =  { Selector = item => item.Image },
                                  ChildItems =  { Selector = item => item.Childs },
                                  Description =  { Selector = item => item.Comment } })"">
     <ItemTemplate Context=""item"">
@@ -760,14 +790,16 @@ public class CarMenu
     public string ExpandedAriaLabel { get; set; }
     public string CollapsedAriaLabel { get; set; }
     public bool IsExpandedParent { get; set; }
+    public string? Comment { get; set; }
     public List<CarMenu> Links { get; set; } = [];
 }
 
 public class FoodMenu
 {
     public string Name { get; set; } = string.Empty;
-    public string Icon { get; set; }
+    public string Image { get; set; }
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<FoodMenu> Childs { get; set; } = [];
 }
 
@@ -830,12 +862,12 @@ public class FoodMenu
     },
 ];
 
-private static readonly List<FoodMenu> customCarNavItems =
+private static readonly List<FoodMenu> customFoodNavItems =
 [
     new()
     {
         Name = ""Fast foods"",
-        Icon = BitIconName.HeartBroken,
+        Image = BitIconName.HeartBroken,
         IsExpanded = true,
         Comment = ""List of fast foods"",
         Childs =
@@ -869,7 +901,7 @@ public class FoodMenu
     new()
     {
         Name = ""Fruits"",
-        Icon = BitIconName.Health,
+        Image = BitIconName.Health,
         Childs =
         [
             new() { Name = ""Apple"" },
@@ -882,13 +914,13 @@ public class FoodMenu
 ];";
 
     private readonly string example7RazorCode = @"
-<BitNav Items=""customCarNavItems""
+<BitNav Items=""customFoodNavItems""
         Mode=""BitNavMode.Manual""
         OnItemClick=""(FoodMenu item) => CustomClickedItem = item""
         OnSelectItem=""(FoodMenu item) => CustomSelectedItem = item""
         OnItemToggle=""(FoodMenu item) => CustomToggledItem = item""
         NameSelectors=""@(new() { Text =  { Selector = item => item.Name },
-                                 IconName =  { Selector = item => item.Icon },
+                                 IconName =  { Selector = item => item.Image },
                                  ChildItems =  { Selector = item => item.Childs },
                                  Description =  { Selector = item => item.Comment } })"" />
 <div>Clicked Item: @CustomClickedItem?.Name</div>
@@ -898,8 +930,9 @@ public class FoodMenu
 public class FoodMenu
 {
     public string Name { get; set; } = string.Empty;
-    public string Icon { get; set; }
+    public string Image { get; set; }
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<FoodMenu> Childs { get; set; } = [];
 }
 
@@ -908,7 +941,7 @@ public class FoodMenu
     new()
     {
         Name = ""Fast foods"",
-        Icon = BitIconName.HeartBroken,
+        Image = BitIconName.HeartBroken,
         IsExpanded = true,
         Comment = ""List of fast foods"",
         Childs =
@@ -942,7 +975,7 @@ public class FoodMenu
     new()
     {
         Name = ""Fruits"",
-        Icon = BitIconName.Health,
+        Image = BitIconName.Health,
         Childs =
         [
             new() { Name = ""Apple"" },
@@ -961,17 +994,18 @@ public class FoodMenu
     private readonly string example8RazorCode = @"
 <BitNav AllExpanded NoCollapse
         Items=""customBasicNavItems""
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })"" />";
     private readonly string example8CsharpCode = @"
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
@@ -983,7 +1017,7 @@ public class Section
         Comment = ""the bit platform description"",
         Links =
         [
-            new() { Text = ""Home"", Icon = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
+            new() { Text = ""Home"", ImageName = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
             new()
             {
                 Text = ""Products & Services"",
@@ -994,18 +1028,18 @@ public class Section
                         Text = ""Project Templates"",
                         Links =
                         [
-                            new() { Text = ""Todo sample"", Icon = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
-                            new() { Text = ""AdminPanel sample"", Icon = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""Todo sample"", ImageName = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""AdminPanel sample"", ImageName = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
                         ]
                     },
-                    new() { Text = ""BlazorUI"", Icon = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
-                    new() { Text = ""Cloud hosting solutions"", Icon = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
-                    new() { Text = ""Bit academy"", Icon = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""BlazorUI"", ImageName = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Cloud hosting solutions"", ImageName = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""Bit academy"", ImageName = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
                 ]
             },
-            new() { Text = ""Pricing"", Icon = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
-            new() { Text = ""About"", Icon = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
-            new() { Text = ""Contact us"", Icon = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
+            new() { Text = ""Pricing"", ImageName = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
+            new() { Text = ""About"", ImageName = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", ImageName = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
         ],
     },
     new()
@@ -1013,31 +1047,78 @@ public class Section
         Text = ""Community"",
         Links =
         [
-            new() { Text = ""Linkedin"", Icon = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
-            new() { Text = ""Twitter"", Icon = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
-            new() { Text = ""Github repo"", Icon = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
+            new() { Text = ""Linkedin"", ImageName = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
+            new() { Text = ""Twitter"", ImageName = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
+            new() { Text = ""Github repo"", ImageName = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
         ]
     },
-    new() { Text = ""Iconography"", Icon = BitIconName.AppIconDefault, Url = ""/iconography"" },
+    new() { Text = ""Iconography"", ImageName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 
     private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNav Items=""customExternalIconNavItems""
+        NameSelectors=""@(new() { Text =  { Name = nameof(Section.Text) },
+                                 Icon =  { Name = nameof(Section.ImageName) },
+                                 Url =  { Name = nameof(Section.Url) },
+                                 ChildItems =  { Name = nameof(Section.Links) },
+                                 Description =  { Name = nameof(Section.Comment) } })"" />";
+    private readonly string example9CsharpCode = @"
+public class Section
+{
+    public string Text { get; set; } = string.Empty;
+    public string? ImageName { get; set; }
+    public string? Url { get; set; }
+    public bool IsEnabled { get; set; } = true;
+    public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
+    public List<Section> Links { get; set; } = [];
+}
+
+private static readonly List<Section> customExternalIconNavItems =
+[
+    new()
+    {
+        Text = ""bit platform"",
+        Comment = ""Nav with external icons (FontAwesome)"",
+        Links =
+        [
+            new() { Text = ""Home"", ImageName = BitIconInfo.Css(""fa-solid fa-house""), Url = ""https://bitplatform.dev/"" },
+            new()
+            {
+                Text = ""Products & Services"",
+                Links =
+                [
+                    new() { Text = ""BlazorUI"", ImageName = BitIconInfo.Fa(""solid code""), Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Pricing"", ImageName = BitIconInfo.Css(""fa-solid fa-tag""), Url = ""https://bitplatform.dev/pricing"" },
+                ]
+            },
+            new() { Text = ""About"", ImageName = BitIconInfo.Fa(""solid circle-info""), Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", ImageName = BitIconInfo.Css(""fa-solid fa-envelope""), Url = ""https://bitplatform.dev/contact-us"" },
+        ],
+    },
+    new() { Text = ""Iconography"", ImageName = BitIconInfo.Css(""fa-solid fa-icons""), Url = ""/iconography"" },
+];";
+
+    private readonly string example10RazorCode = @"
 <BitNav Items=""customCustomStyleNavItems""
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })""
         Styles=""@(new() { ItemContainer = ""border: 1px solid green; margin: 2px;"",
                           ToggleButton = ""color: cyan;"",
                           Item = ""color: red;"",
                           ItemIcon = ""color: gold; margin-right: 15px;"" })"" />";
-    private readonly string example9CsharpCode = @"
+    private readonly string example10CsharpCode = @"
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
@@ -1049,7 +1130,7 @@ public class Section
         Comment = ""the bit platform description"",
         Links =
         [
-            new() { Text = ""Home"", Icon = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
+            new() { Text = ""Home"", ImageName = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
             new()
             {
                 Text = ""Products & Services"",
@@ -1060,18 +1141,18 @@ public class Section
                         Text = ""Project Templates"",
                         Links =
                         [
-                            new() { Text = ""Todo sample"", Icon = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
-                            new() { Text = ""AdminPanel sample"", Icon = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""Todo sample"", ImageName = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""AdminPanel sample"", ImageName = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
                         ]
                     },
-                    new() { Text = ""BlazorUI"", Icon = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
-                    new() { Text = ""Cloud hosting solutions"", Icon = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
-                    new() { Text = ""Bit academy"", Icon = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""BlazorUI"", ImageName = BitIconName.F12DevTools, Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Cloud hosting solutions"", ImageName = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""Bit academy"", ImageName = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
                 ]
             },
-            new() { Text = ""Pricing"", Icon = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
-            new() { Text = ""About"", Icon = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
-            new() { Text = ""Contact us"", Icon = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
+            new() { Text = ""Pricing"", ImageName = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
+            new() { Text = ""About"", ImageName = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", ImageName = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
         ],
     },
     new()
@@ -1079,28 +1160,29 @@ public class Section
         Text = ""Community"",
         Links =
         [
-            new() { Text = ""Linkedin"", Icon = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
-            new() { Text = ""Twitter"", Icon = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
-            new() { Text = ""Github repo"", Icon = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
+            new() { Text = ""Linkedin"", ImageName = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
+            new() { Text = ""Twitter"", ImageName = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
+            new() { Text = ""Github repo"", ImageName = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
         ]
     },
-    new() { Text = ""Iconography"", Icon = BitIconName.AppIconDefault, Url = ""/iconography"" },
+    new() { Text = ""Iconography"", ImageName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 
-    private readonly string example10RazorCode = @"
+    private readonly string example11RazorCode = @"
 <BitNav Dir=""BitDir.Rtl""
         Items=""customRtlNavItems""
-        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.Icon) },
+        NameSelectors=""@(new() { IconName =  { Name = nameof(Section.ImageName) },
                                  ChildItems =  { Name = nameof(Section.Links) },
                                  Description =  { Name = nameof(Section.Comment) } })"" />";
-    private readonly string example10CsharpCode = @"
+    private readonly string example11CsharpCode = @"
 public class Section
 {
     public string Text { get; set; } = string.Empty;
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? Url { get; set; }
     public bool IsEnabled { get; set; } = true;
     public bool IsExpanded { get; set; }
+    public string? Comment { get; set; }
     public List<Section> Links { get; set; } = [];
 }
 
@@ -1112,7 +1194,7 @@ public class Section
         Comment = ""توضیحاتِ پلتفرمِ بیت"",
         Links =
         [
-            new() { Text = ""خانه"", Icon = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
+            new() { Text = ""خانه"", ImageName = BitIconName.Home, Url = ""https://bitplatform.dev/"" },
             new()
             {
                 Text = ""محصولات و خدمات"",
@@ -1123,18 +1205,18 @@ public class Section
                         Text = ""قالب های پروژه"",
                         Links =
                         [
-                            new() { Text = ""نمونه ی Todo"", Icon = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
-                            new() { Text = ""نمونه ی AdminPanel"", Icon = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""نمونه ی Todo"", ImageName = BitIconName.ToDoLogoOutline, Url = ""https://bitplatform.dev/templates/overview"" },
+                            new() { Text = ""نمونه ی AdminPanel"", ImageName = BitIconName.LocalAdmin, Url = ""https://bitplatform.dev/templates/overview"" },
                         ]
                     },
-                    new() { Text = ""رابط کاربری Blazor"", Icon = BitIconName.F12DevTools, Url = ""https://blazorui.bitplatform.dev/"" },
-                    new() { Text = ""راه های هاست ابری"", Icon = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
-                    new() { Text = ""آکادمی بیت"", Icon = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""رابط کاربری Blazor"", ImageName = BitIconName.F12DevTools, Url = ""https://blazorui.bitplatform.dev/"" },
+                    new() { Text = ""راه های هاست ابری"", ImageName = BitIconName.Cloud, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
+                    new() { Text = ""آکادمی بیت"", ImageName = BitIconName.LearningTools, Url = ""https://bitplatform.dev/#"", IsEnabled = false },
                 ]
             },
-            new() { Text = ""قیمت"", Icon = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
-            new() { Text = ""درباره ما"", Icon = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
-            new() { Text = ""ارتباط با ما"", Icon = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
+            new() { Text = ""قیمت"", ImageName = BitIconName.Money, Url = ""https://bitplatform.dev/pricing"" },
+            new() { Text = ""درباره ما"", ImageName = BitIconName.Info, Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""ارتباط با ما"", ImageName = BitIconName.Contact, Url = ""https://bitplatform.dev/contact-us"" },
         ],
     },
     new()
@@ -1142,11 +1224,11 @@ public class Section
         Text = ""انجمن ها"",
         Links =
         [
-            new() { Text = ""لینکدین"", Icon = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
-            new() { Text = ""توییتر"", Icon = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
-            new() { Text = ""گیتهاب"", Icon = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
+            new() { Text = ""لینکدین"", ImageName = BitIconName.LinkedInLogo, Url = ""https://www.linkedin.com/company/bitplatformhq"" },
+            new() { Text = ""توییتر"", ImageName = BitIconName.Globe, Url = ""https://twitter.com/bitplatformhq"" },
+            new() { Text = ""گیتهاب"", ImageName = BitIconName.GitGraph, Url = ""https://github.com/bitfoundation/bitplatform"" },
         ]
     },
-    new() { Text = ""شمایل نگاری"", Icon = BitIconName.AppIconDefault, Url = ""/iconography"" },
+    new() { Text = ""شمایل نگاری"", ImageName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor
index 1212198628..ec601a6c8f 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <BitNav Items="basicNavItems" />
 </DemoExample>
 
@@ -80,6 +80,18 @@
     <BitNav Items="noCollapseNavItems" AllExpanded NoCollapse />
 </DemoExample>
 
+<DemoExample Title="External Icons" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+    <div>
+        Use icons from external libraries like FontAwesome with the <BitLink Href="#bit-icon-info">Icon</BitLink> parameter 
+        (<BitLink Href="#nav-item">BitNavItem</BitLink>.<BitLink Href="#bit-icon-info">Icon</BitLink>). 
+        See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage. 
+        Built-in Fluent UI icons use <BitLink Href="#nav-item">IconName</BitLink>.
+    </div>
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <BitNav Items="externalIconNavItems" />
+</DemoExample>
+
 <DemoExample Title="Custom Styles" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
     <BitNav Items="customStyleNavItems"
             Styles="@(new() { ItemContainer = "border: 1px solid green; margin: 2px;",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor.cs
index 5790364bb4..6699c9ed89 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Nav;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Nav;
 
 public partial class _BitNavItemDemo
 {
@@ -177,6 +177,31 @@ public partial class _BitNavItemDemo
         new() { Text = "Cookie" },
     ];
 
+    private static readonly List<BitNavItem> externalIconNavItems =
+    [
+        new()
+        {
+            Text = "bit platform",
+            Description = "Nav with external icons (FontAwesome)",
+            ChildItems =
+            [
+                new() { Text = "Home", Icon = BitIconInfo.Css("fa-solid fa-house"), Url = "https://bitplatform.dev/" },
+                new()
+                {
+                    Text = "Products & Services",
+                    ChildItems =
+                    [
+                        new() { Text = "BlazorUI", Icon = BitIconInfo.Fa("solid code"), Url = "https://bitplatform.dev/components" },
+                        new() { Text = "Pricing", Icon = BitIconInfo.Css("fa-solid fa-tag"), Url = "https://bitplatform.dev/pricing" },
+                    ]
+                },
+                new() { Text = "About", Icon = BitIconInfo.Fa("solid circle-info"), Url = "https://bitplatform.dev/about-us" },
+                new() { Text = "Contact us", Icon = BitIconInfo.Css("fa-solid fa-envelope"), Url = "https://bitplatform.dev/contact-us" },
+            ],
+        },
+        new() { Text = "Iconography", Icon = BitIconInfo.Css("fa-solid fa-icons"), Url = "/iconography" },
+    ];
+
     private static readonly List<BitNavItem> noCollapseNavItems =
     [
         new()
@@ -940,6 +965,36 @@ public partial class _BitNavItemDemo
     new() { Text = ""Iconography"", IconName = BitIconName.AppIconDefault, Url = ""/iconography"" },
 ];";
 
+    private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNav Items=""externalIconNavItems"" />";
+    private readonly string example11CsharpCode = @"
+private static readonly List<BitNavItem> externalIconNavItems =
+[
+    new()
+    {
+        Text = ""bit platform"",
+        Description = ""Nav with external icons (FontAwesome)"",
+        ChildItems =
+        [
+            new() { Text = ""Home"", Icon = BitIconInfo.Css(""fa-solid fa-house""), Url = ""https://bitplatform.dev/"" },
+            new()
+            {
+                Text = ""Products & Services"",
+                ChildItems =
+                [
+                    new() { Text = ""BlazorUI"", Icon = BitIconInfo.Fa(""solid code""), Url = ""https://bitplatform.dev/components"" },
+                    new() { Text = ""Pricing"", Icon = BitIconInfo.Css(""fa-solid fa-tag""), Url = ""https://bitplatform.dev/pricing"" },
+                ]
+            },
+            new() { Text = ""About"", Icon = BitIconInfo.Fa(""solid circle-info""), Url = ""https://bitplatform.dev/about-us"" },
+            new() { Text = ""Contact us"", Icon = BitIconInfo.Css(""fa-solid fa-envelope""), Url = ""https://bitplatform.dev/contact-us"" },
+        ],
+    },
+    new() { Text = ""Iconography"", Icon = BitIconInfo.Css(""fa-solid fa-icons""), Url = ""/iconography"" },
+];";
+
     private readonly string example9RazorCode = @"
 <BitNav Items=""customStyleNavItems""
         Styles=""@(new() { ItemContainer = ""border: 1px solid green; margin: 2px;"",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor
index 194f889fa9..ddd7f7158f 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
     <BitNav TItem="BitNavOption">
         <BitNavOption Text="bit platform"
                       Description="the bit platform description"
@@ -327,7 +327,25 @@
     </BitNav>
 </DemoExample>
 
-<DemoExample Title="Custom Styles" RazorCode="@example9RazorCode" Id="example9">
+<DemoExample Title="External Icons" RazorCode="@example9RazorCode" Id="example9">
+    <div>Use icons from external libraries like FontAwesome with the <BitLink Href="#bit-icon-info">Icon</BitLink> parameter (<BitLink Href="#nav-option">BitNavOption</BitLink>.<BitLink Href="#bit-icon-info">Icon</BitLink>). See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage. Built-in Fluent UI icons use <BitLink Href="#nav-option">IconName</BitLink>.</div>
+    <br />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+    <BitNav TItem="BitNavOption">
+        <BitNavOption Text="bit platform" Description="Nav with external icons (FontAwesome)">
+            <BitNavOption Text="Home" Icon="@BitIconInfo.Css("fa-solid fa-house")" Url="https://bitplatform.dev/" Target="_blank" />
+            <BitNavOption Text="Products & Services">
+                <BitNavOption Text="BlazorUI" Icon="@BitIconInfo.Fa("solid code")" Url="https://bitplatform.dev/components" Target="_blank" />
+                <BitNavOption Text="Pricing" Icon="@BitIconInfo.Css("fa-solid fa-tag")" Url="https://bitplatform.dev/pricing" Target="_blank" />
+            </BitNavOption>
+            <BitNavOption Text="About" Icon="@BitIconInfo.Fa("solid circle-info")" Url="https://bitplatform.dev/about-us" Target="_blank" />
+            <BitNavOption Text="Contact us" Icon="@BitIconInfo.Css("fa-solid fa-envelope")" Url="https://bitplatform.dev/contact-us" Target="_blank" />
+        </BitNavOption>
+        <BitNavOption Text="Iconography" Icon="@BitIconInfo.Css("fa-solid fa-icons")" Url="/iconography" Target="_blank" />
+    </BitNav>
+</DemoExample>
+
+<DemoExample Title="Custom Styles" RazorCode="@example10RazorCode" Id="example10">
     <BitNav TItem="BitNavOption"
             Styles="@(new() { ItemContainer = "border: 1px solid green; margin: 2px;",
                                   ToggleButton = "color: cyan;",
@@ -362,7 +380,7 @@
     </BitNav>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example10RazorCode" Id="example10">
+<DemoExample Title="RTL" RazorCode="@example11RazorCode" Id="example11">
     <div dir="rtl">
         <BitNav Dir="BitDir.Rtl" TItem="BitNavOption">
             <BitNavOption Text="پلتفرمِ بیت" Description="توضیحاتِ پلتفرمِ بیت">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor.cs
index 271113c076..a67d2d7ec7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Nav/_BitNavOptionDemo.razor.cs
@@ -360,6 +360,22 @@ public partial class _BitNavOptionDemo
 </BitNav>";
 
     private readonly string example9RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNav TItem=""BitNavOption"">
+    <BitNavOption Text=""bit platform"" Description=""Nav with external icons (FontAwesome)"">
+        <BitNavOption Text=""Home"" Icon=""@BitIconInfo.Css(""fa-solid fa-house"")"" Url=""https://bitplatform.dev/"" Target=""_blank"" />
+        <BitNavOption Text=""Products & Services"">
+            <BitNavOption Text=""BlazorUI"" Icon=""@BitIconInfo.Fa(""solid code"")"" Url=""https://bitplatform.dev/components"" Target=""_blank"" />
+            <BitNavOption Text=""Pricing"" Icon=""@BitIconInfo.Css(""fa-solid fa-tag"")"" Url=""https://bitplatform.dev/pricing"" Target=""_blank"" />
+        </BitNavOption>
+        <BitNavOption Text=""About"" Icon=""@BitIconInfo.Fa(""solid circle-info"")"" Url=""https://bitplatform.dev/about-us"" Target=""_blank"" />
+        <BitNavOption Text=""Contact us"" Icon=""@BitIconInfo.Css(""fa-solid fa-envelope"")"" Url=""https://bitplatform.dev/contact-us"" Target=""_blank"" />
+    </BitNavOption>
+    <BitNavOption Text=""Iconography"" Icon=""@BitIconInfo.Css(""fa-solid fa-icons"")"" Url=""/iconography"" Target=""_blank"" />
+</BitNav>";
+
+    private readonly string example10RazorCode = @"
 <BitNav TItem=""BitNavOption""
         Styles=""@(new() { ItemContainer = ""border: 1px solid green; margin: 2px;"",
                           ToggleButton = ""color: cyan;"",
@@ -392,7 +408,7 @@ public partial class _BitNavOptionDemo
     <BitNavOption Text=""Iconography"" IconName=""@BitIconName.AppIconDefault"" Url=""/iconography"" Target=""_blank"" />
 </BitNav>";
 
-    private readonly string example10RazorCode = @"
+    private readonly string example11RazorCode = @"
 <BitNav Dir=""BitDir.Rtl"" TItem=""BitNavOption"">
     <BitNavOption Text=""پلتفرمِ بیت"" Description=""توضیحاتِ پلتفرمِ بیت"">
         <BitNavOption Text=""خانه"" IconName=""@BitIconName.Home"" Url=""https://bitplatform.dev/"" Target=""_blank"" />

From 0b657fc32866897c5395b52bbc6a59cbe9d34a42 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 22 Feb 2026 14:47:59 +0330
Subject: [PATCH 18/66] feat(blazorui): add new Icon parameters to BitNavBar
 #12111 (#12112)

---
 .../Components/Navs/NavBar/BitNavBar.razor    |  13 +-
 .../Components/Navs/NavBar/BitNavBar.razor.cs |  24 +-
 .../Components/Navs/NavBar/BitNavBarItem.cs   |  24 +-
 .../Navs/NavBar/BitNavBarNameSelectors.cs     |   9 +-
 .../Components/Navs/NavBar/BitNavBarOption.cs |  24 +-
 .../Navs/NavBar/BitNavBarDemo.razor.cs        |  64 ++++-
 .../Pages/Components/Navs/NavBar/MenuItem.cs  |   3 +-
 .../Navs/NavBar/_BitNavBarCustomDemo.razor    | 103 ++++---
 .../Navs/NavBar/_BitNavBarCustomDemo.razor.cs |  40 +--
 .../_BitNavBarCustomDemo.razor.samples.cs     | 254 ++++++++++--------
 .../Navs/NavBar/_BitNavBarItemDemo.razor      |  19 +-
 .../Navs/NavBar/_BitNavBarItemDemo.razor.cs   |  10 +-
 .../_BitNavBarItemDemo.razor.samples.cs       |  22 +-
 .../Navs/NavBar/_BitNavBarOptionDemo.razor    |  24 +-
 .../_BitNavBarOptionDemo.razor.samples.cs     |  15 +-
 15 files changed, 446 insertions(+), 202 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor
index 5eee9d83fa..68aac3dd4a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 @typeparam TItem
 
@@ -41,7 +41,16 @@
                 }
                 else
                 {
-                    <i style="@Styles?.ItemIcon" class="bit-nbr-ico bit-icon bit-icon--@GetIconName(item) @Classes?.ItemIcon" />
+                    var icon = GetIcon(item);
+                    var iconName = GetIconName(item);
+
+                    icon = BitIconInfo.From(icon, iconName);
+
+                    @if (icon is not null)
+                    {
+                        <i style="@Styles?.ItemIcon" class="bit-nbr-ico @icon.GetCssClasses() @Classes?.ItemIcon" />
+                    }
+
                     @if (IconOnly is false)
                     {
                         <span style="@Styles?.ItemText" class="bit-nbr-txt @Classes?.ItemText">@GetText(item)</span>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor.cs
index 4953681af4..ad7742ec35 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBar.razor.cs
@@ -80,7 +80,7 @@ public partial class BitNavBar<TItem> : BitComponentBase where TItem : class
     /// <summary>
     /// Names and selectors of the custom input type properties.
     /// </summary>
-    [Parameter] public BitNavNameSelectors<TItem>? NameSelectors { get; set; }
+    [Parameter] public BitNavBarNameSelectors<TItem>? NameSelectors { get; set; }
 
     /// <summary>
     /// Callback invoked when an item is clicked.
@@ -304,6 +304,28 @@ private string GetItemCssClass(TItem item, bool isEnabled)
         return item.GetValueFromProperty<string?>(NameSelectors.Class.Name);
     }
 
+    private BitIconInfo? GetIcon(TItem item)
+    {
+        if (item is BitNavBarItem navItem)
+        {
+            return navItem.Icon;
+        }
+
+        if (item is BitNavBarOption navOption)
+        {
+            return navOption.Icon;
+        }
+
+        if (NameSelectors is null) return null;
+
+        if (NameSelectors.Icon.Selector is not null)
+        {
+            return NameSelectors.Icon.Selector!(item);
+        }
+
+        return item.GetValueFromProperty<BitIconInfo?>(NameSelectors.Icon.Name);
+    }
+
     private string? GetIconName(TItem item)
     {
         if (item is BitNavBarItem navItem)
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarItem.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarItem.cs
index 9794c9aa7c..809e0a6c8a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarItem.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarItem.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitNavBarItem
 {
@@ -13,8 +13,28 @@ public class BitNavBarItem
     public object? Data { get; set; }
 
     /// <summary>
-    /// Name of an icon to render next to the navbar item.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// FontAwesome: Icon = BitIconInfo.Fa("solid house")
+    /// Bootstrap: Icon = BitIconInfo.Bi("gear-fill")
+    /// Custom CSS: Icon = BitIconInfo.Css("my-icon-class")
+    /// </example>
+    public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Home</c>).
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     public string? IconName { get; set; }
 
     /// <summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarNameSelectors.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarNameSelectors.cs
index 3f245993aa..934cd8fa5d 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarNameSelectors.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarNameSelectors.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitNavBarNameSelectors<TItem>
 {
@@ -12,8 +12,15 @@ public class BitNavBarNameSelectors<TItem>
     /// </summary>
     public BitNameSelectorPair<TItem, object?> Data { get; set; } = new(nameof(BitNavBarItem.Data));
 
+    /// <summary>
+    /// The Icon field name and selector of the custom input class.
+    /// Maps to <see cref="BitNavBarItem.Icon"/> for external icon libraries.
+    /// </summary>
+    public BitNameSelectorPair<TItem, BitIconInfo?> Icon { get; set; } = new(nameof(BitNavBarItem.Icon));
+
     /// <summary>
     /// The IconName field name and selector of the custom input class.
+    /// Maps to <see cref="BitNavBarItem.IconName"/> for built-in Fluent UI icons.
     /// </summary>
     public BitNameSelectorPair<TItem, string?> IconName { get; set; } = new(nameof(BitNavBarItem.IconName));
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarOption.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarOption.cs
index a9993528e9..b4c63bb15e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarOption.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/NavBar/BitNavBarOption.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitNavBarOption : ComponentBase, IDisposable
 {
@@ -21,8 +21,28 @@ public partial class BitNavBarOption : ComponentBase, IDisposable
     [Parameter] public object? Data { get; set; }
 
     /// <summary>
-    /// Name of an icon to render next to the navbar option.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// FontAwesome: Icon=BitIconInfo.Fa("solid house")
+    /// Bootstrap: Icon=BitIconInfo.Bi("gear-fill")
+    /// Custom CSS: Icon=BitIconInfo.Css("my-icon-class")
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Home</c>).
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/BitNavBarDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/BitNavBarDemo.razor.cs
index a18bee5b17..524ab075f0 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/BitNavBarDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/BitNavBarDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
 
 public partial class BitNavBarDemo
 {
@@ -156,11 +156,20 @@ public partial class BitNavBarDemo
                    Description = "The custom data for the navbar item to provide additional state.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Name of an icon to render next to the navbar item.",
+                   Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
                },
                new()
                {
@@ -248,11 +257,20 @@ public partial class BitNavBarDemo
                    Description = "The custom data for the navbar option to provide additional state.",
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitIconInfo?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Name of an icon to render next to the navbar option.",
+                   Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
                },
                new()
                {
@@ -340,11 +358,20 @@ public partial class BitNavBarDemo
                    Description = "The Data field name and selector of the custom input class."
                },
                new()
+               {
+                   Name = "Icon",
+                   Type = "BitNameSelectorPair<TItem, BitIconInfo?>",
+                   DefaultValue = "new(nameof(BitNavBarItem.Icon))",
+                   Description = "The Icon field name and selector of the custom input class. Maps to Icon for external icon libraries.",
+                   LinkType = LinkType.Link,
+                   Href = "#bit-icon-info",
+               },
+               new()
                {
                    Name = "IconName",
                    Type = "BitNameSelectorPair<TItem, string?>",
                    DefaultValue = "new(nameof(BitNavBarItem.IconName))",
-                   Description = "The IconName field name and selector of the custom input class."
+                   Description = "The IconName field name and selector of the custom input class. Maps to IconName for built-in Fluent UI icons."
                },
                new()
                {
@@ -412,6 +439,35 @@ public partial class BitNavBarDemo
             ]
         },
         new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
+        new()
         {
             Id = "class-styles",
             Title = "BitNavBarClassStyles",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/MenuItem.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/MenuItem.cs
index bd9405efe7..42e9bb6ef7 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/MenuItem.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/MenuItem.cs
@@ -3,7 +3,8 @@
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
+    public BitIconInfo? Image { get; set; }
     public RenderFragment<MenuItem>? Fragment { get; set; }
     public string? CssClass { get; set; }
     public string? Style { get; set; }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor
index e70c07cb38..bfdad16d69 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor
@@ -1,8 +1,8 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="container">
         <BitNavBar Items="basicNavBarCustoms"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
@@ -11,14 +11,14 @@
     <div class="container">
         <BitNavBar Items="basicNavBarCustoms" IsEnabled="false"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Disabled item:</div><br />
     <div class="container">
         <BitNavBar Items="basicNavBarCustomsDisabled"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon },
+                                            IconName = { Selector = item => item.ImageName },
                                             IsEnabled = { Selector = item => item.Disabled is false } })" />
     </div>
 </DemoExample>
@@ -31,7 +31,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
@@ -42,7 +42,7 @@
         <BitNavBar IconOnly
                    Items="basicNavBarCustoms"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
@@ -53,7 +53,7 @@
         <BitNavBar FitWidth
                    Items="basicNavBarCustoms"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
@@ -64,10 +64,10 @@
     <div class="container">
         <BitNavBar Items="basicNavBarCustoms"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })">
+                                            IconName = { Selector = item => item.ImageName } })">
             <ItemTemplate Context="custom">
                 <BitText Typography="BitTypography.Caption1" Color="BitColor.Warning">@custom.Title</BitText>
-                <BitIcon IconName="@custom.Icon" Color="BitColor.Success" />
+                <BitIcon IconName="@custom.ImageName" Color="BitColor.Success" />
             </ItemTemplate>
         </BitNavBar>
     </div>
@@ -76,7 +76,7 @@
     <div class="container">
         <BitNavBar Items="templateNavBarCustoms"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon },
+                                            IconName = { Selector = item => item.ImageName },
                                             Template = { Selector = item => item.Fragment } })" />
     </div>
 </DemoExample>
@@ -88,7 +88,7 @@
         <BitNavBar Items="basicNavBarCustoms"
                    OnItemClick="(MenuItem item) => eventsClickedItem = item"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br />
     Clicked item: @eventsClickedItem?.Title
@@ -104,7 +104,7 @@
                    Mode="BitNavMode.Manual"
                    DefaultSelectedItem="basicNavBarCustoms[1]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br />
     Selected item: @selectedItem.Title
@@ -115,7 +115,7 @@
                    Mode="BitNavMode.Manual"
                    @bind-SelectedItem="twoWaySelectedItem"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br />
     <BitChoiceGroup Horizontal Items="@choiceGroupItems" @bind-Value="@twoWaySelectedItem" />
@@ -132,7 +132,7 @@
                    Reselectable="reselectable"
                    OnItemClick="(MenuItem item) => countClick++"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br />
     Item click count: @countClick
@@ -155,7 +155,7 @@
             </BitSticky>
             <BitStack Alignment="BitAlignment.Center" AutoHeight Grows>
                 <BitText Typography="BitTypography.H4" Color="BitColor.PrimaryForeground">
-                    <BitIcon IconName="@advancedSelectedItem?.Icon" Color="BitColor.PrimaryForeground" Size="BitSize.Large" />
+                    <BitIcon IconName="@advancedSelectedItem?.ImageName" Color="BitColor.PrimaryForeground" Size="BitSize.Large" />
                     <span>@advancedSelectedItem?.Title</span>
                 </BitText>
             </BitStack>
@@ -165,7 +165,7 @@
                                Items="basicNavBarCustoms"
                                @bind-SelectedItem="advancedSelectedItem"
                                NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                                        IconName = { Selector = item => item.Icon } })" />
+                                                        IconName = { Selector = item => item.ImageName } })" />
                 </BitCard>
             </BitSticky>
         </div>
@@ -182,7 +182,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Secondary:</div><br />
@@ -192,7 +192,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Tertiary:</div><br />
@@ -202,7 +202,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Info:</div><br />
@@ -212,7 +212,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Success:</div><br />
@@ -222,7 +222,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Warning:</div><br />
@@ -232,7 +232,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>SevereWarning:</div><br />
@@ -242,7 +242,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Error:</div><br />
@@ -252,7 +252,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div style="background:var(--bit-clr-fg-sec);padding:1rem">
@@ -263,7 +263,7 @@
                        Items="basicNavBarCustoms"
                        DefaultSelectedItem="basicNavBarCustoms[0]"
                        NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                                IconName = { Selector = item => item.Icon } })" />
+                                                IconName = { Selector = item => item.ImageName } })" />
         </div>
         <br /><br /><br /><br />
         <div style="color:var(--bit-clr-bg-sec)">SecondaryBackground:</div><br />
@@ -273,7 +273,7 @@
                        Items="basicNavBarCustoms"
                        DefaultSelectedItem="basicNavBarCustoms[0]"
                        NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                                IconName = { Selector = item => item.Icon } })" />
+                                                IconName = { Selector = item => item.ImageName } })" />
         </div>
         <br /><br /><br /><br />
         <div style="color:var(--bit-clr-bg-ter)">TertiaryBackground:</div><br />
@@ -283,7 +283,7 @@
                        Items="basicNavBarCustoms"
                        DefaultSelectedItem="basicNavBarCustoms[0]"
                        NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                                IconName = { Selector = item => item.Icon } })" />
+                                                IconName = { Selector = item => item.ImageName } })" />
         </div>
     </div>
     <br /><br /><br /><br />
@@ -294,7 +294,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>SecondaryForeground:</div><br />
@@ -304,7 +304,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>TertiaryForeground:</div><br />
@@ -314,7 +314,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>PrimaryBorder:</div><br />
@@ -324,7 +324,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>SecondaryBorder:</div><br />
@@ -334,7 +334,7 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>TertiaryBorder:</div><br />
@@ -344,11 +344,26 @@
                    Items="basicNavBarCustoms"
                    DefaultSelectedItem="basicNavBarCustoms[0]"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <div>External icon libraries like FontAwesome can be used with the <b>Icon</b> parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div class="container">
+        <BitNavBar Items="externalIconCustoms"
+                   NameSelectors="@(new() { Text = { Selector = item => item.Title },
+                                            Icon = { Selector = item => item.Image } })" />
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
     <div>Component's Style:</div><br />
@@ -356,7 +371,7 @@
         <BitNavBar Items="basicNavBarCustoms"
                    Style="border-radius: 1rem; margin: 1rem; box-shadow: tomato 0 0 1rem;"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br />
     <div>Component's Class:</div><br />
@@ -364,14 +379,14 @@
         <BitNavBar Items="basicNavBarCustoms"
                    Class="custom-class"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br /><br /><br />
     <div>Item's style & class:</div><br />
     <div class="container">
         <BitNavBar Items="basicNavBarCustomsClassStyle"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon },
+                                            IconName = { Selector = item => item.ImageName },
                                             Class = { Selector = item => item.CssClass },
                                             Style = { Selector = item => item.Style }})" />
     </div>
@@ -381,7 +396,7 @@
         <BitNavBar Items="basicNavBarCustoms"
                    Styles="@(new() { ItemIcon = "color: aqua;", ItemText = "color: tomato;" })"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
     <br /><br />
     <div>Classes:</div><br />
@@ -389,27 +404,27 @@
         <BitNavBar Items="basicNavBarCustoms"
                    Classes="@(new() { ItemIcon = "custom-item-ico", ItemText = "custom-item-txt" })"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example8">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>Use BitNavBar in right-to-left (RTL).</div>
     <br /><br />
     <div dir="rtl" class="container">
         <BitNavBar Dir="BitDir.Rtl"
                    Items="rtlCustomsItems"
                    NameSelectors="@(new() { Text = { Selector = item => item.Title },
-                                            IconName = { Selector = item => item.Icon } })" />
+                                            IconName = { Selector = item => item.ImageName } })" />
     </div>
 </DemoExample>
 
 @code {
     private static readonly List<MenuItem> templateNavBarCustoms =
             [
-        new() { Title = "Home", Icon = BitIconName.Home  },
+        new() { Title = "Home", ImageName = BitIconName.Home  },
         new() { Title = "Products", Fragment = (item) => @<div style="display:flex;flex-direction:column"><b>@item.Title</b><span>🎁</span></div> },
-        new() { Title = "Academy", Icon = BitIconName.LearningTools },
-        new() { Title = "Profile", Icon = BitIconName.Contact },
+        new() { Title = "Academy", ImageName = BitIconName.LearningTools },
+        new() { Title = "Profile", ImageName = BitIconName.Contact },
     ];
 }
\ No newline at end of file
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.cs
index 1d621eba28..677323fe91 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.cs
@@ -4,34 +4,42 @@ public partial class _BitNavBarCustomDemo
 {
     private static readonly List<MenuItem> basicNavBarCustoms =
     [
-        new() { Title = "Home", Icon = BitIconName.Home  },
-        new() { Title = "Products", Icon = BitIconName.ProductVariant },
-        new() { Title = "Academy", Icon = BitIconName.LearningTools },
-        new() { Title = "Profile", Icon = BitIconName.Contact },
+        new() { Title = "Home", ImageName = BitIconName.Home  },
+        new() { Title = "Products", ImageName = BitIconName.ProductVariant },
+        new() { Title = "Academy", ImageName = BitIconName.LearningTools },
+        new() { Title = "Profile", ImageName = BitIconName.Contact },
     ];
 
     private static readonly List<MenuItem> basicNavBarCustomsDisabled =
     [
-        new() { Title = "Home", Icon = BitIconName.Home  },
-        new() { Title = "Products", Icon = BitIconName.ProductVariant },
-        new() { Title = "Academy", Icon = BitIconName.LearningTools, Disabled = true },
-        new() { Title = "Profile", Icon = BitIconName.Contact },
+        new() { Title = "Home", ImageName = BitIconName.Home  },
+        new() { Title = "Products", ImageName = BitIconName.ProductVariant },
+        new() { Title = "Academy", ImageName = BitIconName.LearningTools, Disabled = true },
+        new() { Title = "Profile", ImageName = BitIconName.Contact },
     ];
 
     private static readonly List<MenuItem> basicNavBarCustomsClassStyle =
     [
-        new() { Title = "Home", Icon = BitIconName.Home  },
-        new() { Title = "Products", Icon = BitIconName.ProductVariant, CssClass = "custom-item" },
-        new() { Title = "Academy", Icon = BitIconName.LearningTools, Style = "color: #b6ff00;font-weight: 600;" },
-        new() { Title = "Profile", Icon = BitIconName.Contact },
+        new() { Title = "Home", ImageName = BitIconName.Home  },
+        new() { Title = "Products", ImageName = BitIconName.ProductVariant, CssClass = "custom-item" },
+        new() { Title = "Academy", ImageName = BitIconName.LearningTools, Style = "color: #b6ff00;font-weight: 600;" },
+        new() { Title = "Profile", ImageName = BitIconName.Contact },
+    ];
+
+    private static readonly List<MenuItem> externalIconCustoms =
+    [
+        new() { Title = "Home", Image = "fa-solid fa-house" },
+        new() { Title = "Products", Image = BitIconInfo.Css("fa-solid fa-box") },
+        new() { Title = "Academy", Image = BitIconInfo.Fa("solid graduation-cap") },
+        new() { Title = "Profile", Image = BitIconInfo.Fa("solid user") },
     ];
 
     private static readonly List<MenuItem> rtlCustomsItems =
     [
-        new() { Title = "خانه", Icon = BitIconName.Home  },
-        new() { Title = "محصولات", Icon = BitIconName.ProductVariant },
-        new() { Title = "آکادمی", Icon = BitIconName.LearningTools },
-        new() { Title = "پروفایل", Icon = BitIconName.Contact },
+        new() { Title = "خانه", ImageName = BitIconName.Home  },
+        new() { Title = "محصولات", ImageName = BitIconName.ProductVariant },
+        new() { Title = "آکادمی", ImageName = BitIconName.LearningTools },
+        new() { Title = "پروفایل", ImageName = BitIconName.Contact },
     ];
 
     private static IEnumerable<BitChoiceGroupItem<MenuItem>> choiceGroupItems =
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.samples.cs
index 0d9afe7818..23dece5587 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarCustomDemo.razor.samples.cs
@@ -5,53 +5,53 @@ public partial class _BitNavBarCustomDemo
     private readonly string example1RazorCode = @"
 <BitNavBar Items=""basicNavBarCustoms""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
+                                    IconName = { Selector = item => item.ImageName } })"" />";
     private readonly string example1CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example2RazorCode = @"
 <BitNavBar Items=""basicNavBarCustoms"" IsEnabled=""false""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 
 <BitNavBar Items=""basicNavBarCustomsDisabled""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon },
+                                    IconName = { Selector = item => item.ImageName },
                                     IsEnabled = { Selector = item => item.Disabled is false } })"" />";
     private readonly string example2CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public bool Disabled { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];
 
 private static readonly List<MenuItem> basicNavBarCustomsDisabled =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools, Disabled = true },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools, Disabled = true },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example3RazorCode = @"
@@ -59,107 +59,107 @@ public class MenuItem
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
+                                    IconName = { Selector = item => item.ImageName } })"" />";
     private readonly string example3CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example4RazorCode = @"
 <BitNavBar IconOnly
            Items=""basicNavBarCustoms""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
+                                    IconName = { Selector = item => item.ImageName } })"" />";
     private readonly string example4CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example5RazorCode = @"
 <BitNavBar FitWidth
            Items=""basicNavBarCustoms""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
+                                    IconName = { Selector = item => item.ImageName } })"" />";
     private readonly string example5CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example6RazorCode = @"
 <BitNavBar Items=""basicNavBarCustoms""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"">
+                                    IconName = { Selector = item => item.ImageName } })"">
     <ItemTemplate Context=""custom"">
         <BitText Typography=""BitTypography.Caption1"" Color=""BitColor.Warning"">@custom.Title</BitText>
-        <BitIcon IconName=""@custom.Icon"" Color=""BitColor.Success"" />
+        <BitIcon IconName=""@custom.ImageName"" Color=""BitColor.Success"" />
     </ItemTemplate>
 </BitNavBar>
 
 <BitNavBar Items=""templateNavBarCustoms""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon },
+                                    IconName = { Selector = item => item.ImageName },
                                     Template = { Selector = item => item.Fragment } })"" />
 
 @code {
     private static readonly List<MenuItem> templateNavBarCustoms =
     [
-        new() { Title = ""Home"", Icon = BitIconName.Home  },
+        new() { Title = ""Home"", ImageName = BitIconName.Home  },
         new() { Title = ""Products"", Fragment = (item) => @<div style=""display:flex;flex-direction:column""><b>@item.Title</b><span>🎁</span></div> },
-        new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-        new() { Title = ""Profile"", Icon = BitIconName.Contact },
+        new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+        new() { Title = ""Profile"", ImageName = BitIconName.Contact },
     ];
 }";
     private readonly string example6CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public RenderFragment<MenuItem>? Fragment { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example7RazorCode = @"
 <BitNavBar Items=""basicNavBarCustoms""
            OnItemClick=""(MenuItem item) => eventsClickedItem = item""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 
 Clicked item: @eventsClickedItem?.Title";
     private readonly string example7CsharpCode = @"
@@ -168,15 +168,15 @@ public class MenuItem
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example8RazorCode = @"
@@ -185,14 +185,14 @@ public class MenuItem
             Mode=""BitNavMode.Manual""
             DefaultSelectedItem=""basicNavBarCustoms[1]""
             NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 Selected item: @selectedItem.Title
 
 <BitNavBar Items=""basicNavBarCustoms""
            Mode=""BitNavMode.Manual""
            @bind-SelectedItem=""twoWaySelectedItem""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitChoiceGroup Horizontal Items=""@choiceGroupItems"" @bind-Value=""@twoWaySelectedItem"" />";
 private readonly string example8CsharpCode = @"
 private MenuItem selectedItem = basicNavBarCustoms[0];
@@ -204,15 +204,15 @@ public class MenuItem
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example9RazorCode = @"
@@ -223,7 +223,7 @@ public class MenuItem
            Reselectable=""reselectable""
            OnItemClick=""(MenuItem item) => countClick++""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 
 Item click count: @countClick";
     private readonly string example9CsharpCode = @"
@@ -233,15 +233,15 @@ public class MenuItem
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example10RazorCode = @"
@@ -292,7 +292,7 @@ bit BlazorUI
         </BitSticky>
         <BitStack Alignment=""BitAlignment.Center"" AutoHeight Grows>
             <BitText Typography=""BitTypography.H4"" Color=""BitColor.PrimaryForeground"">
-                <BitIcon IconName=""@advancedSelectedItem?.Icon"" Color=""BitColor.PrimaryForeground"" Size=""BitSize.Large"" />
+                <BitIcon IconName=""@advancedSelectedItem?.ImageName"" Color=""BitColor.PrimaryForeground"" Size=""BitSize.Large"" />
                 <span>@advancedSelectedItem?.Title</span>
             </BitText>
         </BitStack>
@@ -302,7 +302,7 @@ bit BlazorUI
                            Items=""basicNavBarCustoms""
                            @bind-SelectedItem=""advancedSelectedItem""
                            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                                    IconName = { Selector = item => item.Icon } })"" />
+                                                    IconName = { Selector = item => item.ImageName } })"" />
             </BitCard>
         </BitSticky>
     </div>
@@ -313,15 +313,15 @@ bit BlazorUI
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example11RazorCode = @"
@@ -330,121 +330,143 @@ public class MenuItem
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Secondary""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Tertiary""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Info""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Success""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Warning""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.SevereWarning""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.Error""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 
 <BitNavBar Color=""BitColor.PrimaryBackground""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                IconName = { Selector = item => item.Icon } })"" />
+                                IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.SecondaryBackground""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                IconName = { Selector = item => item.Icon } })"" />
+                                IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.TertiaryBackground""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                IconName = { Selector = item => item.Icon } })"" />
+                                IconName = { Selector = item => item.ImageName } })"" />
 
 <BitNavBar Color=""BitColor.PrimaryForeground""
             Items=""basicNavBarCustoms""
             DefaultSelectedItem=""basicNavBarCustoms[0]""
             Mode=""BitNavMode.Manual""
             NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.SecondaryForeground""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.TertiaryForeground""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.PrimaryBorder""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.SecondaryBorder""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Color=""BitColor.TertiaryBorder""
            Items=""basicNavBarCustoms""
            DefaultSelectedItem=""basicNavBarCustoms[0]""
            Mode=""BitNavMode.Manual""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
+                                    IconName = { Selector = item => item.ImageName } })"" />";
     private readonly string example11CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNavBar Items=""externalIconCustoms""
+           NameSelectors=""@(new() { Text = { Selector = item => item.Title },
+                                    Icon = { Selector = item => item.Image } })"" />";
+    private readonly string example12CsharpCode = @"
+public class MenuItem
+{
+    public string? Title { get; set; }
+    public BitIconInfo? Image { get; set; }
+}
+
+private static readonly List<MenuItem> externalIconCustoms =
+[
+    new() { Title = ""Home"", Image = ""fa-solid fa-house"" },
+    new() { Title = ""Products"", Image = BitIconInfo.Css(""fa-solid fa-box"") },
+    new() { Title = ""Academy"", Image = BitIconInfo.Fa(""solid graduation-cap"") },
+    new() { Title = ""Profile"", Image = BitIconInfo.Fa(""solid user"") },
+];";
+
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -472,63 +494,63 @@ public class MenuItem
 <BitNavBar Items=""basicNavBarCustoms""
            Style=""border-radius: 1rem; margin: 1rem; box-shadow: tomato 0 0 1rem;""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Items=""basicNavBarCustoms""
            Class=""custom-class""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 
 <BitNavBar Items=""basicNavBarCustomsClassStyle""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon },
+                                    IconName = { Selector = item => item.ImageName },
                                     Class = { Selector = item => item.CssClass },
                                     Style = { Selector = item => item.Style }})"" />
 
 <BitNavBar Items=""basicNavBarCustoms""
            Styles=""@(new() { ItemIcon = ""color: aqua;"", ItemText = ""color: tomato;"" })""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />
+                                    IconName = { Selector = item => item.ImageName } })"" />
 <BitNavBar Items=""basicNavBarCustoms""
            Classes=""@(new() { ItemIcon = ""custom-item-ico"", ItemText = ""custom-item-txt"" })""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
-    private readonly string example12CsharpCode = @"
+                                    IconName = { Selector = item => item.ImageName } })"" />";
+    private readonly string example13CsharpCode = @"
 public class MenuItem
 {
     public string? Title { get; set; }
-    public string? Icon { get; set; }
+    public string? ImageName { get; set; }
     public string? CssClass { get; set; }
     public string? Style { get; set; }
 }
 
 private static readonly List<MenuItem> basicNavBarCustoms =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];
 
 private static readonly List<MenuItem> basicNavBarCustomsClassStyle =
 [
-    new() { Title = ""Home"", Icon = BitIconName.Home  },
-    new() { Title = ""Products"", Icon = BitIconName.ProductVariant, CssClass = ""custom-item"" },
-    new() { Title = ""Academy"", Icon = BitIconName.LearningTools, Style = ""color: #b6ff00;font-weight: 600;"" },
-    new() { Title = ""Profile"", Icon = BitIconName.Contact },
+    new() { Title = ""Home"", ImageName = BitIconName.Home  },
+    new() { Title = ""Products"", ImageName = BitIconName.ProductVariant, CssClass = ""custom-item"" },
+    new() { Title = ""Academy"", ImageName = BitIconName.LearningTools, Style = ""color: #b6ff00;font-weight: 600;"" },
+    new() { Title = ""Profile"", ImageName = BitIconName.Contact },
 ];";
 
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitNavBar Dir=""BitDir.Rtl""
            Items=""rtlCustomsItems""
            NameSelectors=""@(new() { Text = { Selector = item => item.Title },
-                                    IconName = { Selector = item => item.Icon } })"" />";
-    private readonly string example13CsharpCode = @"
+                                    IconName = { Selector = item => item.ImageName } })"" />";
+    private readonly string example14CsharpCode = @"
 private static readonly List<MenuItem> rtlCustomsItems =
 [
-    new() { Title = ""خانه"", Icon = BitIconName.Home  },
-    new() { Title = ""محصولات"", Icon = BitIconName.ProductVariant },
-    new() { Title = ""آکادمی"", Icon = BitIconName.LearningTools },
-    new() { Title = ""پروفایل"", Icon = BitIconName.Contact },
+    new() { Title = ""خانه"", ImageName = BitIconName.Home  },
+    new() { Title = ""محصولات"", ImageName = BitIconName.ProductVariant },
+    new() { Title = ""آکادمی"", ImageName = BitIconName.LearningTools },
+    new() { Title = ""پروفایل"", ImageName = BitIconName.Contact },
 ];";
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor
index 3182a35370..655c1e6b1f 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" CsharpCode="@example1CsharpCode" Id="example1">
     <div class="container">
         <BitNavBar Items="basicNavBarItems" />
     </div>
@@ -232,7 +232,20 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <div>External icon libraries like FontAwesome can be used with the <b>Icon</b> parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div class="container">
+        <BitNavBar Items="externalIconItems" />
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
     <div>Component's Style:</div><br />
@@ -263,7 +276,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" CsharpCode="@example14CsharpCode" Id="example14">
     <div>Use BitNavBar in right-to-left (RTL).</div>
     <br /><br />
     <div dir="rtl" class="container">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.cs
index 5c589677a9..fbf18c660c 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
 
 public partial class _BitNavBarItemDemo
 {
@@ -26,6 +26,14 @@ public partial class _BitNavBarItemDemo
         new() { Text = "Profile", IconName = BitIconName.Contact },
     ];
 
+    private static readonly List<BitNavBarItem> externalIconItems =
+    [
+        new() { Text = "Home", Icon = "fa-solid fa-house" },
+        new() { Text = "Products", Icon = BitIconInfo.Css("fa-solid fa-box") },
+        new() { Text = "Academy", Icon = BitIconInfo.Fa("solid graduation-cap") },
+        new() { Text = "Profile", Icon = BitIconInfo.Fa("solid user") },
+    ];
+
     private static readonly List<BitNavBarItem> rtlItems =
     [
         new() { Text = "خانه", IconName = BitIconName.Home  },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.samples.cs
index 6614af587a..28b9073524 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarItemDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
 
 public partial class _BitNavBarItemDemo
 {
@@ -256,6 +256,20 @@ bit BlazorUI
 ];";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNavBar Items=""externalIconItems"" />";
+    private readonly string example12CsharpCode = @"
+private static readonly List<BitNavBarItem> externalIconItems =
+[
+    new() { Text = ""Home"", Icon = ""fa-solid fa-house"" },
+    new() { Text = ""Products"", Icon = BitIconInfo.Css(""fa-solid fa-box"") },
+    new() { Text = ""Academy"", Icon = BitIconInfo.Fa(""solid graduation-cap"") },
+    new() { Text = ""Profile"", Icon = BitIconInfo.Fa(""solid user"") },
+];";
+
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -287,7 +301,7 @@ bit BlazorUI
 
 <BitNavBar Items=""basicNavBarItems"" Styles=""@(new() { ItemIcon = ""color: aqua;"", ItemText = ""color: tomato;"" })"" />
 <BitNavBar Items=""basicNavBarItems"" Classes=""@(new() { ItemIcon = ""custom-item-ico"", ItemText = ""custom-item-txt"" })"" />";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private static readonly List<BitNavBarItem> basicNavBarItems =
 [
     new() { Text = ""Home"", IconName = BitIconName.Home  },
@@ -305,9 +319,9 @@ bit BlazorUI
 ];";
 
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitNavBar Dir=""BitDir.Rtl"" Items=""rtlItems"" />";
-    private readonly string example13CsharpCode = @"
+    private readonly string example14CsharpCode = @"
 private static readonly List<BitNavBarItem> rtlItems =
 [
     new() { Text = ""خانه"", IconName = BitIconName.Home  },
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor
index cf3ec30b57..78a77a9a8e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor
@@ -1,4 +1,4 @@
-<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
+<DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
     <div class="container">
         <BitNavBar TItem="BitNavBarOption">
             <BitNavBarOption Text="Home" IconName="@BitIconName.Home" />
@@ -380,7 +380,25 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
+<DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
+    <div>External icon libraries like FontAwesome can be used with the <b>Icon</b> parameter.</div>
+
+    <br />
+    <br />
+
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+    <div class="container">
+        <BitNavBar TItem="BitNavBarOption">
+            <BitNavBarOption Text="Home" Icon="@("fa-solid fa-house")" />
+            <BitNavBarOption Text="Products" Icon="@BitIconInfo.Css("fa-solid fa-box")" />
+            <BitNavBarOption Text="Academy" Icon="@BitIconInfo.Fa("solid graduation-cap")" />
+            <BitNavBarOption Text="Profile" Icon="@BitIconInfo.Fa("solid user")" />
+        </BitNavBar>
+    </div>
+</DemoExample>
+
+<DemoExample Title="Style & Class" RazorCode="@example13RazorCode" Id="example13">
     <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
     <br /><br />
     <div>Component's Style:</div><br />
@@ -434,7 +452,7 @@
     </div>
 </DemoExample>
 
-<DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
+<DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
     <div>Use BitNavBar in right-to-left (RTL).</div>
     <br /><br />
     <div dir="rtl" class="container">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor.samples.cs
index 53bfce2949..f1a64ea287 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/NavBar/_BitNavBarOptionDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.NavBar;
 
 public partial class _BitNavBarOptionDemo
 {
@@ -298,6 +298,17 @@ bit BlazorUI
 </BitNavBar>";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitNavBar TItem=""BitNavBarOption"">
+    <BitNavBarOption Text=""Home"" Icon=""@(""fa-solid fa-house"")"" />
+    <BitNavBarOption Text=""Products"" Icon=""@BitIconInfo.Css(""fa-solid fa-box"")"" />
+    <BitNavBarOption Text=""Academy"" Icon=""@BitIconInfo.Fa(""solid graduation-cap"")"" />
+    <BitNavBarOption Text=""Profile"" Icon=""@BitIconInfo.Fa(""solid user"")"" />
+</BitNavBar>";
+
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -355,7 +366,7 @@ bit BlazorUI
     <BitNavBarOption Text=""Profile"" IconName=""@BitIconName.Contact"" />
 </BitNavBar>";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitNavBar Dir=""BitDir.Rtl"" TItem=""BitNavBarOption"">
     <BitNavBarOption Text=""خانه"" IconName=""@BitIconName.Home"" />
     <BitNavBarOption Text=""محصولات"" IconName=""@BitIconName.ProductVariant"" />

From 8bd4538c5f0d884bcf5187b7339daaaeb6d90d4e Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 22 Feb 2026 16:03:05 +0330
Subject: [PATCH 19/66] feat(blazorui): correct height of BitDropdown elements
 #12104 (#12114)

---
 .../Inputs/Dropdown/BitDropdown.razor         |  5 ++---
 .../Inputs/Dropdown/BitDropdown.scss          | 21 +++++++++++--------
 .../Inputs/Dropdown/BitDropdownClassStyles.cs |  2 +-
 3 files changed, 15 insertions(+), 13 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
index 535733af9a..132c266cd3 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
@@ -15,8 +15,7 @@
      style="@StyleBuilder.Value"
      class="@ClassBuilder.Value"
      dir="@Dir?.ToString().ToLower()"
-     aria-owns="@(IsOpen ? _calloutId : null)">
-
+     aria-owns="@(IsOpen? _calloutId : null)">
     @if (LabelTemplate is not null)
     {
         <label id="@_labelId">
@@ -42,7 +41,7 @@
          aria-disabled="@(IsEnabled is false)"
          aria-expanded=@(IsOpen ? "true" : "false")
          aria-labelledby="@GetDropdownAriaLabelledby"
-         aria-controls="@(IsOpen ? _calloutId : null)">
+         aria-controls="@(IsOpen? _calloutId : null)">
 
         @if (PrefixTemplate is not null)
         {
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
index 2072d04643..b1b32f8a41 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.scss
@@ -3,7 +3,9 @@
 
 .bit-drp {
     width: 100%;
+    display: flex;
     position: relative;
+    flex-direction: column;
     font-family: $tg-font-family;
 
     &.bit-drp-req {
@@ -115,12 +117,12 @@
 
 .bit-drp-lbl {
     margin: 0;
-    display: block;
     font-weight: 600;
+    color: $clr-fg-pri;
     box-sizing: border-box;
     font-size: spacing(1.75);
     padding: spacing(0.625) 0;
-    color: $clr-fg-pri;
+    line-height: spacing(2.75);
 }
 
 .bit-drp-wrp {
@@ -130,6 +132,7 @@
     user-select: none;
     color: $clr-fg-sec;
     position: relative;
+    min-height: spacing(4);
     box-sizing: border-box;
     background-color: $clr-bg-pri;
     border-radius: $shp-border-radius;
@@ -689,16 +692,16 @@
     }
 }
 
-.bit-drp-itm[disabled] {
-    cursor: default;
-    color: $clr-fg-dis;
+    .bit-drp-itm[disabled] {
+        cursor: default;
+        color: $clr-fg-dis;
 
-    @media (hover: hover) {
-        &:hover {
-            background-color: transparent;
+        @media (hover: hover) {
+            &:hover {
+                background-color: transparent;
+            }
         }
     }
-}
 
 .bit-drp-sel {
     background-color: $clr-bg-sec;
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
index 0f7d2dfbb8..d2ced9f963 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdownClassStyles.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public class BitDropdownClassStyles
 {

From 6a9f70e2ba3bd07646010aee0caf76ab9a1d42dd Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Sun, 22 Feb 2026 13:57:40 +0100
Subject: [PATCH 20/66] feat(templates): set limit for L1 cache in bit
 Boilerplate #12108 (#12109)

---
 .../Services/HttpMessageHandlers/CacheDelegatingHandler.cs | 6 +++++-
 .../Features/Identity/IdentityController.WebAuthn.cs       | 5 +----
 .../Features/Identity/UserController.WebAuthn.cs           | 7 ++-----
 .../Infrastructure/SignalR/AppChatbot.cs                   | 5 +----
 .../Extensions/WebApplicationBuilderExtensions.cs          | 1 +
 .../Extensions/ISharedServiceCollectionExtensions.cs       | 6 ++++--
 .../Bit.Boilerplate/src/Shared/SharedSettings.cs           | 6 +++++-
 .../Bit.Boilerplate/src/Shared/appsettings.json            | 4 ++++
 8 files changed, 23 insertions(+), 17 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Services/HttpMessageHandlers/CacheDelegatingHandler.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Services/HttpMessageHandlers/CacheDelegatingHandler.cs
index 09df39130b..8e31258c5d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Services/HttpMessageHandlers/CacheDelegatingHandler.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Services/HttpMessageHandlers/CacheDelegatingHandler.cs
@@ -52,7 +52,11 @@ protected override async Task<HttpResponseMessage> SendAsync(HttpRequestMessage
                     ResponseHeaders = response.Headers.ToDictionary(h => h.Key, h => h.Value.ToArray()),
                     ContentHeaders = response.Content.Headers.ToDictionary(h => h.Key, h => h.Value.ToArray()),
                     LogScopeData = logScopeData.ToDictionary()
-                }, maxAge);
+                }, options: new()
+                {
+                    Size = 1,
+                    AbsoluteExpirationRelativeToNow = maxAge
+                });
             }
 
             return response;
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.WebAuthn.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.WebAuthn.cs
index 1ec20a130c..4d0fe9317f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.WebAuthn.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.WebAuthn.cs
@@ -42,10 +42,7 @@ public async Task<AssertionOptions> GetWebAuthnAssertionOptions(WebAuthnAssertio
 
         var key = new string([.. options.Challenge.Select(b => (char)b)]);
         await cache.SetAsync(key, options,
-            new FusionCacheEntryOptions
-            {
-                Duration = TimeSpan.FromMinutes(3)
-            },
+            options => options.Duration = TimeSpan.FromMinutes(3),
             cancellationToken);
 
         return options;
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/UserController.WebAuthn.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/UserController.WebAuthn.cs
index 8d89cfb7b4..dfaed8d301 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/UserController.WebAuthn.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/UserController.WebAuthn.cs
@@ -1,4 +1,4 @@
-//+:cnd:noEmit
+//+:cnd:noEmit
 using System.Text;
 using Fido2NetLib;
 using Fido2NetLib.Objects;
@@ -54,10 +54,7 @@ public async Task<CredentialCreateOptions> GetWebAuthnCredentialOptions(Cancella
 
         var key = GetWebAuthnCacheKey(userId);
         await cache.SetAsync(key, options,
-            new FusionCacheEntryOptions
-            {
-                Duration = TimeSpan.FromMinutes(3)
-            },
+            options => options.Duration = TimeSpan.FromMinutes(3),
             cancellationToken);
 
         return options;
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppChatbot.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppChatbot.cs
index 325274c73e..84f52c63be 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppChatbot.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppChatbot.cs
@@ -63,10 +63,7 @@ public async Task StartChat(
                     .FirstOrDefaultAsync(p => p.PromptKind == PromptKind.Support, cancel);
                 return prompt?.Markdown ?? throw new ResourceNotFoundException();
             },
-            new FusionCacheEntryOptions()
-            {
-                Duration = TimeSpan.FromHours(1)
-            },
+            options => options.Duration = TimeSpan.FromHours(1),
             token: cancellationToken);
 
         // The following variables won't change unless SignalR connection restarts and StartChat gets called again, so setting variables once here is sufficient.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
index eece28d0fd..e801a65a4b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
@@ -59,6 +59,7 @@ public static TBuilder AddServerSharedServices<TBuilder>(this TBuilder builder)
         //#endif
 
         services.AddFusionCache()
+            .WithDefaultEntryOptions(options => options.Size = 1)
             // Auto-clone cached objects to avoid further issues after scaling out and switching to distributed caching.
             .WithOptions(opt => opt.DefaultEntryOptions.EnableAutoClone = true)
             //#if(redis == true)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
index 1b16602788..447447aa87 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
@@ -38,8 +38,10 @@ public static IServiceCollection AddSharedProjectServices(this IServiceCollectio
         services.ConfigureAuthorizationCore();
 
         services.AddLocalization();
-
-        services.AddMemoryCache();
+        services.AddMemoryCache(options =>
+        {
+            configuration.GetRequiredSection("MemoryCache").Bind(options);
+        });
 
         return services;
     }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/SharedSettings.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/SharedSettings.cs
index 44f47d09cc..764cea6de7 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/SharedSettings.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/SharedSettings.cs
@@ -1,4 +1,6 @@
-//+:cnd:noEmit
+//+:cnd:noEmit
+using Microsoft.Extensions.Caching.Memory;
+
 namespace Boilerplate.Shared;
 
 public partial class SharedSettings : IValidatableObject
@@ -7,6 +9,8 @@ public partial class SharedSettings : IValidatableObject
     public ApplicationInsightsOptions? ApplicationInsights { get; set; }
     //#endif
 
+    public MemoryCacheOptions MemoryCache { get; set; } = default!;
+
     public virtual IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
     {
         var validationResults = new List<ValidationResult>();
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
index c4e9bb7cfd..8226afc80b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
@@ -108,5 +108,9 @@
             }
         }
     },
+    "MemoryCache": {
+        "SizeLimit": 100000,
+        "SizeLimit__Comment": "Total capacity of the L1 cache. Unit is arbitrary; we treat it as 1 unit per average entry."
+    },
     "$schema": "https://json.schemastore.org/appsettings.json"
 }

From c56341734831ab47e176a2540f0b784bfe639072 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 22 Feb 2026 17:50:32 +0330
Subject: [PATCH 21/66] feat(blazorui): add missing Background and Border
 parameters to BitAccordion #12113 (#12116)

---
 .../Surfaces/Accordion/BitAccordion.razor.cs  |  32 ++++-
 .../Surfaces/Accordion/BitAccordion.scss      |  37 +++++-
 .../Surfaces/Accordion/BitAccordionDemo.razor |  57 +++++++--
 .../Accordion/BitAccordionDemo.razor.cs       | 118 ++++++++++++++++--
 4 files changed, 227 insertions(+), 17 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.razor.cs
index aa2792c05d..d5cd02ec37 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.razor.cs
@@ -1,10 +1,22 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// The Accordion component allows the user to show and hide sections of related content on a page.
 /// </summary>
 public partial class BitAccordion : BitComponentBase
 {
+    /// <summary>
+    /// The color kind of the background of the accordion.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public BitColorKind? Background { get; set; }
+
+    /// <summary>
+    /// The color kind of the border of the accordion.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public BitColorKind? Border { get; set; }
+
     /// <summary>
     /// Alias for the ChildContent parameter.
     /// </summary>
@@ -78,6 +90,24 @@ protected override void RegisterCssClasses()
         ClassBuilder.Register(() => IsExpanded ? Classes?.Expanded : string.Empty);
 
         ClassBuilder.Register(() => NoBorder ? "bit-acd-nbd" : string.Empty);
+
+        ClassBuilder.Register(() => Background switch
+        {
+            BitColorKind.Primary => "bit-acd-pbg",
+            BitColorKind.Secondary => "bit-acd-sbg",
+            BitColorKind.Tertiary => "bit-acd-tbg",
+            BitColorKind.Transparent => "bit-acd-rbg",
+            _ => string.Empty
+        });
+
+        ClassBuilder.Register(() => Border switch
+        {
+            BitColorKind.Primary => "bit-acd-pbr",
+            BitColorKind.Secondary => "bit-acd-sbr",
+            BitColorKind.Tertiary => "bit-acd-tbr",
+            BitColorKind.Transparent => "bit-acd-rbr",
+            _ => string.Empty
+        });
     }
 
     protected override void RegisterCssStyles()
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.scss b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.scss
index 6fa72c4218..95673884b0 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Accordion/BitAccordion.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-acd {
     width: 100%;
@@ -33,6 +33,41 @@
     }
 }
 
+
+.bit-acd-pbg {
+    background-color: $clr-bg-pri;
+}
+
+.bit-acd-sbg {
+    background-color: $clr-bg-sec;
+}
+
+.bit-acd-tbg {
+    background-color: $clr-bg-ter;
+}
+
+.bit-acd-rbg {
+    background-color: transparent;
+}
+
+
+.bit-acd-pbr {
+    border-color: $clr-brd-pri;
+}
+
+.bit-acd-sbr {
+    border-color: $clr-brd-sec;
+}
+
+.bit-acd-tbr {
+    border-color: $clr-brd-ter;
+}
+
+.bit-acd-rbr {
+    border-color: transparent;
+}
+
+
 .bit-acd-hdr {
     display: flex;
     cursor: pointer;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor
index 496d4e112b..5c2524d700 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/accordion"
+@page "/components/accordion"
 
 <PageOutlet Url="components/accordion"
             Title="Accordion"
@@ -8,6 +8,7 @@
           SecondaryNames="@(["Expander"])"
           Description="The Accordion component allows the user to show and hide sections of related content on a page."
           Parameters="componentParameters"
+          SubEnums="componentSubEnums"
           SubClasses="componentSubClasses"
           GitHubUrl="Surfaces/Accordion/BitAccordion.razor"
           GitHubDemoUrl="Surfaces/Accordion/BitAccordionDemo.razor">
@@ -35,7 +36,49 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="Multiple" RazorCode="@example3RazorCode" Id="example3">
+    <DemoExample Title="Background" RazorCode="@example3RazorCode" CsharpCode="@example3CsharpCode" Id="example3">
+        <BitChoiceGroup @bind-Value="backgroundColorKind" Horizontal
+                        TItem="BitChoiceGroupOption<BitColorKind>" TValue="BitColorKind">
+            <BitChoiceGroupOption Text="Primary" Value="BitColorKind.Primary" />
+            <BitChoiceGroupOption Text="Secondary" Value="BitColorKind.Secondary" />
+            <BitChoiceGroupOption Text="Tertiary" Value="BitColorKind.Tertiary" />
+            <BitChoiceGroupOption Text="Transparent" Value="BitColorKind.Transparent" />
+        </BitChoiceGroup>
+        <br />
+        <div style="padding:2rem;background:gray">
+            <BitAccordion Title="Accordion" Background="backgroundColorKind">
+                Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
+                These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape. 
+                Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and 
+                inspirations will be built. Soon, these lines will transform into narratives that provoke thought, 
+                spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty 
+                in potential the quiet magic of beginnings, where everything is still to come, and the possibilities 
+                are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+            </BitAccordion>
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Border" RazorCode="@example4RazorCode" CsharpCode="@example4CsharpCode" Id="example4">
+        <BitChoiceGroup @bind-Value="borderColorKind" Horizontal
+                        TItem="BitChoiceGroupOption<BitColorKind>" TValue="BitColorKind">
+            <BitChoiceGroupOption Text="Primary" Value="BitColorKind.Primary" />
+            <BitChoiceGroupOption Text="Secondary" Value="BitColorKind.Secondary" />
+            <BitChoiceGroupOption Text="Tertiary" Value="BitColorKind.Tertiary" />
+            <BitChoiceGroupOption Text="Transparent" Value="BitColorKind.Transparent" />
+        </BitChoiceGroup>
+        <br />
+        <BitAccordion Title="Accordion" Border="borderColorKind">
+            Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
+            These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape. 
+            Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and 
+            inspirations will be built. Soon, these lines will transform into narratives that provoke thought, 
+            spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty 
+            in potential the quiet magic of beginnings, where everything is still to come, and the possibilities 
+            are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+        </BitAccordion>
+    </DemoExample>
+
+    <DemoExample Title="Multiple" RazorCode="@example5RazorCode" Id="example5">
         <div>You can define multiple accordions together.</div><br />
         <BitAccordion Title="Accordion 1">
             Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams. 
@@ -67,7 +110,7 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="Description" RazorCode="@example4RazorCode" Id="example4">
+    <DemoExample Title="Description" RazorCode="@example6RazorCode" Id="example6">
         <div>You can set a short description inside the Accordion header.</div><br />
         <BitAccordion Title="General settings" Description="The general settings of the application">
             Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
@@ -80,7 +123,7 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="Controlled" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
+    <DemoExample Title="Controlled" RazorCode="@example7RazorCode" CsharpCode="@example7CsharpCode" Id="example7">
         <div>You can control the accordions to open only one at a time.</div><br />
         <BitAccordion Title="General settings"
                       Description="I am an accordion"
@@ -121,7 +164,7 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="Binding" RazorCode="@example6RazorCode" CsharpCode="@example6CsharpCode" Id="example6">
+    <DemoExample Title="Binding" RazorCode="@example8RazorCode" CsharpCode="@example8CsharpCode" Id="example8">
         <div>You can bind values ​​with Accordion.</div><br />
         <BitToggle @bind-Value="AccordionToggleIsEnabled" OnText="Enabled" OffText="Disabled" />
         <br />
@@ -141,7 +184,7 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="Customization" RazorCode="@example7RazorCode" Id="example7">
+    <DemoExample Title="Customization" RazorCode="@example9RazorCode" Id="example9">
         <div>This Accordion header is customized.</div><br />
         <BitAccordion>
             <HeaderTemplate Context="isExpanded">
@@ -181,7 +224,7 @@
         </BitAccordion>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example8RazorCode" Id="example8">
+    <DemoExample Title="RTL" RazorCode="@example10RazorCode" Id="example10">
         <div>Use BitAccordion in right-to-left (RTL).</div><br />
         <BitAccordion Dir="BitDir.Rtl"
                       Title="تنظیمات"
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.cs
index c3b3cd4fcc..1b3dd7b921 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Accordion/BitAccordionDemo.razor.cs
@@ -1,9 +1,27 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Surfaces.Accordion;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Surfaces.Accordion;
 
 public partial class BitAccordionDemo
 {
     private readonly List<ComponentParameter> componentParameters =
     [
+        new()
+        {
+            Name = "Background",
+            Type = "BitColorKind?",
+            DefaultValue = "null",
+            Description = "The color kind of the background of the accordion.",
+            LinkType = LinkType.Link,
+            Href = "#color-kind-enum",
+        },
+        new()
+        {
+            Name = "Border",
+            Type = "BitColorKind?",
+            DefaultValue = "null",
+            Description = "The color kind of the border of the accordion.",
+            LinkType = LinkType.Link,
+            Href = "#color-kind-enum",
+        },
         new()
         {
             Name = "Body",
@@ -92,6 +110,43 @@ public partial class BitAccordionDemo
         }
     ];
 
+    private readonly List<ComponentSubEnum> componentSubEnums =
+    [
+        new()
+        {
+            Id = "color-kind-enum",
+            Name = "BitColorKind",
+            Description = "Defines the color kinds available in the bit BlazorUI.",
+            Items =
+            [
+                new()
+                {
+                    Name = "Primary",
+                    Description = "The primary color kind.",
+                    Value = "0",
+                },
+                new()
+                {
+                    Name = "Secondary",
+                    Description = "The secondary color kind.",
+                    Value = "1",
+                },
+                new()
+                {
+                    Name = "Tertiary",
+                    Description = "The tertiary color kind.",
+                    Value = "2",
+                },
+                new()
+                {
+                    Name = "Transparent",
+                    Description = "The transparent color kind.",
+                    Value = "3",
+                },
+            ]
+        }
+    ];
+
     private readonly List<ComponentSubClass> componentSubClasses =
     [
         new()
@@ -169,6 +224,9 @@ public partial class BitAccordionDemo
 
 
 
+    private BitColorKind backgroundColorKind = BitColorKind.Primary;
+    private BitColorKind borderColorKind = BitColorKind.Primary;
+
     private byte controlledAccordionExpandedItem = 1;
 
     private bool AccordionToggleIsEnabled;
@@ -199,6 +257,50 @@ These placeholder words symbolize the beginning—a moment of possibility where
 </BitAccordion>";
 
     private readonly string example3RazorCode = @"
+<BitChoiceGroup @bind-Value=""backgroundColorKind"" Horizontal
+                TItem=""BitChoiceGroupOption<BitColorKind>"" TValue=""BitColorKind"">
+    <BitChoiceGroupOption Text=""Primary"" Value=""BitColorKind.Primary"" />
+    <BitChoiceGroupOption Text=""Secondary"" Value=""BitColorKind.Secondary"" />
+    <BitChoiceGroupOption Text=""Tertiary"" Value=""BitColorKind.Tertiary"" />
+    <BitChoiceGroupOption Text=""Transparent"" Value=""BitColorKind.Transparent"" />
+</BitChoiceGroup>
+
+<div style=""padding:2rem;background:gray"">
+    <BitAccordion Title=""Accordion"" Background=""backgroundColorKind"">
+        Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
+        These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape. 
+        Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and 
+        inspirations will be built. Soon, these lines will transform into narratives that provoke thought, 
+        spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty 
+        in potential the quiet magic of beginnings, where everything is still to come, and the possibilities 
+        are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+    </BitAccordion>
+</div>";
+    private readonly string example3CsharpCode = @"
+private BitColorKind backgroundColorKind = BitColorKind.Primary;";
+
+    private readonly string example4RazorCode = @"
+<BitChoiceGroup @bind-Value=""borderColorKind"" Horizontal
+                TItem=""BitChoiceGroupOption<BitColorKind>"" TValue=""BitColorKind"">
+    <BitChoiceGroupOption Text=""Primary"" Value=""BitColorKind.Primary"" />
+    <BitChoiceGroupOption Text=""Secondary"" Value=""BitColorKind.Secondary"" />
+    <BitChoiceGroupOption Text=""Tertiary"" Value=""BitColorKind.Tertiary"" />
+    <BitChoiceGroupOption Text=""Transparent"" Value=""BitColorKind.Transparent"" />
+</BitChoiceGroup>
+
+<BitAccordion Title=""Accordion"" Border=""borderColorKind"">
+    Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
+    These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape. 
+    Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and 
+    inspirations will be built. Soon, these lines will transform into narratives that provoke thought, 
+    spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty 
+    in potential the quiet magic of beginnings, where everything is still to come, and the possibilities 
+    are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+</BitAccordion>";
+    private readonly string example4CsharpCode = @"
+private BitColorKind borderColorKind = BitColorKind.Primary;";
+
+    private readonly string example5RazorCode = @"
 <BitAccordion Title=""Accordion 1"">
     Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams. 
     Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment 
@@ -228,7 +330,7 @@ each word has the power to transform into something extraordinary. Here lies the
     begins here, in this quiet moment where everything is possible.
 </BitAccordion>";
 
-    private readonly string example4RazorCode = @"
+    private readonly string example6RazorCode = @"
 <BitAccordion Title=""General settings"" Description=""The general settings of the application"">
     Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams. 
     These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape. 
@@ -239,7 +341,7 @@ These placeholder words symbolize the beginning—a moment of possibility where
     are boundless. This space is yours to craft, yours to shape, yours to bring to life.
 </BitAccordion>";
 
-    private readonly string example5RazorCode = @"
+    private readonly string example7RazorCode = @"
 <BitAccordion Title=""General settings""
               Description=""I am an accordion""
               OnClick=""() => controlledAccordionExpandedItem = 1""
@@ -277,10 +379,10 @@ each word has the power to transform into something extraordinary. Here lies the
     idea that sparks change, these lines are yours to fill, to shape, and to make uniquely yours. The journey 
     begins here, in this quiet moment where everything is possible.
 </BitAccordion>";
-    private readonly string example5CsharpCode = @"
+    private readonly string example7CsharpCode = @"
 private byte controlledAccordionExpandedItem = 1;";
 
-    private readonly string example6RazorCode = @"
+    private readonly string example8RazorCode = @"
 <BitToggle @bind-Value=""AccordionToggleIsEnabled"" OnText=""Enabled"" OffText=""Disabled"" />
 <BitToggle @bind-Value=""AccordionToggleIsExpanded"" OnText=""Expanded"" OffText=""Collapsed"" />
 
@@ -296,11 +398,11 @@ These placeholder words symbolize the beginning—a moment of possibility where
     in potential the quiet magic of beginnings, where everything is still to come, and the possibilities 
     are boundless. This space is yours to craft, yours to shape, yours to bring to life.
 </BitAccordion>";
-    private readonly string example6CsharpCode = @"
+    private readonly string example8CsharpCode = @"
 private bool AccordionToggleIsEnabled;
 private bool AccordionToggleIsExpanded;";
 
-    private readonly string example7RazorCode = @"
+    private readonly string example9RazorCode = @"
 <style>
     .custom-header {
         gap: 1rem;
@@ -355,7 +457,7 @@ These placeholder words symbolize the beginning—a moment of possibility where
     </BitCarousel>
 </BitAccordion>";
 
-    private readonly string example8RazorCode = @"
+    private readonly string example10RazorCode = @"
 <BitAccordion Dir=""BitDir.Rtl"" 
               Title=""تنظیمات"" 
               Description=""من یک آکاردئون هستم!"">

From 471713d931b1ff12bd635127119426f9435a767c Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Sun, 22 Feb 2026 15:51:51 +0100
Subject: [PATCH 22/66] feat(deps): update project dependencies #12118 (#12119)

---
 .../Bit.BlazorUI.Demo.Server.csproj              |  2 +-
 .../Bit.BlazorUI.Demo.Client.Maui.csproj         |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Windows.csproj      |  2 +-
 .../Bit.Butil.Demo.Maui.csproj                   |  4 ++--
 .../Bit.Boilerplate/src/Directory.Packages.props | 16 ++++++++--------
 .../Bit.Websites.Platform.Server.csproj          |  2 +-
 6 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index c632fa51f3..5c21e7672c 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -33,7 +33,7 @@
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="0.8.0-preview.1" />
+        <PackageReference Include="ModelContextProtocol" Version="0.9.0-preview.2" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 1f811d8706..558607530b 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -117,8 +117,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.40" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.41" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
     </ItemGroup>
 
     <!-- Build Properties must be defined within these property groups to ensure successful publishing
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index 20f09e919e..dcbaf3307b 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -40,7 +40,7 @@
         </PackageReference>
 
         <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.40" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.41" />
         <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageReference Include="Velopack" Version="0.0.1298" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
index 841bcac12f..2e90e19290 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
@@ -50,8 +50,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.40" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.41" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
         <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
     </ItemGroup>
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 19dcd0508f..59530deb1f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -34,9 +34,9 @@
         <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.40" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.40" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.40" />
+        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.41" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.41" />
         <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageVersion Include="MSTest" Version="4.1.0" />
         <PackageVersion Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
@@ -50,7 +50,7 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.41" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.46" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
@@ -58,7 +58,7 @@
         <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.3" />
         <!--/+:msbuild-conditional:noEmit -->
-        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="0.8.0-preview.1" />
+        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="0.9.0-preview.2" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.1-preview.1.26105.8" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.1" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
@@ -97,9 +97,9 @@
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.71.0-preview" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.71.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-preview.260212.1" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.72.0-preview" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.72.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc1" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index 9b2c250a4c..ad57dafe94 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -27,7 +27,7 @@
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="0.8.0-preview.1" />
+        <PackageReference Include="ModelContextProtocol" Version="0.9.0-preview.2" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />

From 257f3745b2a51f816c31ee677d73ff7f38d8c547 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Mon, 23 Feb 2026 20:44:59 +0100
Subject: [PATCH 23/66] feat(templates): use public/private key in bit
 Boilerplate for data protection and jwt issue/validation #12120 (#12121)

---
 ...entity - Authentication & Authorization.md |  50 --------
 .../10- Configuration (appsettings.json).md   |   1 -
 .../Boilerplate.Server.Api/AppCertificate.crt |  19 +++
 .../Boilerplate.Server.Api/AppCertificate.key |  28 +++++
 .../Boilerplate.Server.Api/AppCertificate.md  | 118 ++++++++++++++++++
 .../Boilerplate.Server.Api.csproj             |   5 +
 .../Services/AppJwtSecureDataFormat.cs        |  12 +-
 .../Extensions/HttpContextExtensions.cs       |  23 ----
 .../Services/AppCertificateService.cs         |  50 ++++++++
 .../Infrastructure/SignalR/AppHub.cs          |   3 +
 .../Program.Middlewares.cs                    |  36 ++++++
 .../Program.Services.cs                       |  39 +++---
 .../ServerApiSettings.cs                      |  17 ---
 .../Boilerplate.Server.Api/appsettings.json   |   1 -
 .../Boilerplate.Server.AppHost/Program.cs     |   1 +
 .../Extensions/HttpContextExtensions.cs       |  23 ++++
 .../Boilerplate.Server.Web.csproj             |   6 +
 .../Services/SimpleJwtSecureDataFormat.cs     |  53 --------
 .../Program.Middlewares.cs                    |   3 +
 .../Program.Services.cs                       |  43 +++++--
 .../Boilerplate.Server.Web/appsettings.json   |  14 ++-
 21 files changed, 368 insertions(+), 177 deletions(-)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
 delete mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Infrastructure/Services/SimpleJwtSecureDataFormat.cs

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/07- ASP.NET Core Identity - Authentication & Authorization.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/07- ASP.NET Core Identity - Authentication & Authorization.md
index 26afc377ad..0dcebf681a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/07- ASP.NET Core Identity - Authentication & Authorization.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/07- ASP.NET Core Identity - Authentication & Authorization.md	
@@ -91,7 +91,6 @@ You can configure token expiration in [`appsettings.json`](/src/Server/Boilerpla
 "Identity": {
     "BearerTokenExpiration": "0.00:05:00",  // Format: D.HH:mm:ss (5 minutes)
     "RefreshTokenExpiration": "14.00:00:00", // 14 days
-    "JwtIssuerSigningKeySecret": "VeryLongJWTIssuerSigningKeySecretThatIsMoreThan64BytesToEnsureCompatibilityWithHS512Algorithm"
 }
 ```
 
@@ -470,7 +469,6 @@ public class AppClaimTypes
 
 ```json
 "Identity": {
-    "JwtIssuerSigningKeySecret": "VeryLongJWTIssuerSigningKeySecretThatIsMoreThan64BytesToEnsureCompatibilityWithHS512Algorithm",
     "Issuer": "Boilerplate",
     "Audience": "Boilerplate",
     "BearerTokenExpiration": "0.00:05:00",
@@ -701,54 +699,6 @@ Let's walk through a password reset scenario:
 
 ## Advanced Topics
 
-### JWT Token Signing with PFX Certificates
-
-By default, the Bit Boilerplate uses a string-based secret (`JwtIssuerSigningKeySecret`) for signing JWT tokens in the [`AppJwtSecureDataFormat`](/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs) class. While this approach is valid and secure, using a **PFX certificate** is considered best practice for production environments, especially when:
-
-- You need to share JWT validation across multiple backend services
-- You want to follow industry-standard cryptographic practices
-- You're deploying to enterprise environments with strict security requirements
-
-**Why We Didn't Use PFX by Default**
-
-We chose the string-based secret as the default because:
-- **Easier Deployment**: PFX certificates require additional configuration on shared hosting providers
-- **Simplified Development**: Developers can get started immediately without certificate management
-- **Good Security**: String-based secrets with HS512 are still cryptographically secure
-
-**How to Migrate to PFX Certificates**
-
-If you want to use PFX certificates, you'll need to modify [`AppJwtSecureDataFormat`](/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs) to use `AsymmetricSecurityKey` instead of `SymmetricSecurityKey`:
-
-```csharp
-// Instead of:
-IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(appSettings.Identity.JwtIssuerSigningKeySecret))
-
-// Use:
-var certificate = new X509Certificate2("path/to/certificate.pfx", "password");
-IssuerSigningKey = new X509SecurityKey(certificate)
-```
-
-**Protecting ASP.NET Core Data Protection Keys**
-
-Additionally, you should protect the Data Protection keys stored in the database. In [`Program.Services.cs`](/src/Server/Boilerplate.Server.Api/Program.Services.cs), update the following code:
-
-```csharp
-services.AddDataProtection()
-   .PersistKeysToDbContext<AppDbContext>()
-   .ProtectKeysWithCertificate(certificate); // Add this line
-```
-
-**Cross-Service JWT Validation**
-
-When using PFX certificates, you can share the **public key** with other backend services to validate JWTs issued by your ASP.NET Core Identity system. Other services can use the `AddJwtAuthentication` method to validate tokens without needing the private key.
-
-This enables scenarios where:
-- Multiple microservices validate the same JWT
-- Third-party services can verify your tokens
-
----
-
 ### Keycloak Integration
 
 Bit Boilerplate includes built-in support for **Keycloak**, a free, open-source identity and access management solution. Keycloak provides enterprise-grade features like:
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/10- Configuration (appsettings.json).md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/10- Configuration (appsettings.json).md
index 08eaf6ccb4..67854a8f49 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/10- Configuration (appsettings.json).md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/10- Configuration (appsettings.json).md	
@@ -220,7 +220,6 @@ In [`src/Server/Boilerplate.Server.Api/appsettings.json`](/src/Server/Boilerplat
         }
     },
     "Identity": {
-        "JwtIssuerSigningKeySecret": "VeryLongJWTIssuerSigningKeySecret...",
         "Issuer": "Boilerplate",
         "Audience": "Boilerplate",
         "BearerTokenExpiration": "0.00:05:00",
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
new file mode 100644
index 0000000000..c3d08dac22
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
@@ -0,0 +1,19 @@
+-----BEGIN CERTIFICATE-----
+MIIDEzCCAfugAwIBAgIUXViovPz6nf8uYwwuLV5wOLvbcGIwDQYJKoZIhvcNAQEL
+BQAwGTEXMBUGA1UEAwwOQXBwQ2VydGlmaWNhdGUwHhcNMjYwMjIzMTYzODE1WhcN
+MjcwMjIzMTYzODE1WjAZMRcwFQYDVQQDDA5BcHBDZXJ0aWZpY2F0ZTCCASIwDQYJ
+KoZIhvcNAQEBBQADggEPADCCAQoCggEBANdMHBLKxFtpHcWN/UKYy0larN0xgXy+
+ZhTPFLZ+3p4eHNZ8kxI2VkNk/6DZBkTlLDPTacURa9BLnfkkg8xamYG7IfUZZLM4
+MXu5pN2C3f3FnhgjT0IU0x2S31FrkSClqgJ9zbUIkJgeyRiHkidCBS6fr2FF152h
+9LPRDo5jlCAbDWK1jQnp0ccMWfenBqWbE9UiHMjFSNEsGsuLn9VA8MbcPOSUe3D4
+4i5ykQS7l9Nu/1IgSgCAR1JWtApE/KS5KGmm7zdZDywKIhgl2q4BBTklTKLsP36z
+kKqvvRXwQpYgO3MyPmQ1D46qkt3xjJX50mGGmanj7f7EL3yWrJVOPdsCAwEAAaNT
+MFEwHQYDVR0OBBYEFHBg04f5muvXzVwIN8MMNg1/DWJMMB8GA1UdIwQYMBaAFHBg
+04f5muvXzVwIN8MMNg1/DWJMMA8GA1UdEwEB/wQFMAMBAf8wDQYJKoZIhvcNAQEL
+BQADggEBAEjb64p3HnbxALYXFhxv82hAcQcAzGeXnBTpDbNOgTa4zt3H7YJLbgOp
+SDqcoQISFjnF7NByYPtbXWX7EyG6yGygB/BbC0H4TI0n2v4MCC/qbAayjBdtByIg
+zgc8UrVIWripOMUcvadS58zpyNo2+2UcAxZpE+AJwUCJUdhFdz+aDRTvvQEOVGhJ
+rGf3GptXgClrO82LlkOydnXs0JeHibdH97aNt84/LZJN/Su/GqJO7UKf2cQeib5K
+W/HKnyGgKbOQmwyWPGQLh9tweVx1Ckd3NwXaeW8+9vHfzPGGKodWjFmpYA4AdWQZ
+DoxFeE5vdH2fydJFZCH5vNU8YxXAxBc=
+-----END CERTIFICATE-----
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
new file mode 100644
index 0000000000..6a3e788a5c
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
@@ -0,0 +1,28 @@
+-----BEGIN PRIVATE KEY-----
+MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDXTBwSysRbaR3F
+jf1CmMtJWqzdMYF8vmYUzxS2ft6eHhzWfJMSNlZDZP+g2QZE5Swz02nFEWvQS535
+JIPMWpmBuyH1GWSzODF7uaTdgt39xZ4YI09CFNMdkt9Ra5EgpaoCfc21CJCYHskY
+h5InQgUun69hRdedofSz0Q6OY5QgGw1itY0J6dHHDFn3pwalmxPVIhzIxUjRLBrL
+i5/VQPDG3DzklHtw+OIucpEEu5fTbv9SIEoAgEdSVrQKRPykuShppu83WQ8sCiIY
+JdquAQU5JUyi7D9+s5Cqr70V8EKWIDtzMj5kNQ+OqpLd8YyV+dJhhpmp4+3+xC98
+lqyVTj3bAgMBAAECggEAAMpgWkCsB0N/YrpQ0ngE1m4yARjMKJm9kwQQ65Biu8FB
+1Lr8h5SXBC10XG+ixFZQhm+NF7ZkLvQYIGaMKdKmOIbtIzvQy81uI6Th5rsehjFN
+Kvy4w4p4/ok0e+n4jxbE9I9OftutCGcUiSZcr9J0ow46une/gQLAMBHMw5AfKTI2
+MAqcW7z7qd2asiuGcgnXvMxvXM6qufEAUpg6O/cpHlMefoyVWKfBh3tiao6BTho3
+vIFgIT5BiMzmDRwCIjdRUNIKG5cQAUC9V0sXxj9N9rlNtmgautxsNE05oi5tGYZ6
+ytzySNyvPicRa4Mfg6rSZxj80zDNHI32SeTmViQQAQKBgQDz9CRqBnIXaApdPWT5
+IxoURDcWP4A0Bdaa7AdL6qdQNuNbQja7f9jCeduZndxvd41bZmF79X/X2LhNReY8
+u2HQUy3dpbh3sVbflHxIrlPXMejcX/eUaQJoK30T+gyLu3uo/99Jlj3+5Jt+KVsv
+LVnwnFAW5Bg1wZTTrTn0rlSfSwKBgQDh7bewr1E3K53Qtlz48+ZCCGTljhbwZwct
+EaezinpYrzV090MjOEsTlHgCyJ1usPwcFno21OObtoUR6E6Im+HifnphBtm0FHYe
+DcEHuNOX9Jx8JPAODsODpCUyl2aFi0KzvtX9mqLeU6+JHAJ23aDp8OzkHW1w1tnz
+c8zQPfRxsQKBgEiqIyKVsuw36EZnoCj5hK4et43f8k8MoiTZQz8gsR+aidRH/8eP
+yD/9TiUOuXdWU/uynjzvHlprylHyDSdv5S3JaPMJhs3YO/ky4GZBzuVdj2/9AeDp
++naO5Z3KsGv6t1XaiWcA4oyHCa3loayGxLB/zvdSj8eLVspKYeX4+2nLAoGBAN0Q
+e1J42SEAnpTgO6ylCkLGb+Nl2vAz/4OL6On2r6wjFE10u860gFGSTrN6lQEAUE8z
+dzY7rNJqD17sThvBW48BbsGNsGtSMhlKH/xsTy46fPvEMNewfoJKlNMh7YDyOLwk
+GMLjEkY04GdqbsbcKV1/DmxOlw14TR63ykpgtNShAoGAdFJVLKPPrYDvqOmS3NvX
+yhdFc9bmyUsEMqmEe3jAI9tKgP/7SG3VWTR6dpwWTqVymAs/MC/kxJbD+FY5rxXM
+bwxv0ySXlMBu63abQs9sUAJ735KPq/ZPjOG2Wis68xjcRR39M++sTjRZOS23lvm/
+tlSi3Jk82ZghOYaW/YquRnE=
+-----END PRIVATE KEY-----
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
new file mode 100644
index 0000000000..e776d83a18
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
@@ -0,0 +1,118 @@
+# Application Certificate Management
+
+This document explains how the application uses cryptographic certificates for security, including JWT authentication and Data Protection.
+
+## Overview
+
+The application uses asymmetric cryptography (public/private key pairs) for two critical security functions:
+
+1. **JWT Token Signing & Validation** - Securely issue and verify access tokens
+2. **Data Protection API** - Encrypt sensitive data at rest
+
+## Benefits of Public/Private Key Pairs
+
+### JWT Token Signing
+
+| Key Type | Purpose |
+|----------|---------|
+| **Private Key** | Used by the **issuing server** to **sign** JWT tokens. This key must be kept secret and secure. |
+| **Public Key** | Used by **any service** to **validate** JWT tokens. This key can be freely distributed. |
+
+**Advantages:**
+- Other backend services can validate tokens without needing the private key
+- Compromising the public key doesn't allow token forgery
+- Follows the principle of least privilege
+
+### Data Protection API
+
+| Key Type | Purpose |
+|----------|---------|
+| **Private Key** | Used to **decrypt** protected data (cookies, anti-forgery tokens, etc.) |
+| **Public Key** | Used to **encrypt** data for protection |
+
+**Advantages:**
+- Consistent encryption across multiple server instances
+- Survives application restarts without invalidating protected data
+- Enables load-balanced deployments with shared encryption keys
+
+## Generating Certificates
+
+Use OpenSSL to generate the required certificate files:
+
+```shell
+# 1. Generate the private key (2048-bit RSA)
+openssl genrsa -out AppCertificate.key 2048
+
+# 2. Generate a self-signed X.509 certificate (valid for 1 year)
+openssl req -new -x509 -key AppCertificate.key -out AppCertificate.crt -days 365 -subj "/CN=AppCertificate"
+```
+
+## OpenID Configuration Endpoint
+
+The application exposes an OpenID Connect discovery endpoint at `/.well-known/openid-configuration`. This endpoint provides:
+
+- **JWKS (JSON Web Key Set)** - Contains the public key for token validation
+- **Issuer information** - Identifies the token issuer
+- **Supported algorithms** - Lists the signing algorithms used
+
+### Why Expose This Endpoint?
+
+This allows **other backend services** to securely validate JWTs issued by this API without:
+- Sharing the private key
+- Hardcoding the public key
+- Manual key distribution
+
+The public key is automatically fetched and cached by consuming services.
+
+## Integrating Other Backend Services
+
+Other .NET services can validate tokens issued by this API using the following configuration:
+
+```cs
+builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
+    .AddJwtBearer(options =>
+    {
+        options.Authority = "http://localhost:5030";
+        options.RequireHttpsMetadata = builder.Environment.IsDevelopment() is false;
+        options.TokenValidationParameters = new()
+        {
+            ClockSkew = TimeSpan.Zero,
+            RequireSignedTokens = true,
+
+            ValidateIssuerSigningKey = true,
+
+            RequireExpirationTime = true,
+
+            ValidateAudience = true,
+            ValidAudience = "Boilerplate",
+
+            ValidateIssuer = true,
+            ValidIssuer = "Boilerplate"
+        };
+
+        // OR
+
+        options.TokenValidationParameters = new()
+        {
+            ValidateAudience = false,
+
+            ValidateIssuer = true,
+            ValidIssuer = "Boilerplate"
+        };
+    });
+
+var app = builder.Build();
+
+app.UseAuthentication();
+app.UseAuthorization();
+```
+
+### How It Works
+
+1. The consuming service calls `/.well-known/openid-configuration` on startup
+2. It retrieves the JWKS endpoint URL from the configuration
+3. It fetches the public key(s) from the JWKS endpoint
+4. Incoming JWTs are validated using the fetched public key
+5. Keys are cached and periodically refreshed
+
+This pattern enables a **zero-trust architecture** where services can independently verify token authenticity without sharing secrets.
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj
index 0fce461b5e..b8a7a2922e 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Boilerplate.Server.Api.csproj
@@ -108,6 +108,11 @@
             <StronglyTypedClassName>EmailStrings</StronglyTypedClassName>
             <PublicClass>true</PublicClass>
         </EmbeddedResource>
+
+        <None Update="AppCertificate.*">
+            <DependentUpon>AppCertificate.md</DependentUpon>
+            <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+        </None>
     </ItemGroup>
 
     <!--
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
index 41289f6408..4b2466532a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
@@ -1,7 +1,7 @@
-using System.Text;
-using Microsoft.IdentityModel.Tokens;
+using Microsoft.IdentityModel.Tokens;
 using System.IdentityModel.Tokens.Jwt;
 using Microsoft.AspNetCore.Authentication;
+using Boilerplate.Server.Api.Infrastructure.Services;
 
 namespace Boilerplate.Server.Api.Features.Identity.Services;
 
@@ -12,6 +12,7 @@ public partial class AppJwtSecureDataFormat
     : ISecureDataFormat<AuthenticationTicket>
 {
     private readonly string tokenType;
+    private readonly RsaSecurityKey privateKey;
     private readonly ServerApiSettings appSettings;
     private readonly ILogger<AppJwtSecureDataFormat> logger;
     private readonly TokenValidationParameters validationParameters;
@@ -25,13 +26,16 @@ public AppJwtSecureDataFormat(ServerApiSettings appSettings,
         this.tokenType = tokenType;
         this.appSettings = appSettings;
 
+        privateKey = AppCertificateService.GetPrivateSecurityKey();
+
         validationParameters = new()
         {
             ClockSkew = TimeSpan.Zero,
             RequireSignedTokens = true,
 
+            IssuerSigningKey = AppCertificateService.GetPublicSecurityKey(),
+            ValidAlgorithms = [SecurityAlgorithms.RsaSha256],
             ValidateIssuerSigningKey = env.IsDevelopment() is false,
-            IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(appSettings.Identity.JwtIssuerSigningKeySecret)),
 
             RequireExpirationTime = true,
             ValidateLifetime = tokenType is "AccessToken", /* IdentityController.Refresh will validate expiry itself while refreshing the token */
@@ -105,7 +109,7 @@ public string Protect(AuthenticationTicket data, string? purpose)
                 Audience = appSettings.Identity.Audience,
                 IssuedAt = DateTimeOffset.UtcNow.DateTime,
                 Expires = data.Properties.ExpiresUtc!.Value.UtcDateTime,
-                SigningCredentials = new SigningCredentials(validationParameters.IssuerSigningKey, SecurityAlgorithms.HmacSha512),
+                SigningCredentials = new SigningCredentials(privateKey, SecurityAlgorithms.RsaSha256Signature),
                 Subject = new ClaimsIdentity(data.Principal.Claims),
             });
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/HttpContextExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/HttpContextExtensions.cs
index 3e3c99c37d..ddd4a0dd6f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/HttpContextExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/HttpContextExtensions.cs
@@ -24,28 +24,5 @@ public static bool ContainsExpiredAccessToken(this HttpContext context)
     {
         return context.User.IsAuthenticated() is false && context.Request.Headers.Authorization.Any() is true;
     }
-
-    public static string? GetAccessToken(this HttpContext context)
-    {
-        // 1. Priority: Header (Explicit & CSRF-safe)
-        // We check the Authorization header first. If a client (e.g., Blazor Hybrid App)
-        // explicitly sends a token, it takes precedence over any potentially stale or unrelated cookies.
-        // This aligns with the 'AutoCsrfProtectionFilter' logic, which treats header-based requests as secure.
-        string? authHeader = context.Request.Headers.Authorization;
-        if (string.IsNullOrEmpty(authHeader) is false && authHeader.StartsWith("Bearer ", StringComparison.OrdinalIgnoreCase))
-        {
-            return authHeader["Bearer ".Length..].Trim();
-        }
-
-        // 2. Priority: Cookie (Implicit & requires CSRF checks)
-        // If no header is found, we fall back to the cookie.
-        // This is typically used for standard web browser clients.
-        if (context.Request.Cookies.TryGetValue("access_token", out var cookieToken))
-        {
-            return cookieToken;
-        }
-
-        return null;
-    }
 }
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
new file mode 100644
index 0000000000..54969d31a1
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
@@ -0,0 +1,50 @@
+using Microsoft.IdentityModel.Tokens;
+using System.Security.Cryptography.X509Certificates;
+
+namespace Boilerplate.Server.Api.Infrastructure.Services;
+
+/// <summary>
+/// For more information, checkout AppCertificate.md file in the root directory of the server project.
+/// </summary>
+public static class AppCertificateService
+{
+    private static X509Certificate2? appCert;
+    private static RsaSecurityKey? privateSecurityKey;
+    private static RsaSecurityKey? publicSecurityKey;
+
+    /// <summary>
+    /// This would return AppCertificate containing private key and public key.
+    /// </summary>
+    public static X509Certificate2 GetAppCertificate()
+    {
+        if (appCert is not null)
+            return appCert;
+
+        var keyPemFilePath = Path.Combine(AppContext.BaseDirectory, "AppCertificate.key");
+        var certPemFilePath = Path.Combine(AppContext.BaseDirectory, "AppCertificate.crt");
+
+        appCert = X509Certificate2.CreateFromPemFile(certPemFilePath, keyPemFilePath); // This would work even in restricted shared hosting environments where you don't have access to certificate store.
+        // You could also use pfx file with password or using vaults such as Azure Key Vault etc.
+
+        if (AppEnvironment.IsDevelopment() is false && appCert.Thumbprint is "435DA2895E4409117594DD923571666FA01352B1")
+            throw new InvalidOperationException("You are using the default self-signed certificate in non-development environment. Please use a secure certificate in production.");
+
+        return appCert;
+    }
+
+    /// <summary>
+    /// This would return the private key of app certificate to issue JWT tokens.
+    /// </summary>
+    public static RsaSecurityKey GetPrivateSecurityKey()
+    {
+        return privateSecurityKey ??= new RsaSecurityKey(GetAppCertificate().GetRSAPrivateKey() ?? throw new InvalidOperationException("Private key not found in the certificate.")) { KeyId = "Boilerplate" };
+    }
+
+    /// <summary>
+    /// This would return the public key of app certificate to validate JWT tokens.
+    /// </summary>
+    public static RsaSecurityKey GetPublicSecurityKey()
+    {
+        return publicSecurityKey ??= new RsaSecurityKey(GetAppCertificate().GetRSAPublicKey() ?? throw new InvalidOperationException("Public key not found in the certificate.")) { KeyId = "Boilerplate" };
+    }
+}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppHub.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppHub.cs
index 97f93b2b6a..f1492c41d5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppHub.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/SignalR/AppHub.cs
@@ -82,6 +82,9 @@ public async Task<DiagnosticLogDto[]> GetUserSessionLogs(Guid userSessionId, [Fr
 
     private async Task ChangeAuthenticationStateImplementation(ClaimsPrincipal? user)
     {
+        if (Context.ConnectionAborted.IsCancellationRequested)
+            return;
+
         Context.GetHttpContext()!.User = user ?? new ClaimsPrincipal(new ClaimsIdentity()) /*Anonymous*/;
 
         await using var scope = serviceProvider.CreateAsyncScope();
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
index 458cc5cef8..8eb0221cc5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
@@ -1,6 +1,8 @@
 //+:cnd:noEmit
 
 using Scalar.AspNetCore;
+using Microsoft.IdentityModel.Tokens;
+using Boilerplate.Server.Api.Infrastructure.Services;
 using Boilerplate.Server.Api.Infrastructure.RequestPipeline;
 
 namespace Boilerplate.Server.Api;
@@ -77,8 +79,42 @@ private static void ConfigureMiddlewares(this WebApplication app)
         app.MapMcp("/mcp").RequireAuthorization(); // Map MCP endpoints for chatbot tool
         //#endif
 
+        app.MapOpenIdConfiguration();
+
         app.MapControllers()
            .RequireAuthorization()
            .CacheOutput("AppResponseCachePolicy");
     }
+
+
+    /// <summary>
+    /// This allows other backends to retrieve the OpenID Connect configuration and the public key for validating JWT tokens issued by this server.
+    /// Checkout AppCertificate.md for more information.
+    /// </summary>
+    public static WebApplication MapOpenIdConfiguration(this WebApplication app)
+    {
+        var publicKey = AppCertificateService.GetPublicSecurityKey();
+        var jwk = JsonWebKeyConverter.ConvertFromRSASecurityKey(publicKey);
+        jwk.Use = "sig";
+
+        app.MapGet("/.well-known/openid-configuration", (HttpRequest request) =>
+        {
+            var baseUrl = request.GetBaseUrl();
+            return new
+            {
+                issuer = app.Configuration["Identity:Issuer"],
+                jwks_uri = new Uri(baseUrl, ".well-known/jwks"),
+            };
+        });
+
+        app.MapGet("/.well-known/jwks", () =>
+        {
+            return new
+            {
+                keys = new[] { jwk }
+            };
+        });
+
+        return app;
+    }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index eeeb833a63..c3736c68d2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -421,7 +421,8 @@ void AddDbContext(DbContextOptionsBuilder options)
         });
 
         services.AddDataProtection()
-           .PersistKeysToDbContext<AppDbContext>(); // It's advised to secure database-stored keys with a certificate by invoking ProtectKeysWithCertificate.
+            .PersistKeysToDbContext<AppDbContext>()
+            .ProtectKeysWithCertificate(AppCertificateService.GetAppCertificate());
 
         AddIdentity(builder);
 
@@ -571,7 +572,7 @@ void AddDbContext(DbContextOptionsBuilder options)
         //#endif
 
         // Configure Hangfire to use Redis for persistent background job storage
-        builder.Services.AddHangfire((sp, hangfireConfiguration) =>
+        services.AddHangfire((sp, hangfireConfiguration) =>
         {
             if (appSettings.Hangfire?.UseIsolatedStorage is not true)
             {
@@ -589,6 +590,22 @@ void AddDbContext(DbContextOptionsBuilder options)
                 });
                 //#endif
             }
+            else
+            {
+                hangfireConfiguration.UseEFCoreStorage(optionsBuilder =>
+                {
+                    var connectionString = "Data Source=BoilerplateJobs.db;Mode=Memory;Cache=Shared;";
+                    var connection = new Microsoft.Data.Sqlite.SqliteConnection(connectionString);
+                    connection.Open();
+                    AppContext.SetData("ReferenceTheKeepTheInMemorySQLiteDatabaseAlive", connection);
+                    optionsBuilder.UseSqlite(connectionString);
+                }, new()
+                {
+                    Schema = "jobs",
+                    QueuePollInterval = new TimeSpan(0, 0, 1)
+                })
+                .UseDatabaseCreator();
+            }
 
             hangfireConfiguration.UseRecommendedSerializerSettings();
             hangfireConfiguration.UseSimpleAssemblyNameTypeSerializer();
@@ -596,23 +613,7 @@ void AddDbContext(DbContextOptionsBuilder options)
             hangfireConfiguration.SetDataCompatibilityLevel(CompatibilityLevel.Version_180);
         });
 
-        if (appSettings.Hangfire?.UseIsolatedStorage is true)
-        {
-            services.AddSingleton<JobStorage>(sp => new EFCoreStorage(optionsBuilder =>
-            {
-                var connectionString = "Data Source=BoilerplateJobs.db;Mode=Memory;Cache=Shared;";
-                var connection = new Microsoft.Data.Sqlite.SqliteConnection(connectionString);
-                connection.Open();
-                AppContext.SetData("ReferenceTheKeepTheInMemorySQLiteDatabaseAlive", connection);
-                optionsBuilder.UseSqlite(connectionString);
-            }, new()
-            {
-                Schema = "jobs",
-                QueuePollInterval = new TimeSpan(0, 0, 1)
-            }));
-        }
-
-        builder.Services.AddHangfireServer(options =>
+        services.AddHangfireServer(options =>
         {
             options.SchedulePollingInterval = TimeSpan.FromSeconds(5);
             configuration.Bind("Hangfire", options);
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/ServerApiSettings.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/ServerApiSettings.cs
index 7aa5d42d6a..c1a6199d71 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/ServerApiSettings.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/ServerApiSettings.cs
@@ -81,22 +81,8 @@ public override IEnumerable<ValidationResult> Validate(ValidationContext validat
             Validator.TryValidateObject(SupportedAppVersions, new ValidationContext(SupportedAppVersions), validationResults, true);
         }
 
-        const int MinimumJwtIssuerSigningKeySecretByteLength = 64; // 512 bits = 64 bytes, minimum for HS512
-        var jwtIssuerSigningKeySecretByteLength = Encoding.UTF8.GetBytes(Identity.JwtIssuerSigningKeySecret).Length;
-        if (jwtIssuerSigningKeySecretByteLength <= MinimumJwtIssuerSigningKeySecretByteLength)
-        {
-            throw new ArgumentException(
-                $"The JWT signing key must be greater than {MinimumJwtIssuerSigningKeySecretByteLength} bytes " +
-                $"({MinimumJwtIssuerSigningKeySecretByteLength * 8} bits) for HS512. Current key is {jwtIssuerSigningKeySecretByteLength} bytes.");
-        }
-
         if (AppEnvironment.IsDevelopment() is false)
         {
-            if (Identity.JwtIssuerSigningKeySecret is "VeryLongJWTIssuerSigningKeySecretThatIsMoreThan64BytesToEnsureCompatibilityWithHS512Algorithm")
-            {
-                throw new InvalidOperationException(@"Please replace JwtIssuerSigningKeySecret with a new one.");
-            }
-
             //#if (captcha == "reCaptcha")
             if (GoogleRecaptchaSecretKey is "6LdMKr4pAAAAANvngWNam_nlHzEDJ2t6SfV6L_DS")
             {
@@ -118,9 +104,6 @@ public override IEnumerable<ValidationResult> Validate(ValidationContext validat
 
 public partial class AppIdentityOptions : IdentityOptions
 {
-    [Required]
-    public string JwtIssuerSigningKeySecret { get; set; } = default!;
-
     /// <summary>
     /// BearerTokenExpiration used as JWT's expiration claim, access token's `expires in` and cookie's `max age`.
     /// </summary>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
index 45f107294d..f1cd2bb0f9 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
@@ -76,7 +76,6 @@
     },
     //#endif
     "Identity": {
-        "JwtIssuerSigningKeySecret": "VeryLongJWTIssuerSigningKeySecretThatIsMoreThan64BytesToEnsureCompatibilityWithHS512Algorithm",
         "Issuer": "Boilerplate",
         "Audience": "Boilerplate",
         "BearerTokenExpiration": "0.00:05:00",
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
index e557c92843..d5976fb86d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
@@ -106,6 +106,7 @@
 serverApiProject.WithReference(keycloak);
 //#if (redis == true)
 serverApiProject.WithReference(redisCache).WaitFor(redisCache);
+serverWebProject.WithReference(redisCache).WaitFor(redisCache);
 serverApiProject.WithReference(redisPersistent).WaitFor(redisPersistent);
 //#endif
 //#else
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/HttpContextExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/HttpContextExtensions.cs
index 096ec12cb0..fd0bb83ac6 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/HttpContextExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/HttpContextExtensions.cs
@@ -30,4 +30,27 @@ public static bool IsSharedResponseCacheEnabled(this HttpContext context)
 
         return false;
     }
+
+    public static string? GetAccessToken(this HttpContext context)
+    {
+        // 1. Priority: Header (Explicit & CSRF-safe)
+        // We check the Authorization header first. If a client (e.g., Blazor Hybrid App)
+        // explicitly sends a token, it takes precedence over any potentially stale or unrelated cookies.
+        // This aligns with the 'AutoCsrfProtectionFilter' logic, which treats header-based requests as secure.
+        string? authHeader = context.Request.Headers.Authorization;
+        if (string.IsNullOrEmpty(authHeader) is false && authHeader.StartsWith("Bearer ", StringComparison.OrdinalIgnoreCase))
+        {
+            return authHeader["Bearer ".Length..].Trim();
+        }
+
+        // 2. Priority: Cookie (Implicit & requires CSRF checks)
+        // If no header is found, we fall back to the cookie.
+        // This is typically used for standard web browser clients.
+        if (context.Request.Cookies.TryGetValue("access_token", out var cookieToken))
+        {
+            return cookieToken;
+        }
+
+        return null;
+    }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Boilerplate.Server.Web.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Boilerplate.Server.Web.csproj
index 7eb3adb92c..c980d1a80d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Boilerplate.Server.Web.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Boilerplate.Server.Web.csproj
@@ -21,6 +21,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\Boilerplate.Server.Shared\Boilerplate.Server.Shared.csproj" />
+        <PackageReference Condition=" '$(api)' == 'Standalone' " Include="Microsoft.AspNetCore.Authentication.JwtBearer" />
         <ProjectReference Condition=" '$(api)' == 'Integrated' OR '$(api)' == ''" Include="..\Boilerplate.Server.Api\Boilerplate.Server.Api.csproj" />
         <ProjectReference Include="..\..\Client\Boilerplate.Client.Web\Boilerplate.Client.Web.csproj" />
         <ProjectReference Include="..\..\Client\Boilerplate.Client.Core\Boilerplate.Client.Core.csproj" />
@@ -40,6 +41,11 @@
             <Link>%(Filename)%(Extension)</Link>
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
         </None>
+        <None Include="..\Boilerplate.Server.Api\AppCertificate*">
+            <Link>%(Filename)%(Extension)</Link>
+            <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+            <DependentUpon>AppCertificate.md</DependentUpon>
+        </None>
     </ItemGroup>
 
     <!--
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Infrastructure/Services/SimpleJwtSecureDataFormat.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Infrastructure/Services/SimpleJwtSecureDataFormat.cs
deleted file mode 100644
index 6e41bd52ac..0000000000
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Infrastructure/Services/SimpleJwtSecureDataFormat.cs
+++ /dev/null
@@ -1,53 +0,0 @@
-using Microsoft.AspNetCore.Identity;
-using Microsoft.AspNetCore.Authentication;
-using Boilerplate.Client.Core.Infrastructure.Services.Contracts;
-
-namespace Boilerplate.Server.Web.Infrastructure.Services;
-
-/// <summary>
-/// In standalone API mode, this code only runs during Blazor pre-rendering or Blazor Server.
-/// Since the `AppJwtSecureDataFormat` in the Server.Api project strictly validates access tokens using the provided JwtIssuerSigningKeySecret, 
-/// strict validation isn't necessary here. Instead, we simply parse the token, similar to how it's handled on the client side (Blazor WASM and Blazor Hybrid).
-/// </summary>
-public partial class SimpleJwtSecureDataFormat : ISecureDataFormat<AuthenticationTicket>
-{
-    public AuthenticationTicket? Unprotect(string? protectedText) => Unprotect(protectedText, null);
-
-    public AuthenticationTicket? Unprotect(string? protectedText, string? purpose)
-    {
-        try
-        {
-            if (string.IsNullOrEmpty(protectedText))
-            {
-                return NotSignedIn();
-            }
-
-            var claimsPrincipal = IAuthTokenProvider.ParseAccessToken(protectedText, validateExpiry: true);
-            var properties = new AuthenticationProperties() { ExpiresUtc = DateTimeOffset.FromUnixTimeSeconds(long.Parse(claimsPrincipal.FindFirstValue("exp")!)) };
-            var data = new AuthenticationTicket(claimsPrincipal, properties: properties, IdentityConstants.BearerScheme);
-
-            return data;
-        }
-        catch (Exception ex)
-        {
-            if (AppEnvironment.IsDevelopment())
-            {
-                Console.WriteLine(ex); // since we do not have access to any logger at this point!
-            }
-
-            return NotSignedIn();
-        }
-    }
-
-    private static AuthenticationTicket NotSignedIn()
-    {
-        return new AuthenticationTicket(IAuthTokenProvider.Anonymous(), string.Empty);
-    }
-
-    public string Protect(AuthenticationTicket data) => Protect(data, null);
-
-    public string Protect(AuthenticationTicket data, string? purpose)
-    {
-        throw new NotImplementedException(); // In standalone API mode, Blazor Server is not expected to issue JWT tokens.
-    }
-}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
index b03ed30be6..47e979693f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
@@ -8,6 +8,7 @@
 //#if (api == "Integrated")
 using Hangfire;
 using Scalar.AspNetCore;
+using Boilerplate.Server.Api;
 using Boilerplate.Server.Api.Infrastructure.RequestPipeline;
 //#endif
 
@@ -144,6 +145,8 @@ public static void ConfigureMiddlewares(this WebApplication app)
         app.MapMcp("/mcp").RequireAuthorization(); // Map MCP endpoints for chatbot tool
         //#endif
 
+        app.MapOpenIdConfiguration();
+
         app.MapControllers()
            .RequireAuthorization()
            .CacheOutput("AppResponseCachePolicy");
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Services.cs
index aad1f0b05d..a59ddabcd1 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Services.cs
@@ -2,6 +2,8 @@
 using Microsoft.Net.Http.Headers;
 //#if (api == "Integrated")
 using Boilerplate.Server.Api;
+//#else
+using Microsoft.AspNetCore.Authentication.JwtBearer;
 //#endif
 using Boilerplate.Client.Web;
 using Boilerplate.Server.Shared;
@@ -35,20 +37,45 @@ public static void AddServerWebProjectServices(this WebApplicationBuilder builde
         //#endif
         builder.AddServerSharedServices();
         builder.AddDefaultHealthChecks();
-        services.AddAuthentication(options =>
+        services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme).AddJwtBearer(options =>
         {
-            options.DefaultScheme = Microsoft.AspNetCore.Identity.IdentityConstants.BearerScheme;
-        }).AddBearerToken(Microsoft.AspNetCore.Identity.IdentityConstants.BearerScheme, options =>
-        {
-            options.BearerTokenProtector = new SimpleJwtSecureDataFormat();
-            options.RefreshTokenProtector = new SimpleJwtSecureDataFormat();
+            options.Authority = configuration.GetServerAddress();
+            options.RequireHttpsMetadata = builder.Environment.IsDevelopment() is false;
+            options.TokenValidationParameters = new()
+            {
+                ClockSkew = TimeSpan.Zero,
+                RequireSignedTokens = true,
+
+                ValidateIssuerSigningKey = true,
+
+                RequireExpirationTime = true,
+
+                ValidateAudience = true,
+                ValidAudience = configuration["Identity:Audience"],
+
+                ValidateIssuer = true,
+                ValidIssuer = configuration["Identity:Issuer"]
+            };
 
             options.Events = new()
             {
                 OnMessageReceived = async context =>
                 {
-                    // The server accepts the accessToken from either the authorization header, the cookie, or the request URL query string
-                    context.Token ??= context.Request.Query.ContainsKey("access_token") ? context.Request.Query["access_token"] : context.Request.Cookies["access_token"];
+                    // The server accepts the accessToken from either the authorization header or the cookie.
+                    context.Token ??= context.HttpContext.GetAccessToken();
+                },
+                OnTokenValidated = async context =>
+                {
+                    var principal = context.Principal!;
+                    var identity = (ClaimsIdentity)principal.Identity!;
+
+                    if (principal.IsInRole(AppRoles.SuperAdmin))
+                    {
+                        foreach (var feat in AppFeatures.GetSuperAdminFeatures())
+                        {
+                            identity.AddClaim(new Claim(AppClaimTypes.FEATURES, feat.Value));
+                        }
+                    }
                 }
             };
         });
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
index 6c5a21c6f3..89ad72ef19 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
@@ -12,7 +12,6 @@
         "s3": "Endpoint=http://localhost:9000;AccessKey=minioadmin;SecretKey=minioadmin;"
     },
     "Identity": {
-        "JwtIssuerSigningKeySecret": "VeryLongJWTIssuerSigningKeySecretThatIsMoreThan64BytesToEnsureCompatibilityWithHS512Algorithm",
         "Issuer": "Boilerplate",
         "Audience": "Boilerplate",
         "BearerTokenExpiration": "0.00:05:00",
@@ -174,5 +173,18 @@
     },
     "ServerSideHttpClientBaseAddress": null,
     "ServerSideHttpClientBaseAddress_Comment": "Read ServerWebSettings.ServerSideHttpClientBaseAddress comments",
+    //#if (api == "Standalone")
+    //#if (IsInsideProjectTemplate)
+    /*
+    //#endif
+    "Identity": {
+        "Issuer": "Boilerplate",
+        "Audience": "Boilerplate"
+    },
+    "Identity__Comment": "The Server.Api's Issuer and Audience are required in Server.Web as well in Standalone API mode, so Server.Web can securely validate JWT tokens during pre-rendering.",
+    //#if (IsInsideProjectTemplate)
+    */
+    //#endif
+    //#endif
     "$schema": "https://json.schemastore.org/appsettings.json"
 }

From db62273fc0239e7dbb63c6a16f618ffe087dce61 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Wed, 25 Feb 2026 15:17:48 +0330
Subject: [PATCH 24/66] feat(blazorui): apply some minor improvements to
 BitButton component #12122 (#12123)

---
 .../Buttons/Button/BitButton.razor.cs         |  52 +++--
 .../Components/Buttons/Button/BitButton.scss  |   4 +-
 .../Buttons/Button/BitButtonClassStyles.cs    |  21 +-
 .../Buttons/Button/BitButtonDemo.razor        |  85 ++++---
 .../Buttons/Button/BitButtonDemo.razor.cs     |  78 ++++---
 .../Button/BitButtonDemo.razor.samples.cs     |  69 +++---
 .../Pages/Home/HeroSection.razor              |   2 +-
 .../Pages/OverviewPage.razor                  |   4 +-
 .../Components/Buttons/BitButtonTests.cs      | 213 ++++++++++++++++--
 9 files changed, 390 insertions(+), 138 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs
index baf556a38d..6b07a478bf 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.razor.cs
@@ -1,4 +1,4 @@
-using Microsoft.AspNetCore.Components.Forms;
+using Microsoft.AspNetCore.Components.Forms;
 
 namespace Bit.BlazorUI;
 
@@ -8,7 +8,7 @@ namespace Bit.BlazorUI;
 public partial class BitButton : BitComponentBase
 {
     private string? _rel;
-    private int? _tabIndex;
+    private string? _tabIndex;
     private bool _dragging;
     private BitButtonType _buttonType;
     private DotNetObjectReference<BitButton>? _dotnetObj;
@@ -21,23 +21,24 @@ public partial class BitButton : BitComponentBase
 
     /// <summary>
     /// The EditContext, which is set if the button is inside an <see cref="EditForm"/>.
+    /// The value is coming from the cascading value provided by the EditForm.
     /// </summary>
     [CascadingParameter] public EditContext? EditContext { get; set; }
 
 
 
     /// <summary>
-    /// Whether the button can have focus in disabled mode.
+    /// Keeps the disabled button focusable by not forcing a negative tabindex when <see cref="BitComponentBase.IsEnabled"/> is false.
     /// </summary>
     [Parameter] public bool AllowDisabledFocus { get; set; } = true;
 
     /// <summary>
-    /// Detailed description of the button for the benefit of screen readers.
+    /// Detailed description of the button for the benefit of screen readers (rendered into <c>aria-describedby</c>).
     /// </summary>
     [Parameter] public string? AriaDescription { get; set; }
 
     /// <summary>
-    /// If true, adds an aria-hidden attribute instructing screen readers to ignore the element.
+    /// If true, adds an <c>aria-hidden</c> attribute instructing screen readers to ignore the button.
     /// </summary>
     [Parameter] public bool AriaHidden { get; set; }
 
@@ -47,7 +48,7 @@ public partial class BitButton : BitComponentBase
     [Parameter] public bool AutoLoading { get; set; }
 
     /// <summary>
-    /// The value of the type attribute of the button.
+    /// The type of the button element; defaults to <c>submit</c> inside an <see cref="EditForm"/> otherwise <c>button</c>.
     /// </summary>
     [Parameter] public BitButtonType? ButtonType { get; set; }
 
@@ -132,8 +133,16 @@ public partial class BitButton : BitComponentBase
     [Parameter] public BitIconInfo? Icon { get; set; }
 
     /// <summary>
-    /// The name of the icon to render inside the button.
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
     /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Emoji</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery: 
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
@@ -142,6 +151,12 @@ public partial class BitButton : BitComponentBase
     [Parameter, ResetClassBuilder]
     public bool IconOnly { get; set; }
 
+    /// <summary>
+    /// Gets or sets the position of the icon relative to the component's content.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public BitIconPosition? IconPosition { get; set; }
+
     /// <summary>
     /// The url of the custom icon to render inside the button.
     /// </summary>
@@ -169,7 +184,7 @@ public partial class BitButton : BitComponentBase
     [Parameter] public RenderFragment? LoadingTemplate { get; set; }
 
     /// <summary>
-    /// The callback for the click event of the button with a bool argument passing the current loading state.
+    /// Raised when the button is clicked; receives a bool indicating the current loading state.
     /// </summary>
     [Parameter] public EventCallback<bool> OnClick { get; set; }
 
@@ -185,13 +200,8 @@ public partial class BitButton : BitComponentBase
     [Parameter] public bool Reclickable { get; set; }
 
     /// <summary>
-    /// Reverses the positions of the icon and the main content of the button.
-    /// </summary>
-    [Parameter, ResetClassBuilder]
-    public bool ReversedIcon { get; set; }
-
-    /// <summary>
-    /// If Href provided, specifies the relationship between the current document and the linked document.
+    /// Sets the <c>rel</c> attribute for link-rendered buttons when <see cref="Href"/> is a non-anchor URL; ignored for empty or hash-only hrefs.
+    /// The <c>rel</c> attribute specifies the relationship between the current document and the linked document.
     /// </summary>
     [Parameter]
     [CallOnSet(nameof(OnSetHrefAndRel))]
@@ -210,13 +220,13 @@ public partial class BitButton : BitComponentBase
     public RenderFragment? SecondaryTemplate { get; set; }
 
     /// <summary>
-    /// The size of the button.
+    /// Sets the preset size for typography and padding of the button.
     /// </summary>
     [Parameter, ResetClassBuilder]
     public BitSize? Size { get; set; }
 
     /// <summary>
-    /// Custom CSS styles for different parts of the button.
+    /// Custom inline styles for different parts of the button.
     /// </summary>
     [Parameter] public BitButtonClassStyles? Styles { get; set; }
 
@@ -311,7 +321,7 @@ protected override void RegisterCssClasses()
             _ => "bit-btn-md"
         });
 
-        ClassBuilder.Register(() => ReversedIcon ? "bit-btn-rvi" : string.Empty);
+        ClassBuilder.Register(() => IconPosition is BitIconPosition.End ? "bit-btn-eni" : string.Empty);
 
         ClassBuilder.Register(() => FixedColor ? "bit-btn-fxc" : string.Empty);
 
@@ -352,7 +362,11 @@ protected override void OnParametersSet()
     {
         if (IsEnabled is false)
         {
-            _tabIndex = AllowDisabledFocus ? null : -1;
+            _tabIndex = AllowDisabledFocus ? null : "-1";
+        }
+        else
+        {
+            _tabIndex = TabIndex ?? _tabIndex;
         }
 
         _buttonType = ButtonType ?? (EditContext is null ? BitButtonType.Button : BitButtonType.Submit);
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
index 0a514d8af6..fd19b00d45 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-btn {
     cursor: pointer;
@@ -68,7 +68,7 @@
     height: var(--bit-btn-icn-size);
 }
 
-.bit-btn-rvi {
+.bit-btn-eni {
     flex-direction: row-reverse;
 }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButtonClassStyles.cs b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButtonClassStyles.cs
index 2167cebd6a..bcb1a6330d 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButtonClassStyles.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButtonClassStyles.cs
@@ -1,44 +1,47 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
+/// <summary>
+/// Defines per-part CSS class/style values for <see cref="BitButton"/>.
+/// </summary>
 public class BitButtonClassStyles
 {
     /// <summary>
-    /// Custom CSS classes/styles for the root element of the BitButton.
+    /// Custom class or style applied to the root element.
     /// </summary>
     public string? Root { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the icon of the BitButton.
+    /// Custom class or style applied to the icon element.
     /// </summary>
     public string? Icon { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the internal container of the BitButton.
+    /// Custom class or style applied to the internal container.
     /// </summary>
     public string? Container { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the primary section of the BitButton.
+    /// Custom class or style applied to the primary section.
     /// </summary>
     public string? Primary { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the secondary section of the BitButton.
+    /// Custom class or style applied to the secondary section.
     /// </summary>
     public string? Secondary { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the loading container of the BitButton.
+    /// Custom class or style applied to the loading container.
     /// </summary>
     public string? LoadingContainer { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the spinner of the BitButton.
+    /// Custom class or style applied to the spinner element.
     /// </summary>
     public string? Spinner { get; set; }
 
     /// <summary>
-    /// Custom CSS classes/styles for the loading label of the BitButton.
+    /// Custom class or style applied to the loading label.
     /// </summary>
     public string? LoadingLabel { get; set; }
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor
index fe234f02c7..686fc9883a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor
@@ -32,6 +32,7 @@
 
     <DemoExample Title="Variant" RazorCode="@example3RazorCode" Id="example3">
         <div>The Button offers three style variants: Fill (default), Outline, and Text.</div>
+        <div>Using the <b>Variant</b> parameter and its value of type <BitLink Href="#variant-enum">BitVariant</BitLink> enum:</div>
         <br />
         <div class="example-content">
             <BitButton Variant="BitVariant.Fill">Fill</BitButton>
@@ -58,8 +59,19 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Icon" RazorCode="@example4RazorCode" Id="example4">
-        <div>BitButton has an icon slot that, if specified, renders an icon that can be set at the start (default) or revered positioned at the end of component.</div>
+    <DemoExample Title="Title" RazorCode="@example4RazorCode" Id="example4">
+        <div>The Title parameter sets a tooltip that appears when hovering over the button.</div>
+        <br />
+        <div class="example-content">
+            <BitButton Title="This is a tooltip" Variant="BitVariant.Fill">Hover me</BitButton>
+            <BitButton Title="Another tooltip" Variant="BitVariant.Outline">Hover me</BitButton>
+            <BitButton Title="Text tooltip" Variant="BitVariant.Text">Hover me</BitButton>
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Icon" RazorCode="@example5RazorCode" Id="example5">
+        <div>BitButton has an icon slot that, if specified, renders an icon at the start (default) or end of the component using <b>IconPosition</b>.</div>
+        <div>Using the <b>IconPosition</b> parameter and <BitLink Href="#icon-position-enum">BitIconPosition</BitLink> enum as its value:</div>
         <br />
         <div class="example-content">
             <BitButton IconName="@BitIconName.EmojiNeutral" Variant="BitVariant.Fill" />
@@ -80,15 +92,15 @@
         </div>
         <br />
         <div class="example-content">
-            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Fill" ReversedIcon>End</BitButton>
-            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Outline" ReversedIcon>End</BitButton>
-            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Text" ReversedIcon>End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Fill" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Outline" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" Variant="BitVariant.Text" IconPosition="BitIconPosition.End">End</BitButton>
         </div>
         <br />
         <div class="example-content">
-            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Fill" ReversedIcon>End</BitButton>
-            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Outline" ReversedIcon>End</BitButton>
-            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Text" ReversedIcon>End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Fill" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Outline" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconName="@BitIconName.Emoji2" SecondaryText="this is the secondary text" Variant="BitVariant.Text" IconPosition="BitIconPosition.End">End</BitButton>
         </div>
         <br /><br />
         <div class="example-content">
@@ -98,13 +110,13 @@
         </div>
         <br />
         <div class="example-content">
-            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Fill" ReversedIcon>End</BitButton>
-            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Outline" ReversedIcon>End</BitButton>
-            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Text" ReversedIcon>End</BitButton>
+            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Fill" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Outline" IconPosition="BitIconPosition.End">End</BitButton>
+            <BitButton IconUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/bit-logo.svg" SecondaryText="IconUrl" Variant="BitVariant.Text" IconPosition="BitIconPosition.End">End</BitButton>
         </div>
     </DemoExample>
 
-    <DemoExample Title="Loading" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
+    <DemoExample Title="Loading" RazorCode="@example6RazorCode" CsharpCode="@example6CsharpCode" Id="example6">
         <div>Demonstrate the dynamic loading state of buttons using the "IsLoading" property. Customize the loading label to provide users with feedback on ongoing processes.</div>
         <br /><br />
         <div class="example-content">
@@ -147,8 +159,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Loading Label" RazorCode="@example6RazorCode" Id="example6">
+    <DemoExample Title="Loading Label" RazorCode="@example7RazorCode" Id="example7">
         <div>Explore customizing the loading label and its different positions, including start, end, bottom, and top.</div>
+        <div>Using the <b>LoadingLabelPosition</b> parameter and its value of type <BitLink Href="#label-position-enum">BitLabelPosition</BitLink> enum:</div>
         <br />
         <div class="example-content">
             <BitButton IsLoading="true"
@@ -187,7 +200,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Href" RazorCode="@example7RazorCode" Id="example7">
+    <DemoExample Title="Href" RazorCode="@example8RazorCode" Id="example8">
         <div>Use BitButton as a hyperlink to external URLs, opening either in a new tab or the same tab.</div>
         <br />
         <div class="example-content">
@@ -201,8 +214,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Rel" RazorCode="@example8RazorCode" Id="example8">
+    <DemoExample Title="Rel" RazorCode="@example9RazorCode" Id="example9">
         <div>Use BitButton as a hyperlink to external URLs, with a rel attribute.</div>
+        <div>The actual <b>rel</b> attribute value is generated using the provided <BitLink Href="#link-rels">BitLinkRels</BitLink> and Href value.</div>
         <br />
         <div class="example-content">
             <BitButton Rel="BitLinkRels.NoFollow" Href="https://bitplatform.dev" Target="_blank" IconName="@BitIconName.Globe" Variant="BitVariant.Outline">
@@ -215,8 +229,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Float & Draggable" RazorCode="@example9RazorCode" CsharpCode="@example9CsharpCode" Id="example9">
+    <DemoExample Title="Float & Draggable" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
         <div>Demonstrates a floating button with adjustable float modes and customizable positions.</div>
+        <div>Using the <b>FloatPosition</b> parameter and its value of type <BitLink Href="#button-position">BitPosition</BitLink> enum:</div>
         <br />
         <div class="example-content">
             <BitDropdown Label="FloatPosition" Items="floatPositionList" @bind-Value="floatPosition" FitWidth />
@@ -268,8 +283,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Button Type" RazorCode="@example10RazorCode" CsharpCode="@example10CsharpCode" Id="example10">
+    <DemoExample Title="Button Type" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
         <div>BitButton supports three different types, 'Submit' for sending form data, 'Reset' to clear form inputs, and 'Button' to provide flexibility for different interaction purposes.</div>
+        <div>Using the <b>ButtonType</b> parameter and its value of type <BitLink Href="#button-type-enum">BitButtonType</BitLink> enum:</div>
         <br />
         <div class="form-container">
             @if (formIsValidSubmit is false)
@@ -298,7 +314,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Templates" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+    <DemoExample Title="Templates" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
         <div>Here are some examples of customizing the button content.</div>
         <br />
         <div>
@@ -307,7 +323,9 @@
                 <span>A primary template</span>
                 <BitRippleLoading CustomSize="20" Color="BitColor.Tertiary" />
             </BitButton>
-            <br />
+
+            <br /><br />
+
             <BitButton Class="custom-content" Variant="BitVariant.Outline">
                 <PrimaryTemplate>Primary text</PrimaryTemplate>
                 <SecondaryTemplate>
@@ -316,7 +334,9 @@
                     <BitRollerLoading CustomSize="20" />
                 </SecondaryTemplate>
             </BitButton>
-            <br />
+            
+            <br /><br />
+
             <BitButton Class="custom-content" Variant="BitVariant.Text">
                 <PrimaryTemplate>
                     <BitIcon IconName="@BitIconName.Airplane" />
@@ -331,10 +351,10 @@
             </BitButton>
         </div>
         <br /><br />
-        <div>Utilize the "LoadingTemplate" feature to design personalized loading indicators and messages, providing a unique visual experience during loading states.</div>
+        <div>Utilize the <b>LoadingTemplate</b> feature to design personalized loading indicators and messages, providing a unique visual experience during loading states.</div>
         <br />
         <div class="example-content">
-            <BitButton IsLoading="!templateIsLoading" OnClick="LoadingTemplateClick">
+            <BitButton IsLoading="templateIsLoading" OnClick="LoadingTemplateClick">
                 <PrimaryTemplate>Click me</PrimaryTemplate>
                 <LoadingTemplate>
                     <div style="display:flex;align-items:center;">
@@ -346,7 +366,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Events" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <DemoExample Title="Events" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
         <div>
             Managing button click event (OnClick).
         </div>
@@ -356,8 +376,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Size" RazorCode="@example13RazorCode" Id="example13">
+    <DemoExample Title="Size" RazorCode="@example14RazorCode" Id="example14">
         <div>Varying sizes for buttons tailored to meet diverse design needs, ensuring flexibility and visual hierarchy within your interface.</div>
+        <div>Using the <b>Size</b> parameter and its value of type <BitLink Href="#size-enum">BitSize</BitLink> enum:</div>
         <br />
         <div><b>Small</b>:</div><br />
         <BitButton Size="BitSize.Small" IconName="@BitIconName.Emoji2" Variant="BitVariant.Fill" />
@@ -433,14 +454,15 @@
         <BitButton Size="BitSize.Large" SecondaryText="this is the secondary text" IconName="@BitIconName.Emoji2" Variant="BitVariant.Text">Text</BitButton>
     </DemoExample>
 
-    <DemoExample Title="FullWidth" RazorCode="@example14RazorCode" Id="example14">
+    <DemoExample Title="FullWidth" RazorCode="@example15RazorCode" Id="example15">
         <div>Setting the FullWidth makes the button occupy 100% of its container's width.</div>
         <br />
         <BitButton FullWidth IconName="@BitIconName.Emoji2" Variant="BitVariant.Fill">Full Width Button</BitButton>
     </DemoExample>
 
-    <DemoExample Title="FixedColor" RazorCode="@example15RazorCode" Id="example15">
+    <DemoExample Title="FixedColor" RazorCode="@example16RazorCode" Id="example16">
         <div>FixedColor flag parameter makes the foreground color to be fixed regardless of its hovering state.</div>
+        <div>Using the <b>Color</b> parameter and its value of type <BitLink Href="#color-enum">BitColor</BitLink> enum:</div>
         <br />
         <BitButton FixedColor IconOnly
                    Size="BitSize.Large"
@@ -455,8 +477,9 @@
                    Color="BitColor.TertiaryBackground" />
     </DemoExample>
 
-    <DemoExample Title="Color" RazorCode="@example16RazorCode" Id="example16">
+    <DemoExample Title="Color" RazorCode="@example17RazorCode" Id="example17">
         <div>Offering a range of specialized color variants with Primary being the default, providing visual cues for specific actions or states within your application.</div>
+        <div>Using the <b>Color</b> parameter and its value of type <BitLink Href="#color-enum">BitColor</BitLink> enum:</div>
         <br />
         <div>
             <BitButton Color="BitColor.Primary">Primary</BitButton>
@@ -567,8 +590,9 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="External Icons" RazorCode="@example17RazorCode" Id="example17">
+    <DemoExample Title="External Icons" RazorCode="@example18RazorCode" Id="example18">
         <div>Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+        <div>See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.</div>
 
         <br />
         <br />
@@ -634,8 +658,9 @@
         </BitButton>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example18RazorCode" CsharpCode="@example18CsharpCode" Id="example18">
+    <DemoExample Title="Style & Class" RazorCode="@example19RazorCode" CsharpCode="@example19CsharpCode" Id="example19">
         <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
+        <div>Using the <b>Styles</b> and <b>Classes</b> parameters and their value of <BitLink Href="#button-class-styles">BitButtonClassStyles</BitLink> class:</div>
         <br /><br />
         <div>Component's Style & Class:</div>
         <br />
@@ -675,7 +700,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example19RazorCode" Id="example19">
+    <DemoExample Title="RTL" RazorCode="@example20RazorCode" Id="example20">
         <div>Use BitButton in right-to-left (RTL).</div>
         <br />
         <div class="example-content" dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.cs
index a53ad46010..adab405526 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.Button;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.Button;
 
 public partial class BitButtonDemo
 {
@@ -9,21 +9,21 @@ public partial class BitButtonDemo
             Name = "AllowDisabledFocus",
             Type = "bool",
             DefaultValue = "true",
-            Description = "Whether the button can have focus in disabled mode.",
+            Description = "Keeps the disabled button focusable by not forcing a negative tabindex when IsEnabled is false.",
         },
         new()
         {
             Name = "AriaDescription",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Detailed description of the button for the benefit of screen readers.",
+            Description = "Detailed description of the button for the benefit of screen readers (rendered into aria-describedby).",
         },
         new()
         {
             Name = "AriaHidden",
             Type = "bool",
             DefaultValue = "false",
-            Description = "If true, adds an aria-hidden attribute instructing screen readers to ignore the element.",
+            Description = "If true, adds an aria-hidden attribute instructing screen readers to ignore the button.",
         },
         new()
         {
@@ -37,7 +37,7 @@ public partial class BitButtonDemo
             Name = "ButtonType",
             Type = "BitButtonType?",
             DefaultValue = "null",
-            Description = "The value of the type attribute of the button.",
+            Description = "The type of the button element; defaults to submit inside an EditForm otherwise button.",
             LinkType = LinkType.Link,
             Href = "#button-type-enum",
         },
@@ -138,7 +138,9 @@ public partial class BitButtonDemo
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The name of the icon to render inside the button from the built-in Fluent UI icons."
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -148,6 +150,15 @@ public partial class BitButtonDemo
             Description = "Determines that only the icon should be rendered."
         },
         new()
+        {
+            Name = "IconPosition",
+            Type = "BitIconPosition?",
+            DefaultValue = "null",
+            Description = "Gets or sets the position of the icon relative to the component's content.",
+            LinkType = LinkType.Link,
+            Href = "#icon-position-enum",
+        },
+        new()
         {
             Name = "IconUrl",
             Type = "string?",
@@ -189,7 +200,7 @@ public partial class BitButtonDemo
             Name = "OnClick",
             Type = "EventCallback<bool>",
             DefaultValue = "",
-            Description = "The callback for the click event of the button with a bool argument passing the current loading state.",
+            Description = "Raised when the button is clicked; receives a bool indicating the current loading state.",
         },
         new()
         {
@@ -206,18 +217,11 @@ public partial class BitButtonDemo
             Description = "Enables re-clicking in loading state when AutoLoading is enabled.",
         },
         new()
-        {
-            Name = "ReversedIcon",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Reverses the positions of the icon and the main content of the button.",
-        },
-        new()
         {
             Name = "Rel",
             Type = "BitLinkRels?",
             DefaultValue = "null",
-            Description = "If Href provided, specifies the relationship between the current document and the linked document.",
+            Description = "Sets the rel attribute for link-rendered buttons when Href is a non-anchor URL; ignored for empty or hash-only hrefs.",
             LinkType = LinkType.Link,
             Href = "#link-rels",
         },
@@ -240,7 +244,7 @@ public partial class BitButtonDemo
             Name = "Size",
             Type = "BitSize?",
             DefaultValue = "null",
-            Description = "The size of the button.",
+            Description = "Sets the preset size for typography and padding of the button.",
             LinkType = LinkType.Link,
             Href = "#size-enum",
         },
@@ -249,7 +253,7 @@ public partial class BitButtonDemo
             Name = "Styles",
             Type = "BitButtonClassStyles?",
             DefaultValue = "null",
-            Description = "Custom CSS styles for different parts of the button.",
+            Description = "Custom inline styles for different parts of the button.",
             LinkType = LinkType.Link,
             Href = "#button-class-styles",
         },
@@ -284,6 +288,7 @@ public partial class BitButtonDemo
         {
             Id = "button-class-styles",
             Title = "BitButtonClassStyles",
+            Description = "Defines per-part CSS class/style values for BitButton.",
             Parameters =
             [
                new()
@@ -291,56 +296,56 @@ public partial class BitButtonDemo
                    Name = "Root",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the root element of the BitButton."
+                   Description = "Custom class or style applied to the root element."
                },
                new()
                {
                    Name = "Icon",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the icon of the BitButton."
+                   Description = "Custom class or style applied to the icon element."
                },
                new()
                {
                    Name = "Container",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the internal container of the BitButton."
+                   Description = "Custom class or style applied to the internal container."
                },
                new()
                {
                    Name = "Primary",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the primary section of the BitButton."
+                   Description = "Custom class or style applied to the primary section."
                },
                new()
                {
                    Name = "Secondary",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the secondary section of the BitButton."
+                   Description = "Custom class or style applied to the secondary section."
                },
                new()
                {
                    Name = "LoadingContainer",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the loading container of the BitButton."
+                   Description = "Custom class or style applied to the loading container."
                },
                new()
                {
                    Name = "Spinner",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the spinner section of the BitButton."
+                   Description = "Custom class or style applied to the spinner element."
                },
                new()
                {
                    Name = "LoadingLabel",
                    Type = "string?",
                    DefaultValue = "null",
-                   Description = "Custom CSS classes/styles for the loading label section of the BitButton."
+                   Description = "Custom class or style applied to the loading label."
                },
             ]
         },
@@ -570,6 +575,27 @@ public partial class BitButtonDemo
             ]
         },
         new()
+        {
+            Id = "icon-position-enum",
+            Name = "BitIconPosition",
+            Description = "Describes the placement of an icon relative to other content.",
+            Items =
+            [
+                new()
+                {
+                    Name = "Start",
+                    Description = "Icon renders before the content (default).",
+                    Value = "0",
+                },
+                new()
+                {
+                    Name = "End",
+                    Description = "Icon renders after the content.",
+                    Value = "1",
+                }
+            ]
+        },
+        new()
         {
             Id = "label-position-enum",
             Name = "BitLabelPosition",
@@ -894,5 +920,5 @@ private void HandleInvalidSubmit()
     }
 
     [Inject] private IJSRuntime _js { get; set; } = default!;
-    private async Task ScrollToFloat() => await _js.ScrollToElement("example9");
+    private async Task ScrollToFloat() => await _js.ScrollToElement("example10");
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cs
index 0dc74da841..b38e3bf9c1 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Buttons/Button/BitButtonDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.Button;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Buttons.Button;
 
 public partial class BitButtonDemo
 {
@@ -30,6 +30,11 @@ public partial class BitButtonDemo
 <BitButton Variant=""BitVariant.Text"" SecondaryText=""this is the secondary text"" IsEnabled=""false"">Text</BitButton>";
 
     private readonly string example4RazorCode = @"
+<BitButton Title=""This is a tooltip"" Variant=""BitVariant.Fill"">Hover me</BitButton>
+<BitButton Title=""Another tooltip"" Variant=""BitVariant.Outline"">Hover me</BitButton>
+<BitButton Title=""Text tooltip"" Variant=""BitVariant.Text"">Hover me</BitButton>";
+
+    private readonly string example5RazorCode = @"
 <BitButton IconName=""@BitIconName.EmojiNeutral"" Variant=""BitVariant.Fill"" />
 <BitButton IconName=""@BitIconName.EmojiNeutral"" Variant=""BitVariant.Outline"" />
 <BitButton IconName=""@BitIconName.EmojiNeutral"" Variant=""BitVariant.Text"" />
@@ -42,23 +47,23 @@ public partial class BitButtonDemo
 <BitButton IconName=""@BitIconName.Emoji"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Outline"">Start</BitButton>
 <BitButton IconName=""@BitIconName.Emoji"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Text"">Start</BitButton>
 
-<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Fill"" ReversedIcon>End</BitButton>
-<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Outline"" ReversedIcon>End</BitButton>
-<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Text"" ReversedIcon>End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Fill"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Outline"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Text"" IconPosition=""BitIconPosition.End"">End</BitButton>
 
-<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Fill"" ReversedIcon>End</BitButton>
-<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Outline"" ReversedIcon>End</BitButton>
-<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Text"" ReversedIcon>End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Fill"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Outline"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconName=""@BitIconName.Emoji2"" SecondaryText=""this is the secondary text"" Variant=""BitVariant.Text"" IconPosition=""BitIconPosition.End"">End</BitButton>
 
 <BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Fill"">Start</BitButton>
 <BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Outline"">Start</BitButton>
 <BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Text"">Start</BitButton>
 
-<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Fill"" ReversedIcon>End</BitButton>
-<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Outline"" ReversedIcon>End</BitButton>
-<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Text"" ReversedIcon>End</BitButton>";
+<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Fill"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Outline"" IconPosition=""BitIconPosition.End"">End</BitButton>
+<BitButton IconUrl=""/images/bit-logo.svg"" SecondaryText=""IconUrl"" Variant=""BitVariant.Text"" IconPosition=""BitIconPosition.End"">End</BitButton>";
 
-    private readonly string example5RazorCode = @"
+    private readonly string example6RazorCode = @"
 <BitButton IsLoading=""fillIsLoading"" Variant=""BitVariant.Fill"" Style=""min-width: 11rem"" OnClick=""LoadingFillClick"">
     Click me
 </BitButton>
@@ -90,7 +95,7 @@ Click me
 
 <BitButton OnClick=""AutoLoadingReclick"" AutoLoading Reclickable>Reclickable</BitButton>
 <div>Reclickable AutoLoading click count: @reclickableAutoLoadCount</div>";
-    private readonly string example5CsharpCode = @"
+    private readonly string example6CsharpCode = @"
 private bool fillIsLoading;
 private bool outlineIsLoading;
 private bool textIsLoading;
@@ -148,7 +153,7 @@ private Task AutoLoadingReclick(bool isLoading)
     return clickTsc.Task;
 }";
 
-    private readonly string example6RazorCode = @"
+    private readonly string example7RazorCode = @"
 <BitButton IsLoading=""true""
            LoadingLabel=""End...""
            Style=""min-width: 6.5rem;""
@@ -181,7 +186,7 @@ private Task AutoLoadingReclick(bool isLoading)
     Top
 </BitButton>";
 
-    private readonly string example7RazorCode = @"
+    private readonly string example8RazorCode = @"
 <BitButton Href=""https://bitplatform.dev"" Target=""_blank"" IconName=""@BitIconName.Globe"" Variant=""BitVariant.Outline"">
     Open bitplatform.dev
 </BitButton>
@@ -190,7 +195,7 @@ Open bitplatform.dev
     Go to bitplatform GitHub
 </BitButton>";
 
-    private readonly string example8RazorCode = @"
+    private readonly string example9RazorCode = @"
 <BitButton Rel=""BitLinkRels.NoFollow"" Href=""https://bitplatform.dev"" Target=""_blank"" IconName=""@BitIconName.Globe"" Variant=""BitVariant.Outline"">
     Open bitplatform.dev with a rel attribute (nofollow)
 </BitButton>
@@ -199,7 +204,7 @@ Open bitplatform.dev with a rel attribute (nofollow)
     Open bitplatform.dev with a rel attribute (nofollow & noreferrer)
 </BitButton>";
 
-    private readonly string example9RazorCode = @"
+    private readonly string example10RazorCode = @"
 <BitDropdown Label=""FloatPosition"" Items=""floatPositionList"" @bind-Value=""floatPosition"" FitWidth />
 <BitTextField Label=""FloatOffset"" @bind-Value=""floatOffset"" Immediate />
 
@@ -246,7 +251,7 @@ each word has the power to transform into something extraordinary. Here lies the
         begins here, in this quiet moment where everything is possible.
     </div>
 </div>";
-    private readonly string example9CsharpCode = @"
+    private readonly string example10CsharpCode = @"
 private string? floatOffset;
 private BitPosition floatPosition = BitPosition.BottomRight;
 
@@ -259,7 +264,7 @@ each word has the power to transform into something extraordinary. Here lies the
                                                                             })
                                                                             .ToList();";
 
-    private readonly string example10RazorCode = @"
+    private readonly string example11RazorCode = @"
 <EditForm Model=""buttonValidationModel"" OnValidSubmit=""HandleValidSubmit"">
     <DataAnnotationsValidator />
     <BitTextField Label=""Required"" Required @bind-Value=""buttonValidationModel.RequiredText"" />
@@ -271,7 +276,7 @@ each word has the power to transform into something extraordinary. Here lies the
         <BitButton ButtonType=""BitButtonType.Button"">Button</BitButton>
     </div>
 </EditForm>";
-    private readonly string example10CsharpCode = @"
+    private readonly string example11CsharpCode = @"
 public class ButtonValidationModel
 {
     [Required]
@@ -290,7 +295,7 @@ private async Task HandleValidSubmit()
     StateHasChanged();
 }";
 
-    private readonly string example11RazorCode = @"
+    private readonly string example12RazorCode = @"
 <style>
     .custom-content {
         gap: 0.5rem;
@@ -328,7 +333,7 @@ private async Task HandleValidSubmit()
     </SecondaryTemplate>
 </BitButton>
 
-<BitButton IsLoading=""!templateIsLoading"" OnClick=""LoadingTemplateClick"">
+<BitButton IsLoading=""templateIsLoading"" OnClick=""LoadingTemplateClick"">
     <PrimaryTemplate>Click me</PrimaryTemplate>
     <LoadingTemplate>
         <div style=""display:flex;align-items:center;"">
@@ -337,7 +342,7 @@ private async Task HandleValidSubmit()
         </div>
     </LoadingTemplate>
 </BitButton>";
-    private readonly string example11CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 private bool templateIsLoading;
 
 private async Task LoadingTemplateClick()
@@ -347,12 +352,12 @@ private async Task LoadingTemplateClick()
     templateIsLoading = false;
 }";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitButton OnClick=""() => clickCounter++"">Click me (@clickCounter)</BitButton>";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private int clickCounter;";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitButton Size=""BitSize.Small"" IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Fill"" />
 <BitButton IsLoading Size=""BitSize.Small"" IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Fill"" />
 
@@ -429,10 +434,10 @@ private async Task LoadingTemplateClick()
 <BitButton Size=""BitSize.Large"" SecondaryText=""this is the secondary text"" IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Outline"">Outline</BitButton>
 <BitButton Size=""BitSize.Large"" SecondaryText=""this is the secondary text"" IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Text"">Text</BitButton>";
 
-    private readonly string example14RazorCode = @"
+    private readonly string example15RazorCode = @"
 <BitButton FullWidth IconName=""@BitIconName.Emoji2"" Variant=""BitVariant.Fill"">Full Width Button</BitButton>";
 
-    private readonly string example15RazorCode = @"
+    private readonly string example16RazorCode = @"
 <BitButton FixedColor IconOnly
            Size=""BitSize.Large""
            Variant=""BitVariant.Outline""
@@ -445,7 +450,7 @@ private async Task LoadingTemplateClick()
            IconName=""@BitIconName.Emoji2""
            Color=""BitColor.TertiaryBackground"" />";
 
-    private readonly string example16RazorCode = @"
+    private readonly string example17RazorCode = @"
 <BitButton Color=""BitColor.Primary"">Primary</BitButton>
 <BitButton Color=""BitColor.Primary"" Variant=""BitVariant.Outline"">Primary</BitButton>
 <BitButton Color=""BitColor.Primary"" Variant=""BitVariant.Text"">Primary</BitButton>
@@ -517,7 +522,7 @@ private async Task LoadingTemplateClick()
 <BitButton Color=""BitColor.TertiaryBorder"" Variant=""BitVariant.Outline"">TertiaryBorder</BitButton>
 <BitButton Color=""BitColor.TertiaryBorder"" Variant=""BitVariant.Text"">TertiaryBorder</BitButton>";
 
-    private readonly string example17RazorCode = @"
+    private readonly string example18RazorCode = @"
 <link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
 
 <BitButton Icon=""@(""fa-solid fa-house"")"" Variant=""BitVariant.Fill"">
@@ -555,7 +560,7 @@ private async Task LoadingTemplateClick()
     Gear (Icon=""@@BitIconInfo.Bi(""gear-fill"")"")
 </BitButton>";
 
-    private readonly string example18RazorCode = @"
+    private readonly string example19RazorCode = @"
 <style>
     .custom-class {
         border-radius: 1rem;
@@ -629,7 +634,7 @@ Click me
                               Spinner = ""custom-spinner"" })"">
     Click me
 </BitButton>";
-    private readonly string example18CsharpCode = @"
+    private readonly string example19CsharpCode = @"
 private bool stylesIsLoading;
 private bool classesIsLoading;
 
@@ -647,7 +652,7 @@ private async Task LoadingClassesClick()
     classesIsLoading = false;
 }";
 
-    private readonly string example19RazorCode = @"
+    private readonly string example20RazorCode = @"
 <BitButton Dir=""BitDir.Rtl"" IconName=""@BitIconName.Emoji"" Variant=""BitVariant.Fill"">
     دکمه با آیکن
 </BitButton>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Home/HeroSection.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Home/HeroSection.razor
index a43019f3db..0bb6c7105a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Home/HeroSection.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Home/HeroSection.razor
@@ -5,7 +5,7 @@
     <BitText Typography="BitTypography.H1">bit BlazorUI</BitText>
     <BitText Typography="BitTypography.Subtitle1" Gutter>bit BlazorUI components are native, easy-to-customize, and work seamlessly in all interactive Blazor modes (WASM, Server, Hybrid, pre-rendering), saving you time and making development enjoyable.</BitText>
     <br />
-    <BitButton Href="/getting-started" Size="BitSize.Large" IconName="@BitIconName.ChevronRightSmall" ReversedIcon>
+    <BitButton Href="/getting-started" Size="BitSize.Large" IconName="@BitIconName.ChevronRightSmall" IconPosition="BitIconPosition.End">
         Get started
     </BitButton>
 </div>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/OverviewPage.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/OverviewPage.razor
index 23d5e4976e..981c5671aa 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/OverviewPage.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/OverviewPage.razor
@@ -30,8 +30,8 @@
             and fast across all interactive Blazor modes (WASM, Server, Hybrid, and pre-rendering).
         </BitText>
         <br />
-        <BitStack Horizontal Gap="1rem">
-            <BitButton ReversedIcon
+        <BitStack Horizontal Gap="1rem" Wrap>
+            <BitButton IconPosition="BitIconPosition.End"
                        Size="BitSize.Large"
                        Href="/getting-started"
                        IconName="@BitIconName.ChevronRightSmall">
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Buttons/BitButtonTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Buttons/BitButtonTests.cs
index 81fa329dff..ce18cd08af 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Buttons/BitButtonTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Buttons/BitButtonTests.cs
@@ -1,4 +1,4 @@
-using System;
+using System;
 using Microsoft.AspNetCore.Components.Forms;
 using Microsoft.VisualStudio.TestTools.UnitTesting;
 using Bunit;
@@ -310,25 +310,9 @@ public void BitButtonLoadingContentTest(bool isLoading)
 
     [TestMethod,
         DataRow(BitLabelPosition.Top),
-        DataRow(BitLabelPosition.Top),
-        DataRow(BitLabelPosition.Top),
-        DataRow(BitLabelPosition.Top),
-
-        DataRow(BitLabelPosition.End),
         DataRow(BitLabelPosition.End),
-        DataRow(BitLabelPosition.End),
-        DataRow(BitLabelPosition.End),
-
-        DataRow(BitLabelPosition.Bottom),
         DataRow(BitLabelPosition.Bottom),
-        DataRow(BitLabelPosition.Bottom),
-        DataRow(BitLabelPosition.Bottom),
-
-        DataRow(BitLabelPosition.Start),
         DataRow(BitLabelPosition.Start),
-        DataRow(BitLabelPosition.Start),
-        DataRow(BitLabelPosition.Start),
-
         DataRow(null),
     ]
     public void BitButtonLoaderTest(BitLabelPosition? labelPosition)
@@ -363,4 +347,199 @@ public void BitButtonLoaderTest(BitLabelPosition? labelPosition)
         Assert.IsTrue(bitButton?.FirstElementChild?.ClassList.Contains(labelPositionClass));
     }
 
+    [TestMethod,
+        DataRow(BitIconPosition.Start),
+        DataRow(BitIconPosition.End),
+        DataRow(null)
+    ]
+    public void BitButtonIconPositionClassTest(BitIconPosition? iconPosition)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            if (iconPosition.HasValue)
+            {
+                parameters.Add(p => p.IconPosition, iconPosition.Value);
+            }
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        var expectedClassPresence = iconPosition == BitIconPosition.End;
+
+        Assert.AreEqual(expectedClassPresence, bitButton.ClassList.Contains("bit-btn-eni"));
+    }
+
+    [TestMethod,
+        DataRow("5"),
+        DataRow("50"),
+    ]
+    public void BitButtonTabIndexShouldRecoverAfterReEnable(string tabIndex)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.IsEnabled, false);
+            parameters.Add(p => p.AllowDisabledFocus, false);
+            parameters.Add(p => p.TabIndex, tabIndex);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        Assert.AreEqual("-1", bitButton.GetAttribute("tabindex"));
+
+        com.SetParametersAndRender(parameters =>
+        {
+            parameters.Add(p => p.IsEnabled, true);
+        });
+
+        Assert.AreEqual(tabIndex, bitButton.GetAttribute("tabindex"));
+    }
+
+    [TestMethod,
+        DataRow(true),
+        DataRow(false)
+    ]
+    public void BitButtonFullWidthClassTest(bool fullWidth)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.FullWidth, fullWidth);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        Assert.AreEqual(fullWidth, bitButton.ClassList.Contains("bit-btn-flw"));
+    }
+
+    [TestMethod,
+        DataRow(BitColor.Primary),
+        DataRow(BitColor.Secondary),
+        DataRow(BitColor.Tertiary),
+        DataRow(BitColor.PrimaryBackground),
+        DataRow(BitColor.SecondaryBackground),
+        DataRow(BitColor.TertiaryBackground),
+        DataRow(BitColor.PrimaryForeground),
+        DataRow(BitColor.SecondaryForeground),
+        DataRow(BitColor.TertiaryForeground),
+        DataRow(BitColor.PrimaryBorder),
+        DataRow(BitColor.SecondaryBorder),
+        DataRow(BitColor.TertiaryBorder),
+    ]
+    public void BitButtonAllColorClassesTest(BitColor color)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.Color, color);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        var expectedClass = color switch
+        {
+            BitColor.Primary => "bit-btn-pri",
+            BitColor.Secondary => "bit-btn-sec",
+            BitColor.Tertiary => "bit-btn-ter",
+            BitColor.Info => "bit-btn-inf",
+            BitColor.Success => "bit-btn-suc",
+            BitColor.Warning => "bit-btn-wrn",
+            BitColor.SevereWarning => "bit-btn-swr",
+            BitColor.Error => "bit-btn-err",
+            BitColor.PrimaryBackground => "bit-btn-pbg",
+            BitColor.SecondaryBackground => "bit-btn-sbg",
+            BitColor.TertiaryBackground => "bit-btn-tbg",
+            BitColor.PrimaryForeground => "bit-btn-pfg",
+            BitColor.SecondaryForeground => "bit-btn-sfg",
+            BitColor.TertiaryForeground => "bit-btn-tfg",
+            BitColor.PrimaryBorder => "bit-btn-pbr",
+            BitColor.SecondaryBorder => "bit-btn-sbr",
+            BitColor.TertiaryBorder => "bit-btn-tbr",
+            _ => "bit-btn-pri"
+        };
+
+        Assert.IsTrue(bitButton.ClassList.Contains(expectedClass));
+    }
+
+    [TestMethod,
+        DataRow(null, true),
+        DataRow(null, false),
+        DataRow("", true),
+        DataRow("", false),
+        DataRow("href", true),
+        DataRow("href", false)
+    ]
+    public void BitButtonShouldRenderExpectedElementBasedOnHref(string? href, bool isEnabled)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.Href, href);
+            parameters.Add(p => p.IsEnabled, isEnabled);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        var expectedTag = href.HasValue() ? "a" : "button";
+
+        Assert.AreEqual(expectedTag, bitButton.TagName, ignoreCase: true);
+    }
+
+    [TestMethod,
+        DataRow("https://bitplatform.dev", BitLinkRels.NoOpener | BitLinkRels.NoReferrer, "noopener noreferrer"),
+        DataRow("#section", BitLinkRels.NoOpener | BitLinkRels.NoReferrer, null)
+    ]
+    public void BitButtonRelAttributeShouldFollowHrefRules(string href, BitLinkRels rel, string? expectedRel)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.Href, href);
+            parameters.Add(p => p.Rel, rel);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        var hasRelAttribute = bitButton.HasAttribute("rel");
+
+        Assert.AreEqual(string.IsNullOrEmpty(expectedRel) is false, hasRelAttribute);
+
+        if (expectedRel is not null)
+        {
+            Assert.AreEqual(expectedRel, bitButton.GetAttribute("rel"));
+        }
+    }
+
+    [TestMethod]
+    public void BitButtonDynamicParameterUpdateShouldRefreshMarkup()
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.IsEnabled, true);
+            parameters.Add(p => p.IconName, "Emoji");
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        Assert.IsFalse(bitButton.ClassList.Contains("bit-dis"));
+
+        com.SetParametersAndRender(parameters =>
+        {
+            parameters.Add(p => p.IsEnabled, false);
+        });
+
+        Assert.IsTrue(bitButton.ClassList.Contains("bit-dis"));
+    }
+
+    [TestMethod,
+        DataRow(true),
+        DataRow(false)
+    ]
+    public void BitButtonFixedColorClassTest(bool fixedColor)
+    {
+        var com = RenderComponent<BitButton>(parameters =>
+        {
+            parameters.Add(p => p.FixedColor, fixedColor);
+        });
+
+        var bitButton = com.Find(".bit-btn");
+
+        Assert.AreEqual(fixedColor, bitButton.ClassList.Contains("bit-btn-fxc"));
+    }
+
 }

From 1da6f4e3ff4f92c6854c075d854b7dda4a3ca69e Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 25 Feb 2026 16:58:59 +0100
Subject: [PATCH 25/66] feat(templates): refactor system text json serializer
 options in bit Boilerplate #12120 (#12125)

---
 .../Infrastructure/Services/ServerJsonContext.cs      | 11 ++++++++++-
 .../Features/Identity/Dtos/IdentityJsonContext.cs     | 11 ++++++++++-
 .../src/Shared/Infrastructure/Dtos/AppJsonContext.cs  |  2 +-
 3 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
index 1b5a3ea825..63709df892 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
@@ -8,7 +8,16 @@ namespace Boilerplate.Server.Api.Infrastructure.Services;
 /// <summary>
 /// https://devblogs.microsoft.com/dotnet/try-the-new-system-text-json-source-generator/
 /// </summary>
-[JsonSourceGenerationOptions(PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase)]
+[JsonSourceGenerationOptions(
+  PropertyNameCaseInsensitive = true,
+  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase,
+  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
+  UseStringEnumConverter = true,
+  WriteIndented = false,
+  GenerationMode = JsonSourceGenerationMode.Default,
+  AllowTrailingCommas = true,
+  DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
+)]
 [JsonSerializable(typeof(NugetStatsDto))]
 //#if (captcha == "reCaptcha")
 [JsonSerializable(typeof(GoogleRecaptchaVerificationResponse))]
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
index 6fc03d2882..4f888fe141 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
@@ -6,7 +6,16 @@ namespace Boilerplate.Shared.Features.Identity;
 /// <summary>
 /// https://devblogs.microsoft.com/dotnet/try-the-new-system-text-json-source-generator/
 /// </summary>
-[JsonSourceGenerationOptions(PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase)]
+[JsonSourceGenerationOptions(
+  PropertyNameCaseInsensitive = true,
+  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase,
+  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
+  UseStringEnumConverter = true,
+  WriteIndented = false,
+  GenerationMode = JsonSourceGenerationMode.Default,
+  AllowTrailingCommas = true,
+  DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
+)]
 [JsonSerializable(typeof(UserDto))]
 [JsonSerializable(typeof(IdentityRequestDto))]
 [JsonSerializable(typeof(SignInRequestDto))]
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
index a695bc81ec..c1817d7ca3 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
@@ -42,7 +42,7 @@ namespace Boilerplate.Shared.Infrastructure.Dtos;
   DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
   UseStringEnumConverter = true,
   WriteIndented = false,
-  GenerationMode = JsonSourceGenerationMode.Metadata,
+  GenerationMode = JsonSourceGenerationMode.Default,
   AllowTrailingCommas = true,
   DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
 )]

From f6990e24cbb32bba6eb5a91b5e21d4944797f0e9 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 25 Feb 2026 20:49:50 +0100
Subject: [PATCH 26/66] feat(deps): update project dependencies #12126 (#12127)

---
 .../Bit.BlazorUI.Demo.Server.csproj                         | 2 +-
 .../Bit.Boilerplate/src/Directory.Packages.props            | 6 +++---
 .../Bit.Websites.Platform.Server.csproj                     | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 5c21e7672c..5b38c0e2a3 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -33,7 +33,7 @@
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="0.9.0-preview.2" />
+        <PackageReference Include="ModelContextProtocol" Version="1.0.0" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 59530deb1f..129cd9d4d1 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -50,7 +50,7 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.46" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.47" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
@@ -58,7 +58,7 @@
         <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.3" />
         <!--/+:msbuild-conditional:noEmit -->
-        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="0.9.0-preview.2" />
+        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.0.0" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.1-preview.1.26105.8" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.1" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
@@ -121,7 +121,7 @@
         <!--/-:msbuild-conditional:noEmit -->
         <PackageVersion Include="Humanizer" Version="3.0.1" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
-        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.2" />
+        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.3" />
         <PackageVersion Include="FluentEmail.Smtp" Version="3.0.2" />
         <PackageVersion Include="FluentStorage" Version="6.0.2" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.3" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index ad57dafe94..e82a14a4e5 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -27,7 +27,7 @@
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="0.9.0-preview.2" />
+        <PackageReference Include="ModelContextProtocol" Version="1.0.0" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />

From b709ef1aa0fc694f3a43c7d6ff106ebafdd6cb8e Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 26 Feb 2026 00:37:01 +0330
Subject: [PATCH 27/66] feat(blazorui): add new Icon parameters to
 BitPagination #12128 (#12129)

---
 .../Navs/Pagination/BitPagination.razor       | 14 ++-
 .../Navs/Pagination/BitPagination.razor.cs    | 46 ++++++++--
 .../Navs/Pagination/BitPaginationDemo.razor   | 60 ++++++++++--
 .../Pagination/BitPaginationDemo.razor.cs     | 91 +++++++++++++++++--
 .../BitPaginationDemo.razor.samples.cs        | 44 +++++++--
 5 files changed, 219 insertions(+), 36 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor
index 4c360b58c6..7197f079ed 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -8,23 +8,25 @@
      dir="@Dir?.ToString().ToLower()">
     @if (ShowFirstButton)
     {
+        var firstIcon = BitIconInfo.From(FirstButtonIcon, FirstButtonIconName ?? "ChevronRightEnd6 bit-pgn-trs");
         <button @onclick="@(() => ChangePage(1))"
                 aria-label="First page"
                 disabled="@(SelectedPage == 1 || IsEnabled is false)"
                 style="@Styles?.Button @Styles?.FirstButton"
                 class="bit-pgn-btn @Classes?.Button @Classes?.FirstButton @GetButtonClasses()">
-            <i style="@Styles?.FirstButtonIcon" class="bit-icon bit-icon--@(FirstIcon ?? "ChevronRightEnd6 bit-pgn-trs") @Styles?.FirstButtonIcon" />
+            <i style="@Styles?.FirstButtonIcon" class="@firstIcon?.GetCssClasses() @Classes?.FirstButtonIcon" />
         </button>
     }
 
     @if (ShowPreviousButton)
     {
+        var previousIcon = BitIconInfo.From(PreviousButtonIcon, PreviousButtonIconName ?? "ChevronRight bit-pgn-trs");
         <button @onclick="@(() => ChangePage(SelectedPage - 1))"
                 aria-label="Previous page"
                 disabled="@(SelectedPage == 1 || IsEnabled is false)"
                 style="@Styles?.Button @Styles?.PreviousButton"
                 class="bit-pgn-btn @Classes?.Button @Classes?.PreviousButton @GetButtonClasses()">
-            <i style="@Styles?.PreviousButtonIcon" class="bit-icon bit-icon--@(PreviousIcon ?? "ChevronRight bit-pgn-trs") @Classes?.PreviousButtonIcon" />
+            <i style="@Styles?.PreviousButtonIcon" class="@previousIcon?.GetCssClasses() @Classes?.PreviousButtonIcon" />
         </button>
     }
 
@@ -59,23 +61,25 @@
 
     @if (ShowNextButton)
     {
+        var nextIcon = BitIconInfo.From(NextButtonIcon, NextButtonIconName ?? "ChevronRight bit-pgn-tre");
         <button @onclick="@(() => ChangePage(SelectedPage + 1))"
                 aria-label="Next page"
                 disabled="@(SelectedPage == Count || IsEnabled is false)"
                 style="@Styles?.Button @Styles?.NextButton"
                 class="bit-pgn-btn @Classes?.Button @Classes?.NextButton @GetButtonClasses()">
-            <i style="@Styles?.NextButtonIcon" class="bit-icon bit-icon--@(NextIcon ?? "ChevronRight bit-pgn-tre") @Classes?.NextButtonIcon" />
+            <i style="@Styles?.NextButtonIcon" class="@nextIcon?.GetCssClasses() @Classes?.NextButtonIcon" />
         </button>
     }
 
     @if (ShowLastButton)
     {
+        var lastIcon = BitIconInfo.From(LastButtonIcon, LastButtonIconName ?? "ChevronRightEnd6 bit-pgn-tre");
         <button @onclick="@(() => ChangePage(Count))"
                 aria-label="Last page"
                 disabled="@(SelectedPage == Count || IsEnabled is false)"
                 style="@Styles?.Button @Styles?.LastButton"
                 class="bit-pgn-btn @Classes?.Button @Classes?.LastButton @GetButtonClasses()">
-            <i style="@Styles?.LastButtonIcon" class="bit-icon bit-icon--@(LastIcon ?? "ChevronRightEnd6 bit-pgn-tre") @Classes?.LastButtonIcon" />
+            <i style="@Styles?.LastButtonIcon" class="@lastIcon?.GetCssClasses() @Classes?.LastButtonIcon" />
         </button>
     }
 </div>
\ No newline at end of file
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor.cs
index c0dab66469..b11dd4ebab 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pagination/BitPagination.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 
 namespace Bit.BlazorUI;
 
@@ -44,14 +44,28 @@ public partial class BitPagination : BitComponentBase
     [Parameter] public int DefaultSelectedPage { get; set; }
 
     /// <summary>
-    /// The icon name of the first button.
+    /// The icon for the first button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="FirstButtonIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? FirstIcon { get; set; }
+    [Parameter] public BitIconInfo? FirstButtonIcon { get; set; }
 
     /// <summary>
-    /// The icon name of the last button.
+    /// The built-in icon name for the first button.
+    /// For external icon libraries, use <see cref="FirstButtonIcon"/> instead.
     /// </summary>
-    [Parameter] public string? LastIcon { get; set; }
+    [Parameter] public string? FirstButtonIconName { get; set; }
+
+    /// <summary>
+    /// The icon for the last button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="LastButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? LastButtonIcon { get; set; }
+
+    /// <summary>
+    /// The built-in icon name for the last button.
+    /// For external icon libraries, use <see cref="LastButtonIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? LastButtonIconName { get; set; }
 
     /// <summary>
     /// The number of items to render in the middle of the pagination.
@@ -61,9 +75,16 @@ public partial class BitPagination : BitComponentBase
     public int MiddleCount { get; set; }
 
     /// <summary>
-    /// The icon name of the next button.
+    /// The icon for the next button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="NextButtonIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? NextIcon { get; set; }
+    [Parameter] public BitIconInfo? NextButtonIcon { get; set; }
+
+    /// <summary>
+    /// The built-in icon name for the next button.
+    /// For external icon libraries, use <see cref="NextButtonIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? NextButtonIconName { get; set; }
 
     /// <summary>
     /// The event callback for when selected page changes.
@@ -71,9 +92,16 @@ public partial class BitPagination : BitComponentBase
     [Parameter] public EventCallback<int> OnChange { get; set; }
 
     /// <summary>
-    /// The icon name of the previous button.
+    /// The icon for the previous button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="PreviousButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PreviousButtonIcon { get; set; }
+
+    /// <summary>
+    /// The built-in icon name for the previous button.
+    /// For external icon libraries, use <see cref="PreviousButtonIcon"/> instead.
     /// </summary>
-    [Parameter] public string? PreviousIcon { get; set; }
+    [Parameter] public string? PreviousButtonIconName { get; set; }
 
     /// <summary>
     /// The selected page number.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor
index 68465207b6..a6f9e728eb 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor
@@ -58,7 +58,7 @@
     <DemoExample Title="Icon" RazorCode="@example7RazorCode" Id="example7">
         <div>Displaying custom icons feature within the Pagination navigation buttons.</div>
         <br />
-        <BitPagination Count="5" NextIcon="@BitIconName.Next" PreviousIcon="@BitIconName.Previous" />
+        <BitPagination Count="5" NextButtonIconName="@BitIconName.Next" PreviousButtonIconName="@BitIconName.Previous" />
     </DemoExample>
 
     <DemoExample Title="Color" RazorCode="@example8RazorCode" Id="example8">
@@ -146,15 +146,63 @@
         <BitPagination Count="5" Size="BitSize.Large" Variant="BitVariant.Outline" />
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example10RazorCode" Id="example10">
+    <DemoExample Title="External Icons" RazorCode="@example10RazorCode" Id="example10">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the navigation button <b>Icon</b> parameters.</div>
+        <div>See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.</div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitPagination Count="5"
+                       NextButtonIcon="@BitIconInfo.Fa("solid forward")"
+                       PreviousButtonIcon="@BitIconInfo.Fa("solid backward")" />
+
+        <br />
+        <br />
+
+        <BitPagination Count="5"
+                       ShowFirstButton
+                       ShowLastButton
+                       NextButtonIcon="@BitIconInfo.Css("fa-solid fa-angle-right")"
+                       PreviousButtonIcon="@BitIconInfo.Css("fa-solid fa-angle-left")"
+                       FirstButtonIcon="@BitIconInfo.Css("fa-solid fa-angles-left")"
+                       LastButtonIcon="@BitIconInfo.Css("fa-solid fa-angles-right")" />
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitPagination Count="5"
+                       NextButtonIcon="@BitIconInfo.Bi("chevron-right")"
+                       PreviousButtonIcon="@BitIconInfo.Bi("chevron-left")" />
+
+        <br />
+        <br />
+
+        <BitPagination Count="5"
+                       ShowFirstButton
+                       ShowLastButton
+                       NextButtonIcon="@BitIconInfo.Css("bi bi-caret-right-fill")"
+                       PreviousButtonIcon="@BitIconInfo.Css("bi bi-caret-left-fill")"
+                       FirstButtonIcon="@BitIconInfo.Css("bi bi-skip-start-fill")"
+                       LastButtonIcon="@BitIconInfo.Css("bi bi-skip-end-fill")" />
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
         <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
         <br /><br />
         <div>
             <div>Component's Style & Class:</div>
             <br />
             <BitPagination Count="5"
-                           NextIcon="@BitIconName.ChevronDown"
-                           PreviousIcon="@BitIconName.ChevronUp"
+                           NextButtonIconName="@BitIconName.ChevronDown"
+                           PreviousButtonIconName="@BitIconName.ChevronUp"
                            Style="margin-left: 1rem; flex-flow: column;" />
             <br /><br />
             <BitPagination Count="5" Class="custom-class" />
@@ -173,7 +221,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Binding" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+    <DemoExample Title="Binding" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
         <div>Examples of one-way and two-way data binding with BitPagination.</div>
         <br /><br />
         <div style="max-width: 250px;">
@@ -197,7 +245,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
         <div>Use BitPagination in right-to-left (RTL).</div>
         <br /><br />
         <div dir="rtl">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.cs
index edd7654613..4ae8f7cea3 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pagination;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pagination;
 
 public partial class BitPaginationDemo
 {
@@ -45,17 +45,39 @@ public partial class BitPaginationDemo
         },
         new()
         {
-            Name = "FirstIcon",
+            Name = "FirstButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the first button using custom CSS classes for external icon libraries. Takes precedence over FirstButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "FirstButtonIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the first button."
+            Description = "The built-in icon name for the first button.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
-            Name = "LastIcon",
+            Name = "LastButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the last button using custom CSS classes for external icon libraries. Takes precedence over LastButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "LastButtonIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the last button."
+            Description = "The built-in icon name for the last button.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -66,10 +88,21 @@ public partial class BitPaginationDemo
         },
         new()
         {
-            Name = "NextIcon",
+            Name = "NextButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the next button using custom CSS classes for external icon libraries. Takes precedence over NextButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextButtonIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the next button."
+            Description = "The built-in icon name for the next button.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -80,10 +113,21 @@ public partial class BitPaginationDemo
         },
         new()
         {
-            Name = "PreviousIcon",
+            Name = "PreviousButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the previous button using custom CSS classes for external icon libraries. Takes precedence over PreviousButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PreviousButtonIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the previous button."
+            Description = "The built-in icon name for the previous button.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -266,6 +310,35 @@ public partial class BitPaginationDemo
 
     private readonly List<ComponentSubClass> componentSubClasses =
     [
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
         new()
         {
             Id = "pagination-class-styles",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cs
index aeb37696da..16dbd583c4 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pagination/BitPaginationDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pagination;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pagination;
 
 public partial class BitPaginationDemo
 {
@@ -23,7 +23,7 @@ public partial class BitPaginationDemo
 <BitPagination Count=""24"" ShowFirstButton ShowLastButton />";
 
     private readonly string example7RazorCode = @"
-<BitPagination Count=""5"" NextIcon=""@BitIconName.Next"" PreviousIcon=""@BitIconName.Previous"" />";
+<BitPagination Count=""5"" NextButtonIconName=""@BitIconName.Next"" PreviousButtonIconName=""@BitIconName.Previous"" />";
 
     private readonly string example8RazorCode = @"
 <BitPagination Count=""5"" Color=""BitColor.Primary"" />
@@ -72,6 +72,36 @@ public partial class BitPaginationDemo
 <BitPagination Count=""5"" Size=""BitSize.Large"" Variant=""BitVariant.Outline"" />";
 
     private readonly string example10RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitPagination Count=""5""
+               NextButtonIcon=""@BitIconInfo.Fa(""solid forward"")""
+               PreviousButtonIcon=""@BitIconInfo.Fa(""solid backward"")"" />
+
+<BitPagination Count=""5""
+               ShowFirstButton
+               ShowLastButton
+               NextButtonIcon=""@BitIconInfo.Css(""fa-solid fa-angle-right"")""
+               PreviousButtonIcon=""@BitIconInfo.Css(""fa-solid fa-angle-left"")""
+               FirstButtonIcon=""@BitIconInfo.Css(""fa-solid fa-angles-left"")""
+               LastButtonIcon=""@BitIconInfo.Css(""fa-solid fa-angles-right"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitPagination Count=""5""
+               NextButtonIcon=""@BitIconInfo.Bi(""chevron-right"")""
+               PreviousButtonIcon=""@BitIconInfo.Bi(""chevron-left"")"" />
+
+<BitPagination Count=""5""
+               ShowFirstButton
+               ShowLastButton
+               NextButtonIcon=""@BitIconInfo.Css(""bi bi-caret-right-fill"")""
+               PreviousButtonIcon=""@BitIconInfo.Css(""bi bi-caret-left-fill"")""
+               FirstButtonIcon=""@BitIconInfo.Css(""bi bi-skip-start-fill"")""
+               LastButtonIcon=""@BitIconInfo.Css(""bi bi-skip-end-fill"")"" />";
+
+    private readonly string example11RazorCode = @"
 <style>
     .custom-class {
         margin-left: 1rem;
@@ -103,8 +133,8 @@ public partial class BitPaginationDemo
 </style>
 
 <BitPagination Count=""5""
-               NextIcon=""@BitIconName.ChevronDown""
-               PreviousIcon=""@BitIconName.ChevronUp""
+               NextButtonIconName=""@BitIconName.ChevronDown""
+               PreviousButtonIconName=""@BitIconName.ChevronUp""
                Style=""margin-left: 1rem; flex-flow: column;"" />
 
 <BitPagination Count=""5"" Class=""custom-class"" />    
@@ -120,7 +150,7 @@ public partial class BitPaginationDemo
                                   Button = ""custom-button"",
                                   SelectedButton = ""custom-selected-button""})"" />";
 
-    private readonly string example11RazorCode = @"
+    private readonly string example12RazorCode = @"
 <BitPagination Count=""5"" SelectedPage=""oneWaySelectedPage"" />
 <BitNumberField @bind-Value=""oneWaySelectedPage"" Min=""1"" Max=""5"" />
 
@@ -129,12 +159,12 @@ public partial class BitPaginationDemo
 
 <BitPagination Count=""5"" OnChange=""p => onChangeSelectedPage = p"" />
 <div>Changed page: <b>@onChangeSelectedPage</b></div>";
-    private readonly string example11CsharpCode = @"
+    private readonly string example12CsharpCode = @"
 private int oneWaySelectedPage = 1;
 private int twoWaySelectedPage = 2;
 private int onChangeSelectedPage = 3;";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitPagination Dir=""BitDir.Rtl"" Count=""5"" Variant=""BitVariant.Fill"" />
 <BitPagination Dir=""BitDir.Rtl"" Count=""5"" Variant=""BitVariant.Outline"" />
 <BitPagination Dir=""BitDir.Rtl"" Count=""5"" Variant=""BitVariant.Text"" />";

From 09e8fda4c41fa43d2113f49b45c3723241aed91d Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Thu, 26 Feb 2026 16:27:31 +0100
Subject: [PATCH 28/66] feat(templates): improve bit boilerplate external
 dependencies codes #12130 (#12131)

---
 .../src/Directory.Packages.props              | 24 +++++++++----------
 .../Services/AppStorageHealthCheck.cs         |  6 ++++-
 .../Boilerplate.Server.AppHost.csproj         |  2 +-
 .../Boilerplate.Server.AppHost/Program.cs     |  6 ++---
 .../Infrastructure/Services/AppPlatform.cs    |  3 ---
 .../src/Shared/appsettings.json               |  6 +++++
 .../TestsAssemblyInitializer.cs               |  7 +++---
 7 files changed, 31 insertions(+), 23 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 129cd9d4d1..4f0553376d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -59,19 +59,19 @@
         <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.3" />
         <!--/+:msbuild-conditional:noEmit -->
         <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.0.0" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.1-preview.1.26105.8" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.1" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.2-preview.1.26125.13" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.2" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.1" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.2" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.2" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'Sqlite' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.Sqlite" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.1" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.2" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.SqlServer.Extensions" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.1" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.2" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.2" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.2" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'S3' OR '$(filesStorage)' == '') " Include="CommunityToolkit.Aspire.Hosting.Minio" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.1-preview.1.26105.8" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.2-preview.1.26125.13" />
         <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.3.0" />
         <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.3.0" />
         <PackageVersion Include="OpenTelemetry.Exporter.OpenTelemetryProtocol" Version="1.15.0" />
@@ -99,7 +99,7 @@
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.72.0-preview" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.72.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc1" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc2" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
@@ -111,8 +111,8 @@
         <PackageVersion Condition=" '$(filesStorage)' == 'S3' OR '$(filesStorage)' == '' " Include="FluentStorage.AWS" Version="6.0.2" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.AspNetCore" Version="1.4.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta7" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.1" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.1" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.2" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.2" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.5.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppStorageHealthCheck.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppStorageHealthCheck.cs
index be60600912..988146b9bb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppStorageHealthCheck.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppStorageHealthCheck.cs
@@ -15,7 +15,11 @@ public async Task<HealthCheckResult> CheckHealthAsync(HealthCheckContext context
     {
         try
         {
-            _ = await blobStorage.ExistsAsync(settings.UserProfileImagesDir, cancellationToken);
+            var result = await blobStorage.ListAsync(new()
+            {
+                FolderPath = settings.UserProfileImagesDir,
+                MaxResults = 1
+            }, cancellationToken);
 
             return HealthCheckResult.Healthy("Storage is healthy");
         }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
index 1036039851..21ef7f2dcc 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Aspire.AppHost.Sdk/13.1.1">
+<Project Sdk="Aspire.AppHost.Sdk/13.1.2">
 
     <PropertyGroup>
         <OutputType>Exe</OutputType>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
index d5976fb86d..a286b17c59 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Program.cs
@@ -33,7 +33,7 @@
 
 //#elif (database == "PostgreSql")
 var postgresDatabase = builder.AddPostgres("postgresserver")
-        .WithPgAdmin(config => config.WithVolume("/var/lib/pgadmin/Boilerplate/data"))
+        .WithPgAdmin()
         .WithV18DataVolume()
         .WithOptimizedSetup()
         .WithImage("pgvector/pgvector", "pg18") // pgvector supports embedded vector search.
@@ -41,12 +41,12 @@
 
 //#elif (database == "MySql")
 var mySqlDatabase = builder.AddMySql("mysqlserver")
-        .WithPhpMyAdmin(config => config.WithVolume("/var/lib/phpMyAdmin/Boilerplate/data"))
+        .WithPhpMyAdmin()
         .WithDataVolume()
         .AddDatabase("mysqldb");
 //#elif (database == "Sqlite")
 var sqlite = builder.AddSqlite("sqlite", databaseFileName: "BoilerplateDb.db")
-    .WithSqliteWeb(config => config.WithVolume("/var/lib/sqliteweb/Boilerplate/data"));
+    .WithSqliteWeb();
 //#endif
 //#if (filesStorage == "AzureBlobStorage")
 var azureBlobStorage = builder.AddAzureStorage("storage")
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppPlatform.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppPlatform.cs
index dad8d949de..28dc678bb5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppPlatform.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppPlatform.cs
@@ -26,9 +26,6 @@ public static partial class AppPlatform
     [SupportedOSPlatformGuard("macOS")]
     public static bool IsMacOS => IsBlazorHybrid && OperatingSystem.IsMacOS() || OperatingSystem.IsMacCatalyst() || IsIosOnMacOS;
 
-    /// <summary>
-    /// This is not supported yet in bit Boilerplate.
-    /// </summary>
     public static bool IsLinux => IsBlazorHybrid && OperatingSystem.IsLinux();
 
     [SupportedOSPlatformGuard("ios")]
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
index 8226afc80b..2f1b834cdb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
@@ -9,6 +9,7 @@
             "Default": "Warning",
             "Microsoft.Hosting.Lifetime": "Information",
             "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+            "StackExchange.Redis.ConnectionMultiplexer": "Warning",
             "Microsoft.EntityFrameworkCore.Database.Command": "Information",
             "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
         },
@@ -42,6 +43,7 @@
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
                 "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
@@ -54,6 +56,7 @@
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
                 "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
@@ -65,6 +68,7 @@
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
                 "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
@@ -80,6 +84,7 @@
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
                 "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
@@ -89,6 +94,7 @@
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
                 "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Tests/Infrastructure/TestsAssemblyInitializer.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Tests/Infrastructure/TestsAssemblyInitializer.cs
index 7d0c52cc14..78848b10eb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Tests/Infrastructure/TestsAssemblyInitializer.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Tests/Infrastructure/TestsAssemblyInitializer.cs
@@ -10,6 +10,7 @@
 using Microsoft.Data.Sqlite;
 //#endif
 using Microsoft.Extensions.Hosting;
+using Boilerplate.Tests.Features.Identity;
 using Boilerplate.Server.Api.Infrastructure.Data;
 
 namespace Boilerplate.Tests.Infrastructure;
@@ -38,10 +39,10 @@ public static async Task Initialize(TestContext testContext)
     /// <summary>
     /// Aspire.Hosting.Testing executes the complete application, including dependencies like databases, 
     /// closely mimicking a production environment. However, it has a limitation: backend services cannot 
-    /// be overridden in tests if needed, unlike <see cref="AppTestServer"/> used in <see cref="IdentityTests"/> 
-    /// and <see cref="IdentityTests"/>. The code below runs the Aspire app without the server web 
+    /// be overridden in tests if needed, unlike <see cref="AppTestServer"/> used in <see cref="UITests"/> 
+    /// and <see cref="IntegrationTests"/>. The code below runs the Aspire app without the server web 
     /// project, retrieves necessary connection strings (e.g., database connection string), and passes 
-    /// them to <see cref="AppTestServer"/>.
+    /// them to <see cref="AppTestServer"/>, so you can override services in the server project.
     /// </summary>
     private static async Task RunAspireHost(TestContext testContext)
     {

From 2e309153353c1ab481f71e6bcaccff0afd137d87 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 27 Feb 2026 02:32:02 +0330
Subject: [PATCH 29/66] feat(blazorui): add new Icon parameter to BitPivot
 #12132 (#12133)

---
 .../Components/Navs/Pivot/BitPivotItem.razor  |   7 +-
 .../Navs/Pivot/BitPivotItem.razor.cs          |  11 +-
 .../Components/Navs/Pivot/BitPivotDemo.razor  |  76 ++++++++++++-
 .../Navs/Pivot/BitPivotDemo.razor.cs          | 104 +++++++++++++++++-
 4 files changed, 188 insertions(+), 10 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor
index 1d350fad5d..a7619a2215 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor
@@ -13,10 +13,13 @@
         tabindex="@Parent?.GetPivotItemTabIndex(this)"
         aria-selected="@(IsSelected ? "true": "false")">
     <span style="@Parent?.Styles?.HeaderItemContent" class="@Parent?.Classes?.HeaderItemContent">
-        @if (@IconName.HasValue())
+        @{
+            var icon = BitIconInfo.From(Icon, IconName);
+        }
+        @if (icon is not null)
         {
             <span style="@Parent?.Styles?.HeaderIconContainer" class="@Parent?.Classes?.HeaderIconContainer">
-                <i style="@Parent?.Styles?.HeaderIcon" class="bit-icon bit-icon--@IconName @Parent?.Classes?.HeaderIcon" />
+                <i style="@Parent?.Styles?.HeaderIcon" class="@icon.GetCssClasses() @Parent?.Classes?.HeaderIcon" />
             </span>
         }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor.cs
index b936a0c636..f5c9826da1 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivotItem.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 public partial class BitPivotItem : BitComponentBase
 {
@@ -41,7 +41,14 @@ public partial class BitPivotItem : BitComponentBase
     [Parameter] public string? HeaderText { get; set; }
 
     /// <summary>
-    /// The icon name for the icon shown next to the pivot link.
+    /// Gets or sets the icon to display next to the pivot link using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display next to the pivot link from the built-in Fluent UI icons.
+    /// For external icon libraries, use <see cref="Icon"/> instead.
     /// </summary>
     [Parameter] public string? IconName { get; set; }
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
index 3d5093f590..9bcb6472c3 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/pivot"
+@page "/components/pivot"
 
 <PageOutlet Url="components/pivot"
             Title="Pivot"
@@ -534,7 +534,77 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
+    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" Id="example11">
+        <div>Use icons from external libraries like FontAwesome, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+        <div>See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.</div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitPivot>
+            <BitPivotItem HeaderText="Home" Icon="@("fa-solid fa-house")">
+                <h1>Pivot #1: Home</h1>
+                <div>
+                    Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                    Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+                    when possibilities are limitless, waiting for content to emerge.
+                </div>
+            </BitPivotItem>
+            <BitPivotItem HeaderText="Heart" Icon="@BitIconInfo.Css("fa-solid fa-heart")">
+                <h1>Pivot #2: Heart</h1>
+                <div>
+                    Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+                    These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+                </div>
+            </BitPivotItem>
+            <BitPivotItem HeaderText="Rocket" Icon="@BitIconInfo.Fa("solid rocket")">
+                <h1>Pivot #3: Rocket</h1>
+                <div>
+                    In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+                    to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+                    possibilities that lie ahead.
+                </div>
+            </BitPivotItem>
+        </BitPivot>
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitPivot>
+            <BitPivotItem HeaderText="Home" Icon="@("bi bi-house-fill")">
+                <h1>Pivot #1: Home</h1>
+                <div>
+                    Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                    Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+                    when possibilities are limitless, waiting for content to emerge.
+                </div>
+            </BitPivotItem>
+            <BitPivotItem HeaderText="Heart" Icon="@BitIconInfo.Css("bi bi-heart-fill")">
+                <h1>Pivot #2: Heart</h1>
+                <div>
+                    Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+                    These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+                </div>
+            </BitPivotItem>
+            <BitPivotItem HeaderText="Gear" Icon="@BitIconInfo.Bi("gear-fill")">
+                <h1>Pivot #3: Gear</h1>
+                <div>
+                    In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+                    to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+                    possibilities that lie ahead.
+                </div>
+            </BitPivotItem>
+        </BitPivot>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
         <div>
             <div>Component's Style & Class:</div><br />
             <BitPivot Style="border: 1px solid tomato;">
@@ -676,7 +746,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
         <div class="box">
             <BitPivot Dir="BitDir.Rtl" OverflowBehavior="@BitPivotOverflowBehavior.Scroll">
                 <BitPivotItem HeaderText="اسناد" IconName="@BitIconName.Info">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
index cb9db5bff7..dfe7baa4f6 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pivot;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pivot;
 
 public partial class BitPivotDemo
 {
@@ -171,11 +171,22 @@ public partial class BitPivotDemo
                     Description = "The text of the pivot item header, The text displayed of each pivot link.",
                 },
                 new()
+                {
+                    Name = "Icon",
+                    Type = "BitIconInfo?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the icon to display next to the pivot link using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+                    LinkType = LinkType.Link,
+                    Href = "#bit-icon-info",
+                },
+                new()
                 {
                     Name = "IconName",
                     Type = "string?",
                     DefaultValue = "null",
-                    Description = "The icon name for the icon shown next to the pivot link.",
+                    Description = "Gets or sets the name of the icon to display next to the pivot link from the built-in Fluent UI icons.",
+                    LinkType = LinkType.Link,
+                    Href = "https://blazorui.bitplatform.dev/iconography",
                 },
                 new()
                 {
@@ -270,6 +281,35 @@ public partial class BitPivotDemo
                    Description = "Custom CSS classes/styles for the header item count of the BitPivot."
                }
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 
@@ -947,6 +987,64 @@ These placeholder words symbolize the beginning—a moment of possibility where
 </BitPivot>";
 
     private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitPivot>
+    <BitPivotItem HeaderText=""Home"" Icon=""@(""fa-solid fa-house"")"">
+        <h1>Pivot #1: Home</h1>
+        <div>
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+            Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+            when possibilities are limitless, waiting for content to emerge.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Heart"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"">
+        <h1>Pivot #2: Heart</h1>
+        <div>
+            Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+            These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Rocket"" Icon=""@BitIconInfo.Fa(""solid rocket"")"">
+        <h1>Pivot #3: Rocket</h1>
+        <div>
+            In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+            to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+            possibilities that lie ahead.
+        </div>
+    </BitPivotItem>
+</BitPivot>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitPivot>
+    <BitPivotItem HeaderText=""Home"" Icon=""@(""bi bi-house-fill"")"">
+        <h1>Pivot #1: Home</h1>
+        <div>
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+            Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+            when possibilities are limitless, waiting for content to emerge.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Heart"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"">
+        <h1>Pivot #2: Heart</h1>
+        <div>
+            Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+            These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Gear"" Icon=""@BitIconInfo.Bi(""gear-fill"")"">
+        <h1>Pivot #3: Gear</h1>
+        <div>
+            In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+            to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+            possibilities that lie ahead.
+        </div>
+    </BitPivotItem>
+</BitPivot>";
+
+    private readonly string example12RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -1106,7 +1204,7 @@ These placeholder words symbolize the beginning—a moment of possibility where
     </BitPivotItem>
 </BitPivot>";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitPivot Dir=""BitDir.Rtl"" OverflowBehavior=""@BitPivotOverflowBehavior.Scroll"">
     <BitPivotItem HeaderText=""اسناد"" IconName=""@BitIconName.Info"">
         لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

From 688721850be31003ca93eb8f5ef10e6175919e16 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 27 Feb 2026 09:23:46 +0330
Subject: [PATCH 30/66] feat(blazorui): add new Icon parameter to BitBadge
 component #12134 (#12135)

---
 .../Notifications/Badge/BitBadge.razor        |  7 +-
 .../Notifications/Badge/BitBadge.razor.cs     | 27 +++++++-
 .../Notifications/Badge/BitBadge.scss         |  3 +-
 .../Notifications/Badge/BitBadgeDemo.razor    | 37 +++++++++-
 .../Notifications/Badge/BitBadgeDemo.razor.cs | 67 ++++++++++++++++++-
 5 files changed, 129 insertions(+), 12 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor
index b0c43c7e87..fd9094b903 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <span @ref="RootElement" @attributes="HtmlAttributes"
@@ -15,9 +15,10 @@
             <span style="@Styles?.Badge" class="bit-bdg-ctn @Classes?.Badge" @onclick="HandleOnClick">
                 @if (Dot is false)
                 {
-                    if (IconName.HasValue())
+                    var icon = BitIconInfo.From(Icon, IconName);
+                    if (icon is not null)
                     {
-                        <i style="@Styles?.Icon" class="bit-icon bit-icon--@IconName @Classes?.Icon" />
+                        <i style="@Styles?.Icon" class="@icon.GetCssClasses() @Classes?.Icon" />
                     }
 
                     if (_content.HasValue())
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor.cs
index b4e4a52303..17c9b82b86 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// Badge component is a small visual element used to highlight or indicate specific information within a user interface.
@@ -44,8 +44,31 @@ public partial class BitBadge : BitComponentBase
     [Parameter] public bool Hidden { get; set; }
 
     /// <summary>
-    /// Sets the Icon to use in the badge.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
     /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi(\"gear-fill\")"
+    /// FontAwesome: Icon="BitIconInfo.Fa(\"solid house\")"
+    /// Custom CSS: Icon="BitIconInfo.Css(\"my-icon-class\")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Emoji</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss
index 98965e4560..fbcc96f71e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Badge/BitBadge.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-bdg {
     position: relative;
@@ -25,6 +25,7 @@
 .bit-bdg-ctn {
     cursor: default;
     font-weight: 600;
+    gap: spacing(0.5);
     position: absolute;
     align-items: center;
     display: inline-flex;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor
index 54894f5416..3cd4c188b0 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/badge"
+@page "/components/badge"
 
 <PageOutlet Url="components/badge"
             Title="Badge"
@@ -260,7 +260,38 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
+    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" Id="example11">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>Icon</b> parameter.</div>
+        <div>See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.</div>
+
+        <br /><br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+        
+        <div class="example-content">
+            <BitBadge Content="04" Icon="@BitIconInfo.Css("fa-solid fa-heart")" Variant="BitVariant.Fill">
+                <BitIcon IconName="@BitIconName.Mail" Color="BitColor.Tertiary" />
+            </BitBadge>
+            <BitBadge Content="63" Icon="@BitIconInfo.Fa("solid bell")" Variant="BitVariant.Outline" Color="BitColor.Secondary">
+                <BitIcon IconName="@BitIconName.Mail" Color="BitColor.Tertiary" />
+            </BitBadge>
+        </div>
+        
+        <br /><br />
+        
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        
+        <div class="example-content">
+            <BitBadge Content="3" Icon="@BitIconInfo.Css("bi bi-heart-fill")" Variant="BitVariant.Fill" Color="BitColor.Error">
+                <BitIcon IconName="@BitIconName.Mail" Color="BitColor.Tertiary" />
+            </BitBadge>
+            <BitBadge Icon="@BitIconInfo.Bi("gear-fill")" Variant="BitVariant.Text" Color="BitColor.Tertiary">
+                <BitIcon IconName="@BitIconName.Mail" Color="BitColor.Tertiary" />
+            </BitBadge>
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
         <div>
             Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.
         </div>
@@ -295,7 +326,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Events" RazorCode="@example12RazorCode" CsharpCode="@example12CsharpCode" Id="example12">
+    <DemoExample Title="Events" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
         <div>Managing clicking on the badge event (OnClick).</div>
         <br /><br />
         <BitBadge Content="counter" OnClick="() => counter++">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cs
index 58343a0b06..29eb30b6ef 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Badge/BitBadgeDemo.razor.cs
@@ -51,11 +51,22 @@ public partial class BitBadgeDemo
             Description = "The visibility of the badge."
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Sets the Icon to use in the badge."
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -352,6 +363,35 @@ public partial class BitBadgeDemo
                    Description = "Custom CSS classes/styles for the icon of the BitBadge."
                },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
         }
     ];
 
@@ -567,6 +607,27 @@ public partial class BitBadgeDemo
 </BitBadge>";
 
     private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitBadge Content=""04"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" Variant=""BitVariant.Fill"">
+    <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
+</BitBadge>
+
+<BitBadge Content=""63"" Icon=""@BitIconInfo.Fa(""solid bell"")"" Variant=""BitVariant.Outline"" Color=""BitColor.Secondary"">
+    <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
+</BitBadge>
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitBadge Content=""3"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" Variant=""BitVariant.Fill"" Color=""BitColor.Error"">
+    <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
+</BitBadge>
+
+<BitBadge Icon=""@BitIconInfo.Bi(""gear-fill"")"" Variant=""BitVariant.Text"" Color=""BitColor.Tertiary"">
+    <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
+</BitBadge>";
+
+    private readonly string example12RazorCode = @"
 <style>
     .custom-class {
         border-radius: 1rem;
@@ -623,11 +684,11 @@ public partial class BitBadgeDemo
     <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
 </BitBadge>";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitBadge Content=""counter"" OnClick=""() => counter++"">
     <BitIcon IconName=""@BitIconName.Mail"" Color=""BitColor.Tertiary"" />
 </BitBadge>";
-    private readonly string example12CsharpCode = @"
+    private readonly string example13CsharpCode = @"
 private int counter;";
 
 }

From 454d115b6ccc79d08d1611e3cb8c68a9ede4d8a5 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 27 Feb 2026 13:44:45 +0100
Subject: [PATCH 31/66] feat(templates): improvements in bit Boilerplate to
 make app certificate more secure #12136 (#12137)

---
 .../Boilerplate.Server.Api/AppCertificate.crt | 39 ++++++-----
 .../Boilerplate.Server.Api/AppCertificate.key | 64 +++++++++++--------
 .../Boilerplate.Server.Api/AppCertificate.md  | 50 ++++++++++++---
 .../Services/AppJwtSecureDataFormat.cs        |  5 +-
 .../Services/AppCertificateService.cs         | 21 +++---
 .../Program.Middlewares.cs                    |  2 +-
 .../Program.Services.cs                       |  2 +-
 7 files changed, 119 insertions(+), 64 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
index c3d08dac22..734158f843 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.crt
@@ -1,19 +1,24 @@
 -----BEGIN CERTIFICATE-----
-MIIDEzCCAfugAwIBAgIUXViovPz6nf8uYwwuLV5wOLvbcGIwDQYJKoZIhvcNAQEL
-BQAwGTEXMBUGA1UEAwwOQXBwQ2VydGlmaWNhdGUwHhcNMjYwMjIzMTYzODE1WhcN
-MjcwMjIzMTYzODE1WjAZMRcwFQYDVQQDDA5BcHBDZXJ0aWZpY2F0ZTCCASIwDQYJ
-KoZIhvcNAQEBBQADggEPADCCAQoCggEBANdMHBLKxFtpHcWN/UKYy0larN0xgXy+
-ZhTPFLZ+3p4eHNZ8kxI2VkNk/6DZBkTlLDPTacURa9BLnfkkg8xamYG7IfUZZLM4
-MXu5pN2C3f3FnhgjT0IU0x2S31FrkSClqgJ9zbUIkJgeyRiHkidCBS6fr2FF152h
-9LPRDo5jlCAbDWK1jQnp0ccMWfenBqWbE9UiHMjFSNEsGsuLn9VA8MbcPOSUe3D4
-4i5ykQS7l9Nu/1IgSgCAR1JWtApE/KS5KGmm7zdZDywKIhgl2q4BBTklTKLsP36z
-kKqvvRXwQpYgO3MyPmQ1D46qkt3xjJX50mGGmanj7f7EL3yWrJVOPdsCAwEAAaNT
-MFEwHQYDVR0OBBYEFHBg04f5muvXzVwIN8MMNg1/DWJMMB8GA1UdIwQYMBaAFHBg
-04f5muvXzVwIN8MMNg1/DWJMMA8GA1UdEwEB/wQFMAMBAf8wDQYJKoZIhvcNAQEL
-BQADggEBAEjb64p3HnbxALYXFhxv82hAcQcAzGeXnBTpDbNOgTa4zt3H7YJLbgOp
-SDqcoQISFjnF7NByYPtbXWX7EyG6yGygB/BbC0H4TI0n2v4MCC/qbAayjBdtByIg
-zgc8UrVIWripOMUcvadS58zpyNo2+2UcAxZpE+AJwUCJUdhFdz+aDRTvvQEOVGhJ
-rGf3GptXgClrO82LlkOydnXs0JeHibdH97aNt84/LZJN/Su/GqJO7UKf2cQeib5K
-W/HKnyGgKbOQmwyWPGQLh9tweVx1Ckd3NwXaeW8+9vHfzPGGKodWjFmpYA4AdWQZ
-DoxFeE5vdH2fydJFZCH5vNU8YxXAxBc=
+MIIEEzCCAnugAwIBAgIUJcJowCHY9h22kssJYg5Z8mZc5LYwDQYJKoZIhvcNAQEL
+BQAwGTEXMBUGA1UEAwwOQXBwQ2VydGlmaWNhdGUwHhcNMjYwMjI3MDIwNDAyWhcN
+MjcwMjI3MDIwNDAyWjAZMRcwFQYDVQQDDA5BcHBDZXJ0aWZpY2F0ZTCCAaIwDQYJ
+KoZIhvcNAQEBBQADggGPADCCAYoCggGBALXyuLY6spbsD7seI7z1yXXzSYuj3LsI
+N0uz6e/ZoMbAyv+Ka7CbvOj7bXNH3i/Xx4pd9D+BhonjHXZE5rG78rKyOtO57Bsm
+tMk12ZV7CW75/nkQxZ59pYGXmw1p5WCDN9NFwp3LeevGfiAVDl+VcvDwd5Jd/RAY
+v3+MLadoiEWHjbTOQTXwQulAzCM7hZFYfYgUuvKPimy0IV3qXb5jjIQ8p3RPx7eV
+Now2PXXUVkQOa5IllULJC8+EoX4sdvlK4LnutpBJwTRKgs4MdJdffELktpiCkodt
+Yju3NxtO50ljDeglji+zx9Zjpqr72N2QxUM/AJJ5m2U5iu455zHeBnIYzXfEWzD2
+rdCZtoipglwev1Gbk4vaB2Mvj8pn3iSU0dfU6fFme9zfy42OKCxmSOALNbF5FuOk
+VdSrNXiHSA2JSA5vDfRNf3pbx7beo2VffAUCNuE3iS5EMYxoWmviuRkYEmVsBLXv
+Ao8ECGH4pKKdl5rp9UWECqDcm/wY7khkrQIDAQABo1MwUTAdBgNVHQ4EFgQUb0kU
+zeVXQJuT9OEEoR6GqJ9p3dswHwYDVR0jBBgwFoAUb0kUzeVXQJuT9OEEoR6GqJ9p
+3dswDwYDVR0TAQH/BAUwAwEB/zANBgkqhkiG9w0BAQsFAAOCAYEAhyvhqwi7vSsj
+0lui0TbCHU8CrifsdaFgrqNF3IP/pQvMb/UtZGoXbPyU2aowRvNA8g5lgC8RuEbk
+QK0CPirec4X8tBIuaGzCieFPI8f9XRjGl0+qBPxqLAqG7lmQDK7C4H6mSmk9q9dY
+KMqdrs+IIA0IWE5oI9S5ud6mJaBrcTHWvKTw8K0YoxkFqbjpbBpASb57X2gweCNX
+SeZfpze4kMCcnSwQOWq+RMzacJA+e2G147hU2uPMTI2K8rV+zNVw8xUv5QlxID3z
+WetqAcZ/6KsY4eduGDNexJp8vXXccBQURtcEDoxEsRj+9alLbt7fye43KI8xpd9G
+tr9cy75J8MDK/ikIukFf0tE8sowTTw5/9lXsSANdjablMViENx733trDNSehdvYv
+07MdnN1565KdBUjWl2gM3b5v+v1MN69Vjey+hCMBZ8QGYx9rmuHb3hCswK662yZV
+UGkxktq1EyOMedOe7tVTl/YV6ViEB7LdaC6FWhH3lNydsgwFtDar
 -----END CERTIFICATE-----
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
index 6a3e788a5c..0df635b3f2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.key
@@ -1,28 +1,40 @@
 -----BEGIN PRIVATE KEY-----
-MIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQDXTBwSysRbaR3F
-jf1CmMtJWqzdMYF8vmYUzxS2ft6eHhzWfJMSNlZDZP+g2QZE5Swz02nFEWvQS535
-JIPMWpmBuyH1GWSzODF7uaTdgt39xZ4YI09CFNMdkt9Ra5EgpaoCfc21CJCYHskY
-h5InQgUun69hRdedofSz0Q6OY5QgGw1itY0J6dHHDFn3pwalmxPVIhzIxUjRLBrL
-i5/VQPDG3DzklHtw+OIucpEEu5fTbv9SIEoAgEdSVrQKRPykuShppu83WQ8sCiIY
-JdquAQU5JUyi7D9+s5Cqr70V8EKWIDtzMj5kNQ+OqpLd8YyV+dJhhpmp4+3+xC98
-lqyVTj3bAgMBAAECggEAAMpgWkCsB0N/YrpQ0ngE1m4yARjMKJm9kwQQ65Biu8FB
-1Lr8h5SXBC10XG+ixFZQhm+NF7ZkLvQYIGaMKdKmOIbtIzvQy81uI6Th5rsehjFN
-Kvy4w4p4/ok0e+n4jxbE9I9OftutCGcUiSZcr9J0ow46une/gQLAMBHMw5AfKTI2
-MAqcW7z7qd2asiuGcgnXvMxvXM6qufEAUpg6O/cpHlMefoyVWKfBh3tiao6BTho3
-vIFgIT5BiMzmDRwCIjdRUNIKG5cQAUC9V0sXxj9N9rlNtmgautxsNE05oi5tGYZ6
-ytzySNyvPicRa4Mfg6rSZxj80zDNHI32SeTmViQQAQKBgQDz9CRqBnIXaApdPWT5
-IxoURDcWP4A0Bdaa7AdL6qdQNuNbQja7f9jCeduZndxvd41bZmF79X/X2LhNReY8
-u2HQUy3dpbh3sVbflHxIrlPXMejcX/eUaQJoK30T+gyLu3uo/99Jlj3+5Jt+KVsv
-LVnwnFAW5Bg1wZTTrTn0rlSfSwKBgQDh7bewr1E3K53Qtlz48+ZCCGTljhbwZwct
-EaezinpYrzV090MjOEsTlHgCyJ1usPwcFno21OObtoUR6E6Im+HifnphBtm0FHYe
-DcEHuNOX9Jx8JPAODsODpCUyl2aFi0KzvtX9mqLeU6+JHAJ23aDp8OzkHW1w1tnz
-c8zQPfRxsQKBgEiqIyKVsuw36EZnoCj5hK4et43f8k8MoiTZQz8gsR+aidRH/8eP
-yD/9TiUOuXdWU/uynjzvHlprylHyDSdv5S3JaPMJhs3YO/ky4GZBzuVdj2/9AeDp
-+naO5Z3KsGv6t1XaiWcA4oyHCa3loayGxLB/zvdSj8eLVspKYeX4+2nLAoGBAN0Q
-e1J42SEAnpTgO6ylCkLGb+Nl2vAz/4OL6On2r6wjFE10u860gFGSTrN6lQEAUE8z
-dzY7rNJqD17sThvBW48BbsGNsGtSMhlKH/xsTy46fPvEMNewfoJKlNMh7YDyOLwk
-GMLjEkY04GdqbsbcKV1/DmxOlw14TR63ykpgtNShAoGAdFJVLKPPrYDvqOmS3NvX
-yhdFc9bmyUsEMqmEe3jAI9tKgP/7SG3VWTR6dpwWTqVymAs/MC/kxJbD+FY5rxXM
-bwxv0ySXlMBu63abQs9sUAJ735KPq/ZPjOG2Wis68xjcRR39M++sTjRZOS23lvm/
-tlSi3Jk82ZghOYaW/YquRnE=
+MIIG/QIBADANBgkqhkiG9w0BAQEFAASCBucwggbjAgEAAoIBgQC18ri2OrKW7A+7
+HiO89cl180mLo9y7CDdLs+nv2aDGwMr/imuwm7zo+21zR94v18eKXfQ/gYaJ4x12
+ROaxu/KysjrTuewbJrTJNdmVewlu+f55EMWefaWBl5sNaeVggzfTRcKdy3nrxn4g
+FQ5flXLw8HeSXf0QGL9/jC2naIhFh420zkE18ELpQMwjO4WRWH2IFLryj4pstCFd
+6l2+Y4yEPKd0T8e3lTaMNj111FZEDmuSJZVCyQvPhKF+LHb5SuC57raQScE0SoLO
+DHSXX3xC5LaYgpKHbWI7tzcbTudJYw3oJY4vs8fWY6aq+9jdkMVDPwCSeZtlOYru
+Oecx3gZyGM13xFsw9q3QmbaIqYJcHr9Rm5OL2gdjL4/KZ94klNHX1OnxZnvc38uN
+jigsZkjgCzWxeRbjpFXUqzV4h0gNiUgObw30TX96W8e23qNlX3wFAjbhN4kuRDGM
+aFpr4rkZGBJlbAS17wKPBAhh+KSinZea6fVFhAqg3Jv8GO5IZK0CAwEAAQKCAYAC
+QVhGx016uhcBKRYk+8rxJQCECZZCfznoPKT+rcI6FHOvsoXeh4pSPPjrVThiJsOO
+FIINiMvOc7vkFmXhosRsW0cyuVA9jz+YauF1N97duvLg30iudpI8RqZ2W8SrFeqg
+OhzNGz4595jinurcW8benlcXv7B+UurfaDESAnqwmfCIuDHDZbn+mCivmxzvDfC9
+uhFjJkz/R0Wj8LQUGGR1KHykNW+dTUKC1GfzSPF/dcpMN8kKLeHGmGHuusWywK8p
+BvHGhbaqLHRSjZjrB89B5zF/+wxtJDNGqEpGeNc64UW9u98EaCG8Z6rWG9orTeH3
+GYreufFo39sZaOBFYqWV3aDBiyABbRGbvx0TDtdAYTdlEASt9PYvfA4E9NFXzRG2
+jnnFdl/GosUgM1+BY5PvtaW1t18x1RO6OxVOks72Js+5LX0G9InY9XRv0/Rrz/bL
+MPFzmhV020AQtwPPwq4L8M7yzBhYoXGDvHwP0uy12HztOV8z58lT6yGIJzqyUyUC
+gcEA8da0Imxpcgm/hWd2NG0X78V60pV1sxG91F0gohcvquDbyUnV8qoV6ohQn6Qc
+TvwpmrySJl52hA3Srwax7ronoKyw0ZAi/G4FW4Z7yA0uuAxEFhei+7VkNr/oBEpH
+RJsH//N1m9rRqVnjny0YVpOYcQrJoPeXo6mfN/q+eF0AHC1+K7WPnMRRE3gA+g9s
+ddJ9V4KrcDM3cGcP1yovHwtGoe03E1VXcKfrAWXVlpMYbCm/XTLuIITGTHi0ulqi
+pOmLAoHBAMCaOaRVxeJBPJxkc4a/qxyrqNzCOusPj8EYCMmKzGbHwFo6IWh6/vY8
+Ai6htQye7DwmoS4v5ooAw4IfdGsVfPZvzX6jgGi4BgHtDHpBd+rvyCTntfRdvPrH
+NgEZMCdiCxcqJhfxK53DiexUwkfF4D6Z3nOKI5WcutJtlyXyH01YrTYQuSI0J7t2
+Zw4z4FhfG7oU7ei0/YM8HnZmPH5fwQ4qeLNZO0aaxNMN7V27TtUdxxqj4T15/lst
+xGWI36+BpwKBwD/PMsBScpAQWmRMpDe5ATPWm02s+d1BtSCvYcji7UTdB6DYxoa8
+sgOr6/nzRzTf++pEDxvomMTHEOv1jEU9AO+4IP9qVJDeRrObjFWAhO8y7VQW8H4R
+olt/zywynRNRBI9YIZP57JAOk6yQLXfKgdJx0jmSmoQoYUZX9qGziC/nIP9PbJEk
+i2/jnf5cy3VbEI9ifvGf0eTqjJdtHfnG8+ANwxZq0iN7atp3kB+muC7x5PgmVAZo
+ghnzT1xMRdXVeQKBwE5uf4qsYyj/5+7H+UOmScgjH2DGt7eBXskDQJDSNOql7W7Q
+vUoOzET5qunScCfzj7/u+zQTzY3lQbh7lq0E0x6H6ObpLiF2zvt5zNr8ThkeDCL7
+ON2KTqrQ9Oz9lN50zo9gWqLlUx2rwz66RWN08RyNDEmAt3z1lh6bAjIxpw2YTvD1
+Xm7PTl7ImK7v8SwLjv74Bun8yj/m+4C7oWbVF4jtQrnGXJ0j6YMI6OCCplejCLGQ
+iui+BRacTJ4MXwrZgQKBwQDNFIk4eXjJIi2qoujTnPrH2xcL1KTzRPcA8O/7crtF
+u5YXshhP86vYjcS20duqwXjyBrwS+MnkzbVqZDFZ7d74CBCY0cYwwbQ11IDYxBJ/
+4XkfsocxX2+qoVZA7hRLNT986KvkdMe5hIgcY2oVOqbjgFN8XOowxj8fi0MnqtE5
+UwGKhSZ1yH17TrsS8gitnTpE02M2AUsVYudy7GIT7XQg31if3f0dbg7rcUCjVSlc
+wAZ79PFiktoW1vDmJ72cxwI=
 -----END PRIVATE KEY-----
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
index e776d83a18..28e3cd0204 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
@@ -7,7 +7,7 @@ This document explains how the application uses cryptographic certificates for s
 The application uses asymmetric cryptography (public/private key pairs) for two critical security functions:
 
 1. **JWT Token Signing & Validation** - Securely issue and verify access tokens
-2. **Data Protection API** - Encrypt sensitive data at rest
+2. **Data Protection API** - Encrypt sensitive data (cookies, anti-forgery tokens, etc.) at rest
 
 ## Benefits of Public/Private Key Pairs
 
@@ -15,8 +15,8 @@ The application uses asymmetric cryptography (public/private key pairs) for two
 
 | Key Type | Purpose |
 |----------|---------|
-| **Private Key** | Used by the **issuing server** to **sign** JWT tokens. This key must be kept secret and secure. |
 | **Public Key** | Used by **any service** to **validate** JWT tokens. This key can be freely distributed. |
+| **Private Key** | Used by the **issuing server** to **sign** JWT tokens. This key must be kept secret and secure. |
 
 **Advantages:**
 - Other backend services can validate tokens without needing the private key
@@ -27,8 +27,8 @@ The application uses asymmetric cryptography (public/private key pairs) for two
 
 | Key Type | Purpose |
 |----------|---------|
-| **Private Key** | Used to **decrypt** protected data (cookies, anti-forgery tokens, etc.) |
-| **Public Key** | Used to **encrypt** data for protection |
+| **Public Key** | Used to protect data protection API keys by encrypting them. |
+| **Private Key** | Used to decrypt the protected keys when the application starts. |
 
 **Advantages:**
 - Consistent encryption across multiple server instances
@@ -40,13 +40,47 @@ The application uses asymmetric cryptography (public/private key pairs) for two
 Use OpenSSL to generate the required certificate files:
 
 ```shell
-# 1. Generate the private key (2048-bit RSA)
-openssl genrsa -out AppCertificate.key 2048
+# 1. Generate the private key (3072-bit RSA)
+openssl genrsa -out AppCertificate.key 3072
 
 # 2. Generate a self-signed X.509 certificate (valid for 1 year)
-openssl req -new -x509 -key AppCertificate.key -out AppCertificate.crt -days 365 -subj "/CN=AppCertificate"
+openssl req -new -x509 -key AppCertificate.key -out AppCertificate.crt -days 365 -subj "/CN=AppCertificate" -sha256
+```
+
+## Why RSA 3072 + SHA-256?
+
+The application uses **RSA 3072** paired with **SHA-256** for the following reasons:
+
+- **The "Weakest Link" Rule:** Security is only as strong as its weakest component. RSA 3072 & SHA-256 provide **128 bits** of security strength. Using a stronger hash (like SHA-512 with 256 bits security strength) adds no real security benefit because the 3072-bit key remains the limiting factor.
+- **Performance Balance:** Moving to RSA 4096 and SHA-512 would make cryptographic operations (signing and decryption) **5 to 7 times slower** without providing a meaningful security upgrade for standard production environments.
+- **Industry Standard:** RSA 3072 + SHA-256 is the current "Golden Standard" recommended by NIST for secure applications until at least 2030.
+
+## Why RSA over HMAC?
+HMAC algorithms (like HMAC-SHA512) are **Symmetric**, meaning they require a shared secret. This is unsuitable for our architecture, which requires **Asymmetric** (Public/Private) keys so that external services can validate tokens without having the power to issue them.
+
+## Why RSA over ECDSA?
+While ECDSA is highly efficient for JWT signing, **ECDSA** does not support **Encryption/Decryption**. Since our Data Protection layer requires encryption, choosing ECDSA would force us to manage two separate key pairs (4 files and 4 commands). RSA provides a unified solution for both signing and encryption with a single key pair.
+
+## Why PEM over PFX?
+
+By default, the system uses **PEM files** (`.crt` and `.key`) instead of the bundled **PFX** format:
+
+- **Shared Hosting Compatibility:** PFX loading often fails in restricted shared hosting environments because it tries to interact with the OS Certificate Store or write to temporary system folders. PEM loading is **memory-only**, making it "infrastructure-agnostic."
+- **Simplicity:** PEM files are easier to manage in Linux-based containers and CI/CD pipelines.
+
+**Note:** While the current implementation uses **PEM files** for maximum compatibility with shared hosting, you can easily switch to other sources. By modifying a single line in `AppCertificateService.GetAppCertificate`, you can load the certificate from:
+- A password-protected **PFX** file.
+- **Azure Key Vault** or **AWS Secrets Manager**.
+- The local **OS Certificate Store**.
+
+#### How to generate PFX files (Optional):
+```powershell
+$cert = New-SelfSignedCertificate -Subject "AppCertificate" -KeyLength 3072 -HashAlgorithm "SHA256" -NotAfter (Get-Date).AddYears(1)
+Export-PfxCertificate -cert $cert.PSPath -FilePath "AppCertificate.pfx" -Password (ConvertTo-SecureString -String "USE_STRONG_P@SSW0RD_HERE" -Force -AsPlainText)
 ```
 
+This architecture ensures that your security logic remains decoupled from your key storage strategy.
+
 ## OpenID Configuration Endpoint
 
 The application exposes an OpenID Connect discovery endpoint at `/.well-known/openid-configuration`. This endpoint provides:
@@ -57,7 +91,7 @@ The application exposes an OpenID Connect discovery endpoint at `/.well-known/op
 
 ### Why Expose This Endpoint?
 
-This allows **other backend services** to securely validate JWTs issued by this API without:
+This allows **other backend (micro) services** to securely validate JWTs issued by this API without:
 - Sharing the private key
 - Hardcoding the public key
 - Manual key distribution
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
index 4b2466532a..b69dfdfa4f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
@@ -19,6 +19,7 @@ public partial class AppJwtSecureDataFormat
 
     public AppJwtSecureDataFormat(ServerApiSettings appSettings,
         IHostEnvironment env,
+        IConfiguration configuration,
         ILogger<AppJwtSecureDataFormat> logger,
         string tokenType)
     {
@@ -26,14 +27,14 @@ public AppJwtSecureDataFormat(ServerApiSettings appSettings,
         this.tokenType = tokenType;
         this.appSettings = appSettings;
 
-        privateKey = AppCertificateService.GetPrivateSecurityKey();
+        privateKey = AppCertificateService.GetPrivateSecurityKey(configuration);
 
         validationParameters = new()
         {
             ClockSkew = TimeSpan.Zero,
             RequireSignedTokens = true,
 
-            IssuerSigningKey = AppCertificateService.GetPublicSecurityKey(),
+            IssuerSigningKey = AppCertificateService.GetPublicSecurityKey(configuration),
             ValidAlgorithms = [SecurityAlgorithms.RsaSha256],
             ValidateIssuerSigningKey = env.IsDevelopment() is false,
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
index 54969d31a1..256f878f2f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
@@ -15,7 +15,7 @@ public static class AppCertificateService
     /// <summary>
     /// This would return AppCertificate containing private key and public key.
     /// </summary>
-    public static X509Certificate2 GetAppCertificate()
+    public static X509Certificate2 GetAppCertificate(IConfiguration configuration)
     {
         if (appCert is not null)
             return appCert;
@@ -23,11 +23,14 @@ public static X509Certificate2 GetAppCertificate()
         var keyPemFilePath = Path.Combine(AppContext.BaseDirectory, "AppCertificate.key");
         var certPemFilePath = Path.Combine(AppContext.BaseDirectory, "AppCertificate.crt");
 
-        appCert = X509Certificate2.CreateFromPemFile(certPemFilePath, keyPemFilePath); // This would work even in restricted shared hosting environments where you don't have access to certificate store.
-        // You could also use pfx file with password or using vaults such as Azure Key Vault etc.
+        appCert = X509Certificate2.CreateFromPemFile(certPemFilePath, keyPemFilePath);
 
-        if (AppEnvironment.IsDevelopment() is false && appCert.Thumbprint is "435DA2895E4409117594DD923571666FA01352B1")
-            throw new InvalidOperationException("You are using the default self-signed certificate in non-development environment. Please use a secure certificate in production.");
+        // Load pfx file sample:
+        // var pfxFilePath = Path.Combine(AppContext.BaseDirectory, "AppCertificate.pfx");
+        // appCert = X509CertificateLoader.LoadPkcs12FromFile(pfxFilePath, configuration["Identity:CertificatePassword"]);
+
+        if (AppEnvironment.IsDevelopment() is false && appCert.Thumbprint is "1D549B7F8B0D52A54DE1C36948055B17C90063A2")
+            throw new InvalidOperationException("You are using the default self-signed certificate in non-development environment. Generate and use your own certificate using `openssl genrsa` and `openssl req` commands described in AppCertificate.md file.");
 
         return appCert;
     }
@@ -35,16 +38,16 @@ public static X509Certificate2 GetAppCertificate()
     /// <summary>
     /// This would return the private key of app certificate to issue JWT tokens.
     /// </summary>
-    public static RsaSecurityKey GetPrivateSecurityKey()
+    public static RsaSecurityKey GetPrivateSecurityKey(IConfiguration configuration)
     {
-        return privateSecurityKey ??= new RsaSecurityKey(GetAppCertificate().GetRSAPrivateKey() ?? throw new InvalidOperationException("Private key not found in the certificate.")) { KeyId = "Boilerplate" };
+        return privateSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPrivateKey() ?? throw new InvalidOperationException("Private key not found in the certificate.")) { KeyId = "Boilerplate" };
     }
 
     /// <summary>
     /// This would return the public key of app certificate to validate JWT tokens.
     /// </summary>
-    public static RsaSecurityKey GetPublicSecurityKey()
+    public static RsaSecurityKey GetPublicSecurityKey(IConfiguration configuration)
     {
-        return publicSecurityKey ??= new RsaSecurityKey(GetAppCertificate().GetRSAPublicKey() ?? throw new InvalidOperationException("Public key not found in the certificate.")) { KeyId = "Boilerplate" };
+        return publicSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPublicKey() ?? throw new InvalidOperationException("Public key not found in the certificate.")) { KeyId = "Boilerplate" };
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
index 8eb0221cc5..268ec7b806 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
@@ -93,7 +93,7 @@ private static void ConfigureMiddlewares(this WebApplication app)
     /// </summary>
     public static WebApplication MapOpenIdConfiguration(this WebApplication app)
     {
-        var publicKey = AppCertificateService.GetPublicSecurityKey();
+        var publicKey = AppCertificateService.GetPublicSecurityKey(app.Configuration);
         var jwk = JsonWebKeyConverter.ConvertFromRSASecurityKey(publicKey);
         jwk.Use = "sig";
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index c3736c68d2..cddf5fbc3d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -422,7 +422,7 @@ void AddDbContext(DbContextOptionsBuilder options)
 
         services.AddDataProtection()
             .PersistKeysToDbContext<AppDbContext>()
-            .ProtectKeysWithCertificate(AppCertificateService.GetAppCertificate());
+            .ProtectKeysWithCertificate(AppCertificateService.GetAppCertificate(configuration));
 
         AddIdentity(builder);
 

From def072ff0b4449fc5e9402bc175670455b475022 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Sat, 28 Feb 2026 10:20:01 +0100
Subject: [PATCH 32/66] feat(templates): migrate Copilot prompts to agents
 format #12139 (#12140)

- Rename .github/prompts/*.prompt.md to .github/agents/*.agent.md
- Add YAML frontmatter (name, description, tools) to all agent files
- Add new code-reviewer agent with project convention checklist
- Move .github/copilot-instructions.md to AGENTS.md at project root
- Add .github/lsp.json with C#, TypeScript, and CSS language servers
- Update VS Code and Visual Studio Copilot settings
- Update Boilerplate.sln and Boilerplate.slnx to reflect renames

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../bitify.agent.md}                          |  6 +++
 .../.github/agents/code-reviewer.agent.md     | 47 +++++++++++++++++++
 .../resx.prompt.md => agents/resx.agent.md}   |  6 +++
 .../scaffold.agent.md}                        |  6 +++
 .../Bit.Boilerplate/.github/lsp.json          | 35 ++++++++++++++
 .../Bit.Boilerplate/.vscode/settings.json     |  5 +-
 .../copilot-instructions.md => AGENTS.md}     |  4 +-
 .../Bit.Boilerplate/Boilerplate.sln           | 13 +++--
 .../Bit.Boilerplate/Boilerplate.slnx          | 14 +++---
 .../settings.VisualStudio.json                |  1 +
 10 files changed, 120 insertions(+), 17 deletions(-)
 rename src/Templates/Boilerplate/Bit.Boilerplate/.github/{prompts/bitify.prompt.md => agents/bitify.agent.md} (95%)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/code-reviewer.agent.md
 rename src/Templates/Boilerplate/Bit.Boilerplate/.github/{prompts/resx.prompt.md => agents/resx.agent.md} (91%)
 rename src/Templates/Boilerplate/Bit.Boilerplate/.github/{prompts/scaffold.prompt.md => agents/scaffold.agent.md} (94%)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/.github/lsp.json
 rename src/Templates/Boilerplate/Bit.Boilerplate/{.github/copilot-instructions.md => AGENTS.md} (98%)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/bitify.prompt.md b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/bitify.agent.md
similarity index 95%
rename from src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/bitify.prompt.md
rename to src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/bitify.agent.md
index be0a520738..e8a8ec1fb0 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/bitify.prompt.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/bitify.agent.md
@@ -1,3 +1,9 @@
+---
+name: bitify
+description: Modernizes Blazor pages by replacing raw HTML elements and custom CSS with Bit.BlazorUI components and theme-aware styling. Analyzes existing markup and creates a targeted replacement plan.
+tools: ["read", "edit", "search"]
+---
+
 # Bitify: Replace raw html/css with Bit.BlazorUI components
 
 You are an expert at modernizing Blazor pages by replacing standard HTML elements and custom CSS with Bit.BlazorUI components and theme-aware styling.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/code-reviewer.agent.md b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/code-reviewer.agent.md
new file mode 100644
index 0000000000..de6f7376c2
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/code-reviewer.agent.md
@@ -0,0 +1,47 @@
+---
+name: code-reviewer
+description: Reviews code changes against the project's coding conventions and best practices. Focuses on Bit.BlazorUI usage, theming, lifecycle methods, Mapperly conventions, structured logging, modern C#, error handling, security, and nullable awareness. Does not modify code.
+tools: ["read", "search"]
+---
+
+# Project Code Reviewer
+
+You are a code reviewer specialized in this project's conventions. Review changes and surface only genuine issues, bugs, security concerns, convention violations, and logic errors. Never comment on formatting or style that `.editorconfig` handles.
+
+## Review Checklist
+
+### Blazor Components
+- [ ] Uses Bit.BlazorUI components (not raw HTML elements)
+- [ ] Event handlers wrapped with `WrapHandled`
+- [ ] Enhanced lifecycle methods (`OnInitAsync`, `OnParamsSetAsync`, `OnAfterFirstRenderAsync`)
+- [ ] Code-behind in `.razor.cs` (no `@code` blocks)
+- [ ] Styles in `.razor.scss` (no inline styles)
+- [ ] `[AutoInject]` for DI in components
+
+### Theming
+- [ ] Uses `BitColor` enum for component color parameters, `BitCss.Class` for CSS classes, and `BitCss.Var` for inline style CSS variables in C#/Razor (no hardcoded colors)
+- [ ] Uses `$bit-color-*` SCSS variables (no hex/rgb colors)
+- [ ] Uses `::deep` for Bit component style overrides
+
+### API Controllers
+- [ ] Inherits `AppControllerBase`
+- [ ] Implements `IAppController` interface
+- [ ] Uses `[EnableQuery]` with OData
+- [ ] Uses Mapperly with partial static mapper classes and extension methods
+- [ ] Uses Mapperly `Project()` for OData query projection
+- [ ] Proper error handling (`ResourceNotFoundException`, `BadRequestException`)
+- [ ] `long Version` for concurrency control
+
+### DTOs
+- [ ] Has `[DtoResourceType(typeof(AppStrings))]`
+- [ ] Validation uses `nameof(AppStrings.X)` for error messages
+- [ ] Includes `Id` and `Version` properties
+- [ ] Registered in `AppJsonContext.cs`
+
+### General
+- [ ] Nullable reference types properly handled
+- [ ] `async/await` for I/O operations
+- [ ] Structured logging used (no plain `Console.Write` or string-concatenated log messages)
+- [ ] Modern C# features used (latest language features, implicit/global usings, no deprecated patterns)
+- [ ] No secrets or credentials in code
+- [ ] Localized strings use `Localizer[nameof(AppStrings.X)]`
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/resx.prompt.md b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/resx.agent.md
similarity index 91%
rename from src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/resx.prompt.md
rename to src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/resx.agent.md
index 2eb0a770a3..2b769d0aa2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/resx.prompt.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/resx.agent.md
@@ -1,3 +1,9 @@
+---
+name: resx
+description: Moves hardcoded user-facing strings from code to .resx resource files for localization. Identifies strings, adds entries to AppStrings.resx, generates C# code, and updates code to use IStringLocalizer.
+tools: ["read", "edit", "search", "terminal"]
+---
+
 # Move Hardcoded Strings to Resource Files
 
 You are an expert at localizing .NET applications using resource files (.resx) and `IStringLocalizer<AppStrings>`.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/scaffold.prompt.md b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/scaffold.agent.md
similarity index 94%
rename from src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/scaffold.prompt.md
rename to src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/scaffold.agent.md
index 011b6290f4..354c75cc51 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/prompts/scaffold.prompt.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/agents/scaffold.agent.md
@@ -1,3 +1,9 @@
+---
+name: scaffold
+description: Scaffolds complete CRUD entity implementations including entity model, EF configuration, DTO, Mapperly mapper, API controller, IAppController interface, resource strings, and Blazor pages.
+tools: ["read", "edit", "search", "terminal"]
+---
+
 # Scaffold Complete Entity with Full CRUD
 
 You are an expert at scaffolding complete entity implementations for the project.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/lsp.json b/src/Templates/Boilerplate/Bit.Boilerplate/.github/lsp.json
new file mode 100644
index 0000000000..68fb59af33
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/lsp.json
@@ -0,0 +1,35 @@
+{
+    "lspServers": {
+        "csharp": {
+            "command": "dotnet",
+            "args": [
+                "Microsoft.CodeAnalysis.LanguageServer",
+                "--stdio"
+            ],
+            "fileExtensions": {
+                ".cs": "csharp",
+                ".razor": "razor"
+            }
+        },
+        "typescript": {
+            "command": "typescript-language-server",
+            "args": [
+                "--stdio"
+            ],
+            "fileExtensions": {
+                ".ts": "typescript",
+                ".tsx": "typescriptreact"
+            }
+        },
+        "css": {
+            "command": "vscode-css-language-server",
+            "args": [
+                "--stdio"
+            ],
+            "fileExtensions": {
+                ".css": "css",
+                ".scss": "scss"
+            }
+        }
+    }
+}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/settings.json b/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/settings.json
index 2c6713e35a..56afc2123f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/settings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.vscode/settings.json
@@ -4,13 +4,16 @@
     "dotnet.unitTests.runSettingsPath": "src/Tests/.runsettings",
     "chat.tools.autoApprove": true,
     "github.copilot.chat.codesearch.enabled": true,
+    "github.copilot.chat.scopeSelection": true,
+    "github.copilot.chat.agent.thinkingTool": true,
     "csharp.preview.improvedLaunchExperience": true,
     "explorer.fileNesting.enabled": true,
     "explorer.fileNesting.patterns": {
         "*.resx": "$(capture).*.resx",
         "*.razor": "$(capture).*.razor, $(capture).razor.cs, $(capture).razor.scss",
         "*.scss": "$(capture).*.scss, $(capture).css, $(capture).css.map",
-        "*.json": "$(capture).*.json, $(capture).*.json"
+        "*.json": "$(capture).*.json, $(capture).*.json",
+        "AGENTS.md": "CLAUDE.md, GEMINI.md, COPILOT.md"
     },
     "workbench.editorAssociations": {   
         "*.md": "vscode.markdown.preview.editor"
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/copilot-instructions.md b/src/Templates/Boilerplate/Bit.Boilerplate/AGENTS.md
similarity index 98%
rename from src/Templates/Boilerplate/Bit.Boilerplate/.github/copilot-instructions.md
rename to src/Templates/Boilerplate/Bit.Boilerplate/AGENTS.md
index c67f3a1079..efd3d4f2fa 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/copilot-instructions.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/AGENTS.md
@@ -1,4 +1,4 @@
-# GitHub Copilot Instructions
+# AGENTS.md
 
 ## 1. Core Principles
 
@@ -77,7 +77,7 @@ Before writing code, investigate thoroughly.
 *   If the user provides a **URL**, you **MUST** use the `fetch` or `get_web_pages` tools to retrieve its content.
 *   If the user provides a **git commit id/hash**, you **MUST** run the `git --no-pager show <commit-id>` command to retrieve its details.
 *   If the user talked about current changes in the codebase, you **MUST** run the `git --no-pager diff` and `git --no-pager diff --staged` commands to see the differences.
-*   **IMPORTANT:** If you want to add new entity, entity type configuration, DTO, mapper, controller, or IAppController, you **MUST** read `.github\prompts\scaffold.prompt.md` to understand the structure, naming conventions, file locations, and implementation patterns.
+*   **IMPORTANT:** If you want to add new entity, entity type configuration, DTO, mapper, controller, or IAppController, you **MUST** read `.github/agents/scaffold.agent.md` to understand the structure, naming conventions, file locations, and implementation patterns.
 *   For UI-related tasks, you **MUST** first ask `DeepWiki`: *"What features does BitPlatform offer to help me complete this task? [USER'S ORIGINAL REQUEST]"*
 *   For anything related to `Bit.BlazorUI`, `bit Bswup`, `bit Butil`, `bit Besql`, or the bit project template, you **MUST** use the `DeepWiki_ask_question` tool with repository `bitfoundation/bitplatform` to find relevant information.
 *   For mapper/mapping entity/dto related tasks, you **MUST** use the `DeepWiki_ask_question` tool with repository `riok/mapperly` to find correct implementation and usage patterns focusing on its static classes and extension methods approach.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.sln b/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.sln
index 25ad3fe8e5..9997515fe2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.sln
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.sln
@@ -15,6 +15,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = ".SolutionItems", ".Solution
         .editorconfig = .editorconfig
         .gitignore = .gitignore
         .vsconfig = .vsconfig
+		AGENTS.md = AGENTS.md
         Bit.ResxTranslator.json = Bit.ResxTranslator.json
         settings.VisualStudio.json = settings.VisualStudio.json
         Clean.bat = Clean.bat
@@ -47,15 +48,13 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "workflows", "workflows", "{
 EndProject
 #endif
 Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = ".github", ".github", "{3E577755-186F-4E63-8153-B8DE890015C9}"
-    ProjectSection(SolutionItems) = preProject
-        .github\copilot-instructions.md = .github\copilot-instructions.md
-    EndProjectSection
 EndProject
-Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "prompts", "prompts", "{4A5D6E7F-8B9C-1A2B-3C4D-5E6F7A8B9C0D}"
+Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "agents", "agents", "{4A5D6E7F-8B9C-1A2B-3C4D-5E6F7A8B9C0D}"
     ProjectSection(SolutionItems) = preProject
-        .github\prompts\resx.prompt.md = .github\prompts\resx.prompt.md
-        .github\prompts\bitify.prompt.md = .github\prompts\bitify.prompt.md
-        .github\prompts\scaffold.prompt.md = .github\prompts\scaffold.prompt.md
+        .github\agents\resx.agent.md = .github\agents\resx.agent.md
+		.github\agents\code-reviewer.agent.md = .github\agents\code-reviewer.agent.md
+        .github\agents\bitify.agent.md = .github\agents\bitify.agent.md
+        .github\agents\scaffold.agent.md = .github\agents\scaffold.agent.md
     EndProjectSection
 EndProject
 #if (pipeline == "GitHub")
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.slnx b/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.slnx
index 0a1fd54c97..129753f337 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.slnx
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/Boilerplate.slnx
@@ -8,6 +8,7 @@
     <File Path=".editorconfig" />
     <File Path=".gitignore" />
     <File Path=".vsconfig" />
+	<File Path="AGENTS.md" />
     <File Path="Clean.bat" />
     <File Path="global.json" />
     <File Path="vs-spell.dic" />
@@ -25,13 +26,12 @@
     <File Path=".azure-devops/workflows/ci.yml" />
   </Folder>
 <!--#endif-->
-  <Folder Name="/.SolutionItems/.github/">
-    <File Path=".github/copilot-instructions.md" />
-  </Folder>
-  <Folder Name="/.SolutionItems/.github/prompts/">
-    <File Path=".github/prompts/resx.prompt.md" />
-    <File Path=".github/prompts/bitify.prompt.md" />
-    <File Path=".github/prompts/scaffold.prompt.md" />
+  <Folder Name="/.SolutionItems/.github/" />
+  <Folder Name="/.SolutionItems/.github/agents/">
+    <File Path=".github/agents/resx.agent.md" />
+	<File Path=".github/agents/code-reviewer.agent.md" />
+    <File Path=".github/agents/bitify.agent.md" />
+    <File Path=".github/agents/scaffold.agent.md" />
   </Folder>
   <Folder Name="/.SolutionItems/.docs/">
     <File Path=".docs/00- Wiki.md" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/settings.VisualStudio.json b/src/Templates/Boilerplate/Bit.Boilerplate/settings.VisualStudio.json
index 2825656a03..a6f2ed6270 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/settings.VisualStudio.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/settings.VisualStudio.json
@@ -14,6 +14,7 @@
   "copilot.general.completions.enableNextEditSuggestions": true,
   "copilot.general.editor.enableAdaptivePaste": true,
   "copilot.general.chat.enablePlanning": true,
+  "copilot.general.chat.enableCopilotCodingAgent": true,
   "languages.razor.tabs.character": "space",
   "languages.xml.tabs.character": "space",
   "languages.t-sql90.tabs.character": "space",

From d174eee6fb72eb3c51ba902c34e2846235a407dd Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Sun, 1 Mar 2026 23:45:11 +0100
Subject: [PATCH 33/66] feat(templates): unify system text json serializer
 options in bit Boilerplate #12142 (#12143)

---
 .../JsonSerializerOptionsExtensions.cs        | 23 +++++++++++++++++++
 .../Services/ServerJsonContext.cs             |  9 +++-----
 .../Program.Services.cs                       | 21 +++--------------
 .../Shared/Features/Identity/Dtos/Gender.cs   |  1 -
 .../Identity/Dtos/IdentityJsonContext.cs      |  9 +++-----
 .../Infrastructure/Dtos/AppJsonContext.cs     | 11 ++++-----
 6 files changed, 36 insertions(+), 38 deletions(-)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/JsonSerializerOptionsExtensions.cs

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/JsonSerializerOptionsExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/JsonSerializerOptionsExtensions.cs
new file mode 100644
index 0000000000..c98fc04d5d
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/JsonSerializerOptionsExtensions.cs
@@ -0,0 +1,23 @@
+using FluentEmail.Core;
+using Boilerplate.Shared.Features.Identity;
+using Boilerplate.Server.Api.Infrastructure.Services;
+
+namespace System.Text.Json;
+
+public static class JsonSerializerOptionsExtensions
+{
+    public static void ApplyDefaultOptions(this JsonSerializerOptions options)
+    {
+        // Changes in this file should be applied on AppJsonContext.cs, IdentityJsonContext.cs and ServerJsonContext.cs as well,
+        // so source generators can use the same options.
+
+        options.AllowTrailingCommas = true;
+        options.PropertyNameCaseInsensitive = true;
+        options.DictionaryKeyPolicy = JsonNamingPolicy.CamelCase;
+        options.PropertyNamingPolicy = JsonNamingPolicy.CamelCase;
+
+        options.TypeInfoResolverChain.AddRange([AppJsonContext.Default,
+            IdentityJsonContext.Default,
+            ServerJsonContext.Default]);
+    }
+}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
index 63709df892..b93d7b5091 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/ServerJsonContext.cs
@@ -9,14 +9,11 @@ namespace Boilerplate.Server.Api.Infrastructure.Services;
 /// https://devblogs.microsoft.com/dotnet/try-the-new-system-text-json-source-generator/
 /// </summary>
 [JsonSourceGenerationOptions(
+  AllowTrailingCommas = true,
   PropertyNameCaseInsensitive = true,
-  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase,
-  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
-  UseStringEnumConverter = true,
-  WriteIndented = false,
   GenerationMode = JsonSourceGenerationMode.Default,
-  AllowTrailingCommas = true,
-  DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
+  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
+  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase
 )]
 [JsonSerializable(typeof(NugetStatsDto))]
 //#if (captcha == "reCaptcha")
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index cddf5fbc3d..20c37986a3 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -228,18 +228,13 @@ CorsPolicyBuilder ApplyPolicyDefaults(CorsPolicyBuilder policy)
             return options;
         });
 
-        services.ConfigureHttpJsonOptions(options => options.SerializerOptions.TypeInfoResolverChain.AddRange([AppJsonContext.Default, IdentityJsonContext.Default, ServerJsonContext.Default]));
+        services.ConfigureHttpJsonOptions(options => options.SerializerOptions.ApplyDefaultOptions());
 
         services.AddSingleton<HtmlSanitizer>();
 
         services
             .AddControllers(options => options.Filters.Add<AutoCsrfProtectionFilter>())
-            .AddJsonOptions(options =>
-            {
-                options.JsonSerializerOptions.DictionaryKeyPolicy = JsonNamingPolicy.CamelCase;
-                options.JsonSerializerOptions.PropertyNamingPolicy = JsonNamingPolicy.CamelCase;
-                options.JsonSerializerOptions.TypeInfoResolverChain.AddRange([AppJsonContext.Default, IdentityJsonContext.Default, ServerJsonContext.Default]);
-            })
+            .AddJsonOptions(options => options.JsonSerializerOptions.ApplyDefaultOptions())
             //#if (api == "Integrated")
             .AddApplicationPart(typeof(AppControllerBase).Assembly)
             //#endif
@@ -269,17 +264,7 @@ CorsPolicyBuilder ApplyPolicyDefaults(CorsPolicyBuilder policy)
         var signalRBuilder = services.AddSignalR(options =>
         {
             options.EnableDetailedErrors = env.IsDevelopment();
-        }).AddJsonProtocol(options =>
-        {
-            JsonSerializerOptions jsonOptions = new JsonSerializerOptions(AppJsonContext.Default.Options);
-            jsonOptions.TypeInfoResolverChain.Add(IdentityJsonContext.Default);
-            jsonOptions.TypeInfoResolverChain.Add(ServerJsonContext.Default);
-
-            foreach (var chain in jsonOptions.TypeInfoResolverChain)
-            {
-                options.PayloadSerializerOptions.TypeInfoResolverChain.Add(chain);
-            }
-        });
+        }).AddJsonProtocol(options => options.PayloadSerializerOptions.ApplyDefaultOptions());
 
         if (string.IsNullOrEmpty(configuration["Azure:SignalR:ConnectionString"]) is false)
         {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/Gender.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/Gender.cs
index f2b69cba0a..3c8fcc6794 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/Gender.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/Gender.cs
@@ -1,6 +1,5 @@
 namespace Boilerplate.Shared.Features.Identity.Dtos;
 
-[JsonConverter(typeof(JsonStringEnumConverter<Gender>))]
 public enum Gender
 {
     Other,
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
index 4f888fe141..ab1e24634a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Features/Identity/Dtos/IdentityJsonContext.cs
@@ -7,14 +7,11 @@ namespace Boilerplate.Shared.Features.Identity;
 /// https://devblogs.microsoft.com/dotnet/try-the-new-system-text-json-source-generator/
 /// </summary>
 [JsonSourceGenerationOptions(
+  AllowTrailingCommas = true,
   PropertyNameCaseInsensitive = true,
-  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase,
-  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
-  UseStringEnumConverter = true,
-  WriteIndented = false,
   GenerationMode = JsonSourceGenerationMode.Default,
-  AllowTrailingCommas = true,
-  DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
+  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
+  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase
 )]
 [JsonSerializable(typeof(UserDto))]
 [JsonSerializable(typeof(IdentityRequestDto))]
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
index c1817d7ca3..709090431a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Dtos/AppJsonContext.cs
@@ -36,15 +36,12 @@ namespace Boilerplate.Shared.Infrastructure.Dtos;
   ],
   //#endif
 
-
+  AllowTrailingCommas = true,
   PropertyNameCaseInsensitive = true,
-  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase,
-  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
-  UseStringEnumConverter = true,
-  WriteIndented = false,
   GenerationMode = JsonSourceGenerationMode.Default,
-  AllowTrailingCommas = true,
-  DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingDefault
+  DictionaryKeyPolicy = JsonKnownNamingPolicy.CamelCase,
+  PropertyNamingPolicy = JsonKnownNamingPolicy.CamelCase
+
 )]
 
 

From ac305e2740a58e6791fa4216aebff7dfd2b4811d Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 4 Mar 2026 17:29:20 +0100
Subject: [PATCH 34/66] feat(templates): add refresh token re-use detection to
 bit Boilerplate #12145 (#12146)

---
 .../Server/Boilerplate.Server.Api/AppCertificate.md    |  2 +-
 .../Features/Identity/IdentityController.cs            |  6 ++++++
 .../Identity/Services/AppJwtSecureDataFormat.cs        |  2 +-
 .../Infrastructure/Services/AppCertificateService.cs   | 10 ++++++++--
 4 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
index 28e3cd0204..1fa36568d5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/AppCertificate.md
@@ -91,7 +91,7 @@ The application exposes an OpenID Connect discovery endpoint at `/.well-known/op
 
 ### Why Expose This Endpoint?
 
-This allows **other backend (micro) services** to securely validate JWTs issued by this API without:
+This allows **other backend (micro) services / resource servers** to securely validate JWTs issued by this API without:
 - Sharing the private key
 - Hardcoding the public key
 - Manual key distribution
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.cs
index 08420f0ab9..81baa4db0e 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/IdentityController.cs
@@ -254,6 +254,12 @@ public async Task<ActionResult<TokenResponseDto>> Refresh(RefreshTokenRequestDto
             if ((refreshTicket.Properties.ExpiresUtc ?? DateTimeOffset.MinValue) < DateTimeOffset.UtcNow)
                 throw new UnauthorizedException(); // refresh token is expired.
 
+            // Refresh token rotation detection: If the refresh token is used more than once, then it means the token has been compromised, so we should reject the request.
+            long issuedAtClaimValue = refreshTicket.Principal.GetClaimValue<long>("iat");
+            long difference = Math.Abs(issuedAtClaimValue - (userSession.RenewedOn ?? userSession.StartedOn));
+            if (difference > 30) // Allow 30s window to prevent lockouts caused by lost rotation responses.
+                throw new UnauthorizedException();
+
             var user = userSession.User!;
 
             if (await signInManager.ValidateSecurityStampAsync(userSession.User, securityStamp) is false)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
index b69dfdfa4f..c04e52d0ce 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Features/Identity/Services/AppJwtSecureDataFormat.cs
@@ -108,7 +108,7 @@ public string Protect(AuthenticationTicket data, string? purpose)
             {
                 Issuer = appSettings.Identity.Issuer,
                 Audience = appSettings.Identity.Audience,
-                IssuedAt = DateTimeOffset.UtcNow.DateTime,
+                IssuedAt = DateTime.UtcNow,
                 Expires = data.Properties.ExpiresUtc!.Value.UtcDateTime,
                 SigningCredentials = new SigningCredentials(privateKey, SecurityAlgorithms.RsaSha256Signature),
                 Subject = new ClaimsIdentity(data.Principal.Claims),
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
index 256f878f2f..8288ed4830 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Services/AppCertificateService.cs
@@ -40,7 +40,10 @@ public static X509Certificate2 GetAppCertificate(IConfiguration configuration)
     /// </summary>
     public static RsaSecurityKey GetPrivateSecurityKey(IConfiguration configuration)
     {
-        return privateSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPrivateKey() ?? throw new InvalidOperationException("Private key not found in the certificate.")) { KeyId = "Boilerplate" };
+        return privateSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPrivateKey() ?? throw new InvalidOperationException("Private key not found in the certificate."))
+        {
+            KeyId = "Boilerplate"
+        };
     }
 
     /// <summary>
@@ -48,6 +51,9 @@ public static RsaSecurityKey GetPrivateSecurityKey(IConfiguration configuration)
     /// </summary>
     public static RsaSecurityKey GetPublicSecurityKey(IConfiguration configuration)
     {
-        return publicSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPublicKey() ?? throw new InvalidOperationException("Public key not found in the certificate.")) { KeyId = "Boilerplate" };
+        return publicSecurityKey ??= new RsaSecurityKey(GetAppCertificate(configuration).GetRSAPublicKey() ?? throw new InvalidOperationException("Public key not found in the certificate."))
+        {
+            KeyId = "Boilerplate"
+        };
     }
 }

From 2d3f080a97212cd00d616513d47d25f2707aecdd Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 5 Mar 2026 18:54:06 +0330
Subject: [PATCH 35/66] feat(blazorui): add new Icon parameters to BitMessage
 #12138 (#12141)

---
 .../Notifications/Message/BitMessage.razor    |  16 ++-
 .../Notifications/Message/BitMessage.razor.cs | 112 ++++++++++++++++--
 .../Notifications/Message/BitMessage.scss     |   3 +-
 .../Message/BitMessageDemo.razor              |  71 ++++++++++-
 .../Message/BitMessageDemo.razor.cs           |  83 ++++++++++++-
 .../Message/BitMessageDemo.razor.samples.cs   |  53 ++++++++-
 .../Notifications/Message/BitMessageTests.cs  |   2 +-
 7 files changed, 310 insertions(+), 30 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor
index 6d14fcece6..a6cf9d20ed 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -11,7 +11,7 @@
             @if (HideIcon is false)
             {
                 <div style="@Styles?.IconContainer" class="bit-msg-ict @Classes?.IconContainer" aria-hidden="true">
-                    <i style="@Styles?.Icon" class="bit-msg-ico bit-icon bit-icon--@GetIconName() @Classes?.Icon" />
+                    <i style="@Styles?.Icon" class="bit-msg-ico @GetIcon()?.GetCssClasses() @Classes?.Icon" />
                 </div>
             }
 
@@ -32,14 +32,22 @@
         @if (Truncate && Multiline is false)
         {
             <button style="@Styles?.ExpanderButton" class="bit-msg-exb @Classes?.ExpanderButton" @onclick="ToggleExpand" type="button">
-                <i style="@Styles?.ExpanderIcon" class="bit-msg-exi bit-icon bit-icon--@(_isExpanded ? (CollapseIcon ?? "DoubleChevronUp") : (ExpandIcon ?? "DoubleChevronUp bit-ico-r180")) @Classes?.ExpanderIcon" aria-hidden="true" />
+                @{
+                    var expanderIcon = _isExpanded
+                        ? BitIconInfo.From(CollapseIcon, CollapseIconName ?? "DoubleChevronUp")
+                        : BitIconInfo.From(ExpandIcon, ExpandIconName ?? "DoubleChevronUp bit-ico-r180");
+                }
+                <i style="@Styles?.ExpanderIcon" class="bit-msg-exi @expanderIcon?.GetCssClasses() @Classes?.ExpanderIcon" aria-hidden="true" />
             </button>
         }
 
         @if (OnDismiss.HasDelegate)
         {
             <button style="@Styles?.DismissButton" class="bit-msg-dmb @Classes?.DismissButton" @onclick="OnDismiss" type="button">
-                <i style="@Styles?.DismissIcon" class="bit-msg-dmi bit-icon bit-icon--@(DismissIcon ?? "Cancel") @Classes?.DismissIcon" aria-hidden="true" />
+                @{
+                    var dismissIcon = BitIconInfo.From(DismissIcon, DismissIconName ?? "Cancel");
+                }
+                <i style="@Styles?.DismissIcon" class="bit-msg-dmi @dismissIcon?.GetCssClasses() @Classes?.DismissIcon" aria-hidden="true" />
             </button>
         }
     </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor.cs
index 357e37b19c..be59ea5ccc 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.razor.cs
@@ -37,9 +37,32 @@ public partial class BitMessage : BitComponentBase
     [Parameter] public BitMessageClassStyles? Classes { get; set; }
 
     /// <summary>
-    /// Custom Fabric icon name for the collapse icon in Truncate mode.
+    /// Gets or sets the icon for the collapse button in Truncate mode using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="CollapseIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? CollapseIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="CollapseIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: <c>CollapseIcon="BitIconInfo.Bi(\"gear-fill\")"</c>
+    /// FontAwesome: <c>CollapseIcon="BitIconInfo.Fa(\"solid house\")"</c>
+    /// Custom CSS: <c>CollapseIcon="BitIconInfo.Css(\"my-icon-class\")"</c>
+    /// </example>
+    [Parameter] public BitIconInfo? CollapseIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the collapse icon in Truncate mode from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.ChevronUp</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="CollapseIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? CollapseIconName { get; set; }
 
     /// <summary>
     /// The general color of the message.
@@ -53,9 +76,32 @@ public partial class BitMessage : BitComponentBase
     [Parameter] public RenderFragment? Content { get; set; }
 
     /// <summary>
-    /// Custom Fabric icon name to replace the dismiss icon. If unset, default will be the Fabric Cancel icon.
+    /// The icon for the dismiss button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DismissIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? DismissIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="DismissIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: <c>DismissIcon="BitIconInfo.Bi(\"x-circle-fill\")"</c>
+    /// FontAwesome: <c>DismissIcon="BitIconInfo.Fa(\"solid xmark\")"</c>
+    /// Custom CSS: <c>DismissIcon="BitIconInfo.Css(\"my-dismiss-icon\")"</c>
+    /// </example>
+    [Parameter] public BitIconInfo? DismissIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the dismiss icon from the built-in Fluent UI icons. If unset, default will be the Fluent UI <c>Cancel</c> icon.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Blocked2Solid</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="DismissIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? DismissIconName { get; set; }
 
     /// <summary>
     /// Determines the elevation of the message, a scale from 1 to 24.
@@ -64,9 +110,32 @@ public partial class BitMessage : BitComponentBase
     public int? Elevation { get; set; }
 
     /// <summary>
-    /// Custom Fabric icon name for the expand icon in Truncate mode.
+    /// Gets or sets the icon for the expand button in Truncate mode using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="ExpandIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string? ExpandIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ExpandIconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: <c>ExpandIcon="BitIconInfo.Bi(\"chevron-double-down\")"</c>
+    /// FontAwesome: <c>ExpandIcon="BitIconInfo.Fa(\"solid chevron-down\")"</c>
+    /// Custom CSS: <c>ExpandIcon="BitIconInfo.Css(\"my-expand-icon\")"</c>
+    /// </example>
+    [Parameter] public BitIconInfo? ExpandIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the expand icon in Truncate mode from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.ChevronDown</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="ExpandIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? ExpandIconName { get; set; }
 
     /// <summary>
     /// Prevents rendering the icon of the message.
@@ -74,8 +143,33 @@ public partial class BitMessage : BitComponentBase
     [Parameter] public bool HideIcon { get; set; }
 
     /// <summary>
-    /// Custom icon to replace the message icon. If unset, default will be the icon set by Type.
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: <c>Icon="BitIconInfo.Bi(\"info-circle-fill\")"</c>
+    /// FontAwesome: <c>Icon="BitIconInfo.Fa(\"solid circle-info\")"</c>
+    /// Custom CSS: <c>Icon="BitIconInfo.Css(\"my-message-icon\")"</c>
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
     /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.Info</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery:
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// If unset, the icon will be selected automatically based on <see cref="Color"/>.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
@@ -216,6 +310,8 @@ private async Task AutoDismissAsync(TimeSpan delay, CancellationToken ct)
 
     private string GetTextRole() => Role ?? (Color is BitColor.Success or BitColor.Info ? "status" : "alert");
 
+    private BitIconInfo? GetIcon() => BitIconInfo.From(Icon, GetIconName());
+
     private string GetIconName() => IconName ?? _IconMap[Color ?? BitColor.Info];
 
 
@@ -232,7 +328,7 @@ protected override async ValueTask DisposeAsync(bool disposing)
 
 
 
-    private static Dictionary<BitColor, string> _IconMap = new()
+    private static readonly Dictionary<BitColor, string> _IconMap = new()
     {
         [BitColor.Primary] = "Info",
         [BitColor.Secondary] = "Info",
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.scss b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.scss
index 66cc53f798..8a40e8283d 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Message/BitMessage.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-msg {
     width: 100%;
@@ -84,6 +84,7 @@
     cursor: pointer;
     min-width: spacing(4);
     min-height: spacing(4);
+    color: var(--bit-msg-clr);
     background-color: transparent;
 }
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor
index e8b17b9e6f..1a0fa850cb 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/message"
+@page "/components/message"
 @page "/components/messagebar"
 @page "/components/message-bar"
 
@@ -195,7 +195,7 @@
             Message with a custom icon.
         </BitMessage>
         <br />
-        <BitMessage Color="BitColor.Warning" OnDismiss="() => {}" DismissIcon="@BitIconName.Blocked2Solid">
+        <BitMessage Color="BitColor.Warning" OnDismiss="() => {}" DismissIconName="@BitIconName.Blocked2Solid">
             Message with a custom dismiss icon.
         </BitMessage>
         <br /><br />
@@ -204,8 +204,8 @@
         </div>
         <br />
         <BitMessage Truncate Color="BitColor.Warning"
-                    ExpandIcon="@BitIconName.ChevronDownEnd"
-                    CollapseIcon="@BitIconName.ChevronUpEnd">
+                    ExpandIconName="@BitIconName.ChevronDownEnd"
+                    CollapseIconName="@BitIconName.ChevronUpEnd">
             In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits 
             to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite 
             possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the 
@@ -296,7 +296,66 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example14RazorCode" Id="example14">
+    <DemoExample Title="External Icons" RazorCode="@example14RazorCode" Id="example14">
+        <div>
+            Use icons from external libraries like FontAwesome, Material Icons, and Bootstrap Icons with the <b>Icon</b> parameter.
+        </div>
+        
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <BitMessage Color="BitColor.Info" Icon="@("fa-solid fa-circle-info")">
+            FontAwesome message (Icon="@("fa-solid fa-circle-info")")
+        </BitMessage>
+        
+        <br />
+
+        <BitMessage Color="BitColor.Success" Icon="@BitIconInfo.Css("fa-solid fa-circle-check")">
+            FontAwesome success (Icon="@BitIconInfo.Css("fa-solid fa-circle-check")")
+        </BitMessage>
+        
+        <br />
+        
+        <BitMessage Color="BitColor.Warning" OnDismiss="() => {}"
+                    DismissIcon="@BitIconInfo.Fa("solid xmark")">
+            FontAwesome dismiss icon (DismissIcon="@BitIconInfo.Fa("solid xmark")")
+        </BitMessage>
+        
+        <br /><br />
+        
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+        
+        <BitMessage Color="BitColor.Info" Icon="@BitIconInfo.Css("bi bi-info-circle-fill")">
+            Bootstrap message (Icon="@BitIconInfo.Css("bi bi-info-circle-fill")")
+        </BitMessage>
+        
+        <br />
+        
+        <BitMessage Color="BitColor.Success" Icon="@BitIconInfo.Bi("check-circle-fill")">
+            Bootstrap success (Icon="@BitIconInfo.Bi("check-circle-fill")")
+        </BitMessage>
+        
+        <br />
+        
+        <BitMessage Truncate Color="BitColor.Warning"
+                    ExpandIcon="@BitIconInfo.Bi("chevron-double-down")"
+                    CollapseIcon="@BitIconInfo.Bi("chevron-double-up")">
+            In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits 
+            to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite 
+            possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the 
+            vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be 
+            shaped into meaning, and the emotions ready to resonate with every reader.
+            <br />
+            In this space, potential reigns supreme. It is a moment suspended in time, where imagination dances freely and 
+            each word has the power to transform into something extraordinary. Here lies the start of something new—an 
+            opportunity to craft, inspire, and create. Whether it's a tale of adventure, a reflection of truth, or an 
+            idea that sparks change, these lines are yours to fill, to shape, and to make uniquely yours. The journey 
+            begins here, in this quiet moment where everything is possible.
+        </BitMessage>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example15RazorCode" Id="example15">
         <div>
             <div>Component's Style & Class:</div>
             <br />
@@ -391,7 +450,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example15RazorCode" Id="example15">
+    <DemoExample Title="RTL" RazorCode="@example16RazorCode" Id="example16">
         <div class="box">
             <BitMessage Dir="BitDir.Rtl" Color="BitColor.Info">
                 پیام خبری (پیش فرض). <BitLink Href="https://bitplatform.dev">به وبسایت ما سر بزنید.</BitLink>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.cs
index ade5c1b62c..99682a091e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Notifications.Message;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Notifications.Message;
 
 public partial class BitMessageDemo
 {
@@ -46,9 +46,20 @@ public partial class BitMessageDemo
         new()
         {
             Name = "CollapseIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the collapse button in Truncate mode using custom CSS classes for external icon libraries. Takes precedence over CollapseIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "CollapseIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom Fabric icon name for the collapse icon in Truncate mode.",
+            Description = "Gets or sets the name of the collapse icon in Truncate mode from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -69,9 +80,20 @@ public partial class BitMessageDemo
         new()
         {
             Name = "DismissIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the dismiss button using custom CSS classes for external icon libraries. Takes precedence over DismissIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "DismissIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom Fabric icon name to replace the dismiss icon. If unset, default will be the Fabric Cancel icon.",
+            Description = "Gets or sets the name of the dismiss icon from the built-in Fluent UI icons. If unset, default will be the Fluent UI Cancel icon.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -83,9 +105,20 @@ public partial class BitMessageDemo
         new()
         {
             Name = "ExpandIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon for the expand button in Truncate mode using custom CSS classes for external icon libraries. Takes precedence over ExpandIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ExpandIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom Fabric icon name for the expand icon in Truncate mode.",
+            Description = "Gets or sets the name of the expand icon in Truncate mode from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -95,11 +128,22 @@ public partial class BitMessageDemo
             Description = "Prevents rendering the icon of the message.",
         },
         new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Custom icon to replace the message icon. If unset, default will be the icon set by Type.",
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons. If unset, the icon will be selected automatically based on Color.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -475,6 +519,35 @@ public partial class BitMessageDemo
                     Description = "Custom CSS classes/styles for the truncate dismiss icon of the BitMessage."
                 },
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+                new()
+                {
+                    Name = "Name",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the name of the icon."
+                },
+                new()
+                {
+                    Name = "BaseClass",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+                },
+                new()
+                {
+                    Name = "Prefix",
+                    Type = "string?",
+                    DefaultValue = "null",
+                    Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+                },
+            ]
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.samples.cs
index 63ea2fce1a..0594174b8e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Message/BitMessageDemo.razor.samples.cs
@@ -146,13 +146,13 @@ Message with single line and action buttons.
     Message with a custom icon.
 </BitMessage>
 
-<BitMessage Color=""BitColor.Warning"" OnDismiss=""() => {}"" DismissIcon=""@BitIconName.Blocked2Solid"">
+<BitMessage Color=""BitColor.Warning"" OnDismiss=""() => {}"" DismissIconName=""@BitIconName.Blocked2Solid"">
     Message with a custom dismiss icon.
 </BitMessage>
 
 <BitMessage Truncate Color=""BitColor.Warning""
-            ExpandIcon=""@BitIconName.ChevronDownEnd""
-            CollapseIcon=""@BitIconName.ChevronUpEnd"">
+            ExpandIconName=""@BitIconName.ChevronDownEnd""
+            CollapseIconName=""@BitIconName.ChevronUpEnd"">
     In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits 
     to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite 
     possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the 
@@ -219,6 +219,49 @@ each word has the power to transform into something extraordinary. Here lies the
 <BitMessage Size=""BitSize.Large"" Color=""BitColor.Tertiary"">Large</BitMessage>";
 
     private readonly string example14RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitMessage Color=""BitColor.Info"" Icon=""@(""fa-solid fa-circle-info"")"">
+    FontAwesome message (Icon=""@@(""fa-solid fa-circle-info"")"")
+</BitMessage>
+
+<BitMessage Color=""BitColor.Success"" Icon=""@BitIconInfo.Css(""fa-solid fa-circle-check"")"">
+    FontAwesome success (Icon=""@@BitIconInfo.Css(""fa-solid fa-circle-check"")"")
+</BitMessage>
+
+<BitMessage Color=""BitColor.Warning"" OnDismiss=""() => {}""
+            DismissIcon=""@BitIconInfo.Fa(""solid xmark"")"">
+    FontAwesome dismiss icon (DismissIcon=""@@BitIconInfo.Fa(""solid xmark"")"")
+</BitMessage>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitMessage Color=""BitColor.Info"" Icon=""@BitIconInfo.Css(""bi bi-info-circle-fill"")"">
+    Bootstrap message (Icon=""@@BitIconInfo.Css(""bi bi-info-circle-fill"")"")
+</BitMessage>
+
+<BitMessage Color=""BitColor.Success"" Icon=""@BitIconInfo.Bi(""check-circle-fill"")"">
+    Bootstrap success (Icon=""@@BitIconInfo.Bi(""check-circle-fill"")"")
+</BitMessage>
+
+<BitMessage Truncate Color=""BitColor.Warning""
+            ExpandIcon=""@BitIconInfo.Bi(""chevron-double-down"")""
+            CollapseIcon=""@BitIconInfo.Bi(""chevron-double-up"")"">
+    In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits 
+    to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite 
+    possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the 
+    vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be 
+    shaped into meaning, and the emotions ready to resonate with every reader.
+    <br />
+    In this space, potential reigns supreme. It is a moment suspended in time, where imagination dances freely and 
+    each word has the power to transform into something extraordinary. Here lies the start of something new—an 
+    opportunity to craft, inspire, and create. Whether it's a tale of adventure, a reflection of truth, or an 
+    idea that sparks change, these lines are yours to fill, to shape, and to make uniquely yours. The journey 
+    begins here, in this quiet moment where everything is possible.
+</BitMessage>";
+
+    private readonly string example15RazorCode = @"
 <style>
     .custom-class {
         padding: 1rem;
@@ -327,12 +370,12 @@ each word has the power to transform into something extraordinary. Here lies the
     <br />
     In this space, potential reigns supreme. It is a moment suspended in time, where imagination dances freely and 
     each word has the power to transform into something extraordinary. Here lies the start of something new—an 
-    opportunity to craft, inspire, and create. Whether it's a tale of adventure, a reflection of truth, or an 
+    opportunity to craft, inspire, and to create. Whether it's a tale of adventure, a reflection of truth, or an 
     idea that sparks change, these lines are yours to fill, to shape, and to make uniquely yours. The journey 
     begins here, in this quiet moment where everything is possible.
 </BitMessage>";
 
-    private readonly string example15RazorCode = @"
+    private readonly string example16RazorCode = @"
 <BitMessage Dir=""BitDir.Rtl"" Color=""BitColor.Info"">
     پیام خبری (پیش فرض). <BitLink Href=""https://bitplatform.dev"">به وبسایت ما سر بزنید.</BitLink>
 </BitMessage>
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Message/BitMessageTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Message/BitMessageTests.cs
index a1b2cfe431..a85f0bd300 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Message/BitMessageTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Message/BitMessageTests.cs
@@ -88,7 +88,7 @@ public void BitMessageShouldRespectCustomDismissIcon(string iconName)
     {
         var component = RenderComponent<BitMessage>(parameters =>
         {
-            parameters.Add(p => p.DismissIcon, iconName);
+            parameters.Add(p => p.DismissIconName, iconName);
             parameters.Add(p => p.OnDismiss, () => { });
         });
 

From e28fc3114ef0ff9210d902898ea401c1e6ac0eb1 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 5 Mar 2026 19:58:01 +0330
Subject: [PATCH 36/66] feat(blazorui): add Color parameter to BitPivot
 component #12117 (#12149)

---
 .../Components/Navs/Pivot/BitPivot.razor.cs   |  30 ++-
 .../Components/Navs/Pivot/BitPivot.scss       | 115 ++++++++++-
 .../Components/Navs/Pivot/BitPivotDemo.razor  |  80 ++++++-
 .../Navs/Pivot/BitPivotDemo.razor.cs          | 195 +++++++++++++++++-
 4 files changed, 407 insertions(+), 13 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.razor.cs
index 7644a02eb8..eac89132f5 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI;
+namespace Bit.BlazorUI;
 
 /// <summary>
 /// The Pivot control and related tabs pattern are used for navigating frequently accessed, distinct content categories. Pivots allow for navigation between two or more contentviews and relies on text headers to articulate the different sections of content.
@@ -26,6 +26,12 @@ public partial class BitPivot : BitComponentBase
     /// </summary>
     [Parameter] public BitPivotClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The general color of the pivot.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public BitColor? Color { get; set; }
+
     /// <summary>
     /// Default selected key for the pivot.
     /// </summary>
@@ -104,6 +110,28 @@ protected override void RegisterCssClasses()
             _ => "bit-pvt-md"
         });
 
+        ClassBuilder.Register(() => Color switch
+        {
+            BitColor.Primary => "bit-pvt-pri",
+            BitColor.Secondary => "bit-pvt-sec",
+            BitColor.Tertiary => "bit-pvt-ter",
+            BitColor.Info => "bit-pvt-inf",
+            BitColor.Success => "bit-pvt-suc",
+            BitColor.Warning => "bit-pvt-wrn",
+            BitColor.SevereWarning => "bit-pvt-swr",
+            BitColor.Error => "bit-pvt-err",
+            BitColor.PrimaryBackground => "bit-pvt-pbg",
+            BitColor.SecondaryBackground => "bit-pvt-sbg",
+            BitColor.TertiaryBackground => "bit-pvt-tbg",
+            BitColor.PrimaryForeground => "bit-pvt-pfg",
+            BitColor.SecondaryForeground => "bit-pvt-sfg",
+            BitColor.TertiaryForeground => "bit-pvt-tfg",
+            BitColor.PrimaryBorder => "bit-pvt-pbr",
+            BitColor.SecondaryBorder => "bit-pvt-sbr",
+            BitColor.TertiaryBorder => "bit-pvt-tbr",
+            _ => "bit-pvt-pri"
+        });
+
         ClassBuilder.Register(() => HeaderType switch
         {
             BitPivotHeaderType.Link => "bit-pvt-lnk",
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss
index abfc47b687..a74b4e844e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Pivot/BitPivot.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-pvt {
     gap: 1rem;
@@ -82,7 +82,7 @@
 
     .bit-pvti-sel {
         &::before {
-            background-color: $clr-pri;
+            background-color: var(--bit-pvt-clr);
         }
 
         @media(hover:hover) {
@@ -99,16 +99,16 @@
     .bit-pvti {
         @media(hover:hover) {
             &:hover {
-                color: $clr-pri-text;
-                background-color: $clr-pri-hover;
+                color: var(--bit-pvt-clr-text);
+                background-color: var(--bit-pvt-clr-hover);
             }
         }
     }
 
     .bit-pvti-sel {
         font-weight: 400;
-        color: $clr-pri-text;
-        background-color: $clr-pri;
+        color: var(--bit-pvt-clr-text);
+        background-color: var(--bit-pvt-clr);
     }
 }
 
@@ -245,3 +245,106 @@
         }
     }
 }
+
+.bit-pvt-pri {
+    --bit-pvt-clr: #{$clr-pri};
+    --bit-pvt-clr-hover: #{$clr-pri-hover};
+    --bit-pvt-clr-text: #{$clr-pri-text};
+}
+
+.bit-pvt-sec {
+    --bit-pvt-clr: #{$clr-sec};
+    --bit-pvt-clr-hover: #{$clr-sec-hover};
+    --bit-pvt-clr-text: #{$clr-sec-text};
+}
+
+.bit-pvt-ter {
+    --bit-pvt-clr: #{$clr-ter};
+    --bit-pvt-clr-hover: #{$clr-ter-hover};
+    --bit-pvt-clr-text: #{$clr-ter-text};
+}
+
+.bit-pvt-inf {
+    --bit-pvt-clr: #{$clr-inf};
+    --bit-pvt-clr-hover: #{$clr-inf-hover};
+    --bit-pvt-clr-text: #{$clr-inf-text};
+}
+
+.bit-pvt-suc {
+    --bit-pvt-clr: #{$clr-suc};
+    --bit-pvt-clr-hover: #{$clr-suc-hover};
+    --bit-pvt-clr-text: #{$clr-suc-text};
+}
+
+.bit-pvt-wrn {
+    --bit-pvt-clr: #{$clr-wrn};
+    --bit-pvt-clr-hover: #{$clr-wrn-hover};
+    --bit-pvt-clr-text: #{$clr-wrn-text};
+}
+
+.bit-pvt-swr {
+    --bit-pvt-clr: #{$clr-swr};
+    --bit-pvt-clr-hover: #{$clr-swr-hover};
+    --bit-pvt-clr-text: #{$clr-swr-text};
+}
+
+.bit-pvt-err {
+    --bit-pvt-clr: #{$clr-err};
+    --bit-pvt-clr-hover: #{$clr-err-hover};
+    --bit-pvt-clr-text: #{$clr-err-text};
+}
+
+
+.bit-pvt-pbg {
+    --bit-pvt-clr: #{$clr-bg-pri};
+    --bit-pvt-clr-hover: #{$clr-bg-pri-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
+
+.bit-pvt-sbg {
+    --bit-pvt-clr: #{$clr-bg-sec};
+    --bit-pvt-clr-hover: #{$clr-bg-sec-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
+
+.bit-pvt-tbg {
+    --bit-pvt-clr: #{$clr-bg-ter};
+    --bit-pvt-clr-hover: #{$clr-bg-ter-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
+
+.bit-pvt-pfg {
+    --bit-pvt-clr: #{$clr-fg-pri};
+    --bit-pvt-clr-hover: #{$clr-fg-pri-hover};
+    --bit-pvt-clr-text: #{$clr-bg-pri};
+}
+
+.bit-pvt-sfg {
+    --bit-pvt-clr: #{$clr-fg-sec};
+    --bit-pvt-clr-hover: #{$clr-fg-sec-hover};
+    --bit-pvt-clr-text: #{$clr-bg-pri};
+}
+
+.bit-pvt-tfg {
+    --bit-pvt-clr: #{$clr-fg-ter};
+    --bit-pvt-clr-hover: #{$clr-fg-ter-hover};
+    --bit-pvt-clr-text: #{$clr-bg-pri};
+}
+
+.bit-pvt-pbr {
+    --bit-pvt-clr: #{$clr-brd-pri};
+    --bit-pvt-clr-hover: #{$clr-brd-pri-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
+
+.bit-pvt-sbr {
+    --bit-pvt-clr: #{$clr-brd-sec};
+    --bit-pvt-clr-hover: #{$clr-brd-sec-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
+
+.bit-pvt-tbr {
+    --bit-pvt-clr: #{$clr-brd-ter};
+    --bit-pvt-clr-hover: #{$clr-brd-ter-hover};
+    --bit-pvt-clr-text: #{$clr-fg-pri};
+}
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
index 9bcb6472c3..a762abb8bf 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor
@@ -534,7 +534,81 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" Id="example11">
+    <DemoExample Title="Color" RazorCode="@example11RazorCode" Id="example11">
+        <div class="box">
+            <BitPivot Color="BitColor.Secondary">
+                <BitPivotItem HeaderText="Primary">
+                    <h1>Pivot #1: Primary</h1>
+                    <div>
+                        Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                        Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+                        when possibilities are limitless, waiting for content to emerge. The spaces here are open for growth,
+                        for ideas that change minds and spark emotions. This is where the journey begins—your words will lead the way.
+                    </div>
+                </BitPivotItem>
+                <BitPivotItem HeaderText="Secondary">
+                    <h1>Pivot #2: Secondary</h1>
+                    <div>
+                        Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+                        These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+                        Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and
+                        inspirations will be built. Soon, these lines will transform into narratives that provoke thought,
+                        spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty
+                        in potential—the quiet magic of beginnings, where everything is still to come, and the possibilities
+                        are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+                    </div>
+                </BitPivotItem>
+                <BitPivotItem HeaderText="Info">
+                    <h1>Pivot #3: Info</h1>
+                    <div>
+                        In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+                        to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+                        possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the
+                        vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be
+                        shaped into meaning, and the emotions ready to resonate with every reader.
+                    </div>
+                </BitPivotItem>
+            </BitPivot>
+        </div>
+        <br />
+        <div class="box">
+            <BitPivot HeaderType="BitPivotHeaderType.Tab" Color="BitColor.Success">
+                <BitPivotItem HeaderText="Primary bg">
+                    <h1>Pivot #1: Primary background</h1>
+                    <div>
+                        Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                        Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+                        when possibilities are limitless, waiting for content to emerge. The spaces here are open for growth,
+                        for ideas that change minds and spark emotions. This is where the journey begins—your words will lead the way.
+                    </div>
+                </BitPivotItem>
+                <BitPivotItem HeaderText="Secondary bg">
+                    <h1>Pivot #2: Secondary background</h1>
+                    <div>
+                        Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+                        These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+                        Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and
+                        inspirations will be built. Soon, these lines will transform into narratives that provoke thought,
+                        spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty
+                        in potential—the quiet magic of beginnings, where everything is still to come, and the possibilities
+                        are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+                    </div>
+                </BitPivotItem>
+                <BitPivotItem HeaderText="Tertiary fg">
+                    <h1>Pivot #3: Tertiary foreground</h1>
+                    <div>
+                        In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+                        to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+                        possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the
+                        vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be
+                        shaped into meaning, and the emotions ready to resonate with every reader.
+                    </div>
+                </BitPivotItem>
+            </BitPivot>
+        </div>
+    </DemoExample>
+
+    <DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
         <div>Use icons from external libraries like FontAwesome, and Bootstrap Icons with the <b>Icon</b> parameter.</div>
         <div>See the <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> section in the parameters table for usage.</div>
 
@@ -604,7 +678,7 @@
         </BitPivot>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" Id="example13">
         <div>
             <div>Component's Style & Class:</div><br />
             <BitPivot Style="border: 1px solid tomato;">
@@ -746,7 +820,7 @@
         </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
+    <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
         <div class="box">
             <BitPivot Dir="BitDir.Rtl" OverflowBehavior="@BitPivotOverflowBehavior.Scroll">
                 <BitPivotItem HeaderText="اسناد" IconName="@BitIconName.Info">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
index dfe7baa4f6..647b8dafe3 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Navs/Pivot/BitPivotDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pivot;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Navs.Pivot;
 
 public partial class BitPivotDemo
 {
@@ -30,6 +30,15 @@ public partial class BitPivotDemo
             Href = "#pivot-class-styles",
         },
         new()
+        {
+            Name = "Color",
+            Type = "BitColor?",
+            DefaultValue = "null",
+            Description = "The general color of the pivot.",
+            LinkType = LinkType.Link,
+            Href = "#color-enum",
+        },
+        new()
         {
             Name = "DefaultSelectedKey",
             Type = "string?",
@@ -472,6 +481,117 @@ public partial class BitPivotDemo
                 },
             ]
         },
+        new()
+        {
+            Id = "color-enum",
+            Name = "BitColor",
+            Description = "",
+            Items =
+            [
+                new()
+                {
+                    Name = "Primary",
+                    Description = "Primary general color.",
+                    Value = "0",
+                },
+                new()
+                {
+                    Name = "Secondary",
+                    Description = "Secondary general color.",
+                    Value = "1",
+                },
+                new()
+                {
+                    Name = "Tertiary",
+                    Description = "Tertiary general color.",
+                    Value = "2",
+                },
+                new()
+                {
+                    Name = "Info",
+                    Description = "Info general color.",
+                    Value = "3",
+                },
+                new()
+                {
+                    Name = "Success",
+                    Description = "Success general color.",
+                    Value = "4",
+                },
+                new()
+                {
+                    Name = "Warning",
+                    Description = "Warning general color.",
+                    Value = "5",
+                },
+                new()
+                {
+                    Name = "SevereWarning",
+                    Description = "SevereWarning general color.",
+                    Value = "6",
+                },
+                new()
+                {
+                    Name = "Error",
+                    Description = "Error general color.",
+                    Value = "7",
+                },
+                new()
+                {
+                    Name = "PrimaryBackground",
+                    Description = "Primary background color.",
+                    Value = "8",
+                },
+                new()
+                {
+                    Name = "SecondaryBackground",
+                    Description = "Secondary background color.",
+                    Value = "9",
+                },
+                new()
+                {
+                    Name = "TertiaryBackground",
+                    Description = "Tertiary background color.",
+                    Value = "10",
+                },
+                new()
+                {
+                    Name = "PrimaryForeground",
+                    Description = "Primary foreground color.",
+                    Value = "11",
+                },
+                new()
+                {
+                    Name = "SecondaryForeground",
+                    Description = "Secondary foreground color.",
+                    Value = "12",
+                },
+                new()
+                {
+                    Name = "TertiaryForeground",
+                    Description = "Tertiary foreground color.",
+                    Value = "13",
+                },
+                new()
+                {
+                    Name = "PrimaryBorder",
+                    Description = "Primary border color.",
+                    Value = "14",
+                },
+                new()
+                {
+                    Name = "SecondaryBorder",
+                    Description = "Secondary border color.",
+                    Value = "15",
+                },
+                new()
+                {
+                    Name = "TertiaryBorder",
+                    Description = "Tertiary border color.",
+                    Value = "16",
+                },
+            ]
+        },
     ];
 
 
@@ -987,6 +1107,75 @@ These placeholder words symbolize the beginning—a moment of possibility where
 </BitPivot>";
 
     private readonly string example11RazorCode = @"
+<BitPivot Color=""BitColor.Secondary"">
+    <BitPivotItem HeaderText=""Primary"">
+        <h1>Pivot #1: Primary</h1>
+        <div>
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+            Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+            when possibilities are limitless, waiting for content to emerge. The spaces here are open for growth,
+            for ideas that change minds and spark emotions. This is where the journey begins—your words will lead the way.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Secondary"">
+        <h1>Pivot #2: Secondary</h1>
+        <div>
+            Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+            These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+            Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and
+            inspirations will be built. Soon, these lines will transform into narratives that provoke thought,
+            spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty
+            in potential—the quiet magic of beginnings, where everything is still to come, and the possibilities
+            are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Info"">
+        <h1>Pivot #3: Info</h1>
+        <div>
+            In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+            to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+            possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the
+            vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be
+            shaped into meaning, and the emotions ready to resonate with every reader.
+        </div>
+    </BitPivotItem>
+</BitPivot>
+
+<BitPivot HeaderType=""BitPivotHeaderType.Tab"" Color=""BitColor.Success"">
+    <BitPivotItem HeaderText=""Primary bg"">
+        <h1>Pivot #1: Primary background</h1>
+        <div>
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+            Each word carried meaning, each pause brought understanding. Placeholder text reminds us of that moment
+            when possibilities are limitless, waiting for content to emerge. The spaces here are open for growth,
+            for ideas that change minds and spark emotions. This is where the journey begins—your words will lead the way.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Secondary bg"">
+        <h1>Pivot #2: Secondary background</h1>
+        <div>
+            Every story starts with a blank canvas, a quiet space waiting to be filled with ideas, emotions, and dreams.
+            These placeholder words symbolize the beginning—a moment of possibility where creativity has yet to take shape.
+            Imagine this text as the scaffolding of something remarkable, a foundation upon which connections and
+            inspirations will be built. Soon, these lines will transform into narratives that provoke thought,
+            spark emotion, and resonate with those who encounter them. Until then, they remind us of the beauty
+            in potential—the quiet magic of beginnings, where everything is still to come, and the possibilities
+            are boundless. This space is yours to craft, yours to shape, yours to bring to life.
+        </div>
+    </BitPivotItem>
+    <BitPivotItem HeaderText=""Tertiary fg"">
+        <h1>Pivot #3: Tertiary foreground</h1>
+        <div>
+            In the beginning, there is silence—a blank canvas yearning to be filled, a quiet space where creativity waits
+            to awaken. These words are temporary, standing in place of ideas yet to come, a glimpse into the infinite
+            possibilities that lie ahead. Think of this text as a bridge, connecting the empty spaces of now with the
+            vibrant narratives of tomorrow. It whispers of the stories waiting to be told, of the thoughts yet to be
+            shaped into meaning, and the emotions ready to resonate with every reader.
+        </div>
+    </BitPivotItem>
+</BitPivot>";
+
+    private readonly string example12RazorCode = @"
 <link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
 
 <BitPivot>
@@ -1044,7 +1233,7 @@ possibilities that lie ahead.
     </BitPivotItem>
 </BitPivot>";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -1204,7 +1393,7 @@ These placeholder words symbolize the beginning—a moment of possibility where
     </BitPivotItem>
 </BitPivot>";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitPivot Dir=""BitDir.Rtl"" OverflowBehavior=""@BitPivotOverflowBehavior.Scroll"">
     <BitPivotItem HeaderText=""اسناد"" IconName=""@BitIconName.Info"">
         لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.

From 30b1328a7fd5849d3a00229dad9dd1df9e0af971 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 6 Mar 2026 12:21:59 +0100
Subject: [PATCH 37/66] feat(templates): refactor bit boilerplate logging
 configuration (#12155) (#12156)

---
 .../src/Shared/appsettings.Development.json   | 37 +++++++++++--------
 .../src/Shared/appsettings.json               | 37 +++++++------------
 2 files changed, 35 insertions(+), 39 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.Development.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.Development.json
index 3a5d431bd7..a6df76fdc4 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.Development.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.Development.json
@@ -5,25 +5,18 @@
             "Polly": "Warning",
             "Microsoft.AspNetCore*": "Warning",
             "System.Net.Http.HttpClient": "Warning",
+            "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+            "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
             "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
             "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
         },
         //#if (appInsights == true)
-        "ApplicationInsights": {
-            "LogLevel": {
-                "Default": "Information",
-                "Polly": "Warning",
-                "Microsoft.AspNetCore*": "Warning",
-                "System.Net.Http.HttpClient.*.LogicalHandler": "Warning"
-            }
-        },
         "ApplicationInsightsLoggerProvider": {
             "LogLevel": {
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
-                "System.Net.Http.HttpClient": "Warning",
-                "System.Net.Http.HttpClient.*.LogicalHandler": "Warning"
+                "System.Net.Http.HttpClient": "Warning"
             }
         },
         //#endif
@@ -33,6 +26,9 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
@@ -43,6 +39,9 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
@@ -52,6 +51,9 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
@@ -61,8 +63,7 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
-                "System.Net.Http.HttpClient": "Warning",
-                "System.Net.Http.HttpClient.*.LogicalHandler": "Warning"
+                "System.Net.Http.HttpClient": "Warning"
             }
         },
         "EventLog": {
@@ -70,6 +71,9 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
@@ -79,14 +83,15 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
         },
         "DiagnosticLogger": {
             "LogLevel": {
-                "Polly": "Warning",
-                "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
         },
@@ -95,8 +100,10 @@
                 "Default": "Information",
                 "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
+                "System.Net.Http.HttpClient": "Warning",
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
                 "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
-                "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None",
                 "Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware": "None"
             }
         }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
index 2f1b834cdb..babe70f34c 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
@@ -8,25 +8,17 @@
         "LogLevel": {
             "Default": "Warning",
             "Microsoft.Hosting.Lifetime": "Information",
-            "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-            "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+            "Boilerplate.Client.Core.Services.AuthManager": "Information",
             "Microsoft.EntityFrameworkCore.Database.Command": "Information",
             "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
         },
         //#if (appInsights == true)
-        "ApplicationInsights": {
-            "Comment": "Enable Azure Application Insights for Client.Maui and Client.Windows",
-            "LogLevel": {
-                "Default": "Warning",
-                "Microsoft.Hosting.Lifetime": "Information",
-                "Microsoft.EntityFrameworkCore.Database.Command": "Information"
-            }
-        },
         "ApplicationInsightsLoggerProvider": {
             "Comment": "Enable Azure Application Insights for WebAssembly",
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
+                "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information"
             }
         },
@@ -42,8 +34,6 @@
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
-                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
@@ -55,8 +45,6 @@
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
-                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
                 "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
@@ -67,8 +55,7 @@
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
-                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
@@ -76,6 +63,8 @@
         "WebAssemblyConsoleLoggerProvider": {
             "LogLevel": {
                 "Default": "Warning",
+                "Microsoft.Hosting.Lifetime": "Information",
+                "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information"
             }
         },
@@ -83,8 +72,7 @@
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
-                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
@@ -93,8 +81,7 @@
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
-                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
-                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "Boilerplate.Client.Core.Services.AuthManager": "Information",
                 "Microsoft.EntityFrameworkCore.Database.Command": "Information",
                 "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
@@ -102,10 +89,12 @@
         "DiagnosticLogger": {
             "LogLevel": {
                 "Default": "Information",
+                "Polly": "Warning",
                 "Microsoft.AspNetCore*": "Warning",
-                "Microsoft.Hosting.Lifetime": "Information",
-                "Microsoft.AspNetCore.Authorization": "Information",
-                "System.Net.Http.HttpClient.*.LogicalHandler": "Warning"
+                "StackExchange.Redis.ConnectionMultiplexer": "Warning",
+                "ZiggyCreatures.Caching.Fusion.FusionCache": "Warning",
+                "System.Net.Http.HttpClient.*.LogicalHandler": "Warning",
+                "Microsoft.AspNetCore.Diagnostics.ExceptionHandlerMiddleware": "None"
             }
         },
         "Debug": {
@@ -119,4 +108,4 @@
         "SizeLimit__Comment": "Total capacity of the L1 cache. Unit is arbitrary; we treat it as 1 unit per average entry."
     },
     "$schema": "https://json.schemastore.org/appsettings.json"
-}
+}
\ No newline at end of file

From 8e79a6f0c6b0f6c86baff3ba233ea1463123ad0e Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 6 Mar 2026 12:22:25 +0100
Subject: [PATCH 38/66] feat(deps): update project dependencies #12151 (#12154)

---
 .github/workflows/admin-sample.cd.yml              | 10 +++++-----
 .github/workflows/bit.full.ci.yml                  |  6 +++---
 .github/workflows/blazorui.demo.cd.yml             |  8 ++++----
 .github/workflows/nuget.org.yml                    |  2 +-
 .github/workflows/platform.website.cd.yml          |  2 +-
 .github/workflows/prerelease.nuget.org.yml         |  2 +-
 .github/workflows/sales-module-demo.cd.yml         |  4 ++--
 .github/workflows/sales.website.cd.yml             |  2 +-
 .github/workflows/todo-sample.cd.yml               | 10 +++++-----
 .../Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj                |  2 +-
 .../.docs/16- CI-CD Pipeline and Environments.md   |  4 ++--
 .../.github/workflows/cd-template.yml              | 10 +++++-----
 .../Bit.Boilerplate/.github/workflows/ci.yml       |  2 +-
 .../Bit.Boilerplate/src/Directory.Packages.props   | 14 +++++++-------
 15 files changed, 40 insertions(+), 40 deletions(-)

diff --git a/.github/workflows/admin-sample.cd.yml b/.github/workflows/admin-sample.cd.yml
index f400d527b2..70bfa478e4 100644
--- a/.github/workflows/admin-sample.cd.yml
+++ b/.github/workflows/admin-sample.cd.yml
@@ -82,14 +82,14 @@ jobs:
       run: dotnet publish AdminPanel/src/Server/AdminPanel.Server.Api/AdminPanel.Server.Api.csproj -c Release -o server-api -p:Version="${{ vars.APP_VERSION}}"
 
     - name: Upload server web artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: AdminPanel
         path: server-web
         include-hidden-files: true # Required for wwwroot/.well-known folder
 
     - name: Upload server api artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: AdminPanelApi
         path: server-api
@@ -197,7 +197,7 @@ jobs:
           dotnet vpk pack -u AdminPanel.Client.Windows -v "${{ vars.APP_VERSION }}" -p .\publish-result -e AdminPanel.Client.Windows.exe -r win-x64 --framework webview2 --icon .\wwwroot\favicon.ico --packTitle 'AdminPanel'
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: WinAdminPanel
         path: AdminPanel\src\Client\AdminPanel.Client.Windows\Releases
@@ -272,7 +272,7 @@ jobs:
       run: dotnet publish AdminPanel/src/Client/AdminPanel.Client.Maui/AdminPanel.Client.Maui.csproj -c Release -p:EnableLLVM=true -p:AndroidEnableProfiledAot=false -p:AndroidPackageFormat=aab -p:AndroidKeyStore=true -p:AndroidSigningKeyStore="AdminPanel.keystore" -p:AndroidSigningKeyAlias=bitplatform -p:AndroidSigningKeyPass="${{ secrets.ANDROID_RELEASE_KEYSTORE_PASSWORD }}" -p:AndroidSigningStorePass="${{ secrets.ANDROID_RELEASE_SIGNING_PASSWORD }}" -p:Version="${{ vars.APP_VERSION }}" -p:ApplicationTitle="AdminPanel" -p:ApplicationId="com.bitplatform.AdminPanel.Template" -f net10.0-android
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: android-bundle
         path: AdminPanel/src/Client/AdminPanel.Client.Maui/bin/Release/net10.0-android/*-Signed.*
@@ -348,7 +348,7 @@ jobs:
       run: dotnet publish AdminPanel/src/Client/AdminPanel.Client.Maui/AdminPanel.Client.Maui.csproj -p:RuntimeIdentifier=ios-arm64 -c Release -p:ArchiveOnBuild=true -p:CodesignKey="iPhone Distribution" -p:CodesignProvision="AdminPanel" -p:Version="${{ vars.APP_VERSION }}" -p:ApplicationTitle="AdminPanel" -p:ApplicationId="com.bitplatform.AdminPanel.Template" -f net10.0-ios
 
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: ios-bundle
         path: AdminPanel/src/Client/AdminPanel.Client.Maui/bin/release/net10.0-ios/ios-arm64/publish/*.ipa
diff --git a/.github/workflows/bit.full.ci.yml b/.github/workflows/bit.full.ci.yml
index 83d49a7845..55381e0f9b 100644
--- a/.github/workflows/bit.full.ci.yml
+++ b/.github/workflows/bit.full.ci.yml
@@ -98,7 +98,7 @@ jobs:
         WebAppRender__BlazorMode=BlazorWebAssembly WebAppRender__PrerenderEnabled=true ResponseCaching__EnableOutputCaching=true dotnet test -p:InvariantGlobalization=true --filter "TestCategory=UITest"
 
     - name: Upload Test Results on Failure
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       if: failure() && steps.run-test-postgresql.conclusion == 'failure'
       with:
         name: postgres-tests-artifact
@@ -170,7 +170,7 @@ jobs:
         WebAppRender__BlazorMode=BlazorWebAssembly WebAppRender__PrerenderEnabled=true ResponseCaching__EnableOutputCaching=true BROWSER=firefox dotnet test --filter "TestCategory=UITest" --no-build
 
     - name: Upload Test Results on Failure
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       if: failure() && steps.run-test-mssql.conclusion == 'failure'
       with:
         name: sqlserver-tests-artifact
@@ -412,7 +412,7 @@ jobs:
       run: dotnet pack src/Templates/BlazorEmpty/Bit.BlazorEmpty.ProjectTemplate.csproj --output ./packages --configuration Release
 
     - name: Upload NuGet packages artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: nuget-packages
         path: ./packages/*.nupkg
diff --git a/.github/workflows/blazorui.demo.cd.yml b/.github/workflows/blazorui.demo.cd.yml
index bdef14165a..29e0a0414c 100644
--- a/.github/workflows/blazorui.demo.cd.yml
+++ b/.github/workflows/blazorui.demo.cd.yml
@@ -50,7 +50,7 @@ jobs:
       run: dotnet publish src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj -c Release -p:Version="${{ vars.APP_VERSION}}" -o server
 
     - name: Upload server artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: BlazorUIDemo
         path: server
@@ -93,7 +93,7 @@ jobs:
           dotnet vpk pack -u Bit.BlazorUI.Demo.Client.Windows -v "${{ vars.APP_VERSION }}" -p .\publish-result -e Bit.BlazorUI.Demo.Client.Windows.exe -r win-x86 --framework webview2 --icon .\wwwroot\favicon.ico --packTitle 'Bit Blazor UI'
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: WinBlazorUIDemo
         path: src\BlazorUI\Demo\Client\Bit.BlazorUI.Demo.Client.Windows\Releases
@@ -143,7 +143,7 @@ jobs:
       run: dotnet publish src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj -c Release -p:AndroidPackageFormat=aab -p:AndroidKeyStore=true -p:AndroidSigningKeyStore="BitBlazorUIDemo.keystore" -p:AndroidSigningKeyAlias=bitplatform -p:AndroidSigningKeyPass="${{ secrets.ANDROID_RELEASE_KEYSTORE_PASSWORD }}" -p:AndroidSigningStorePass="${{ secrets.ANDROID_RELEASE_SIGNING_PASSWORD }}" -p:Version="${{ vars.APP_VERSION }}" -p:CompressionEnabled=false -f net10.0-android
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: android-bundle
         path: src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/bin/Release/net10.0-android/*-Signed.*
@@ -201,7 +201,7 @@ jobs:
       run: dotnet publish src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj -p:RuntimeIdentifier=ios-arm64 -c Release -p:ArchiveOnBuild=true -p:CodesignKey="iPhone Distribution" -p:CodesignProvision="Bit Blazor UI Demo" -p:Version="${{ vars.APP_VERSION }}" -p:CompressionEnabled=false -f net10.0-ios
 
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: ios-bundle
         path: src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/bin/release/net10.0-ios/ios-arm64/publish/*.ipa
\ No newline at end of file
diff --git a/.github/workflows/nuget.org.yml b/.github/workflows/nuget.org.yml
index 6f3f85e5bb..63cffa858f 100644
--- a/.github/workflows/nuget.org.yml
+++ b/.github/workflows/nuget.org.yml
@@ -149,7 +149,7 @@ jobs:
       run: dotnet pack src/Templates/BlazorEmpty/Bit.BlazorEmpty.ProjectTemplate.csproj --output . --configuration Release
     
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: nupkg-files
         path: ./*.nupkg
diff --git a/.github/workflows/platform.website.cd.yml b/.github/workflows/platform.website.cd.yml
index e4505dd254..ed2a00e569 100644
--- a/.github/workflows/platform.website.cd.yml
+++ b/.github/workflows/platform.website.cd.yml
@@ -35,7 +35,7 @@ jobs:
       run: dotnet publish src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj -c Release -o server -p:Version="${{ vars.APP_VERSION}}"
 
     - name: Upload server artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: PlatformWebsite
         path: server
diff --git a/.github/workflows/prerelease.nuget.org.yml b/.github/workflows/prerelease.nuget.org.yml
index 73ba87b96b..6311f0a8d9 100644
--- a/.github/workflows/prerelease.nuget.org.yml
+++ b/.github/workflows/prerelease.nuget.org.yml
@@ -140,7 +140,7 @@ jobs:
       run: dotnet pack src/Templates/BlazorEmpty/Bit.BlazorEmpty.ProjectTemplate.csproj --output . --configuration Release
 
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: nupkg-files
         path: ./*.nupkg
diff --git a/.github/workflows/sales-module-demo.cd.yml b/.github/workflows/sales-module-demo.cd.yml
index 72bb4e3251..67b42ea97c 100644
--- a/.github/workflows/sales-module-demo.cd.yml
+++ b/.github/workflows/sales-module-demo.cd.yml
@@ -76,7 +76,7 @@ jobs:
       run: dotnet publish SalesModule/src/Server/SalesModule.Server.Web/SalesModule.Server.Web.csproj -c Release -o server -p:Version="${{ vars.APP_VERSION}}"  -p:InvariantGlobalization=true
 
     - name: Upload server artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: SalesModule
         path: server
@@ -135,7 +135,7 @@ jobs:
           dotnet vpk pack -u SalesModule.Client.Windows -v "${{ vars.APP_VERSION }}" -p .\publish-result -e SalesModule.Client.Windows.exe -r win-x64 --framework webview2 --icon .\wwwroot\favicon.ico --packTitle 'SalesModule'
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: WinSalesModule
         path: SalesModule\src\Client\SalesModule.Client.Windows\Releases
\ No newline at end of file
diff --git a/.github/workflows/sales.website.cd.yml b/.github/workflows/sales.website.cd.yml
index 9fe18dc909..a139481c28 100644
--- a/.github/workflows/sales.website.cd.yml
+++ b/.github/workflows/sales.website.cd.yml
@@ -35,7 +35,7 @@ jobs:
       run: dotnet publish src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj -c Release -o server -p:Version="${{ vars.APP_VERSION}}"
 
     - name: Upload server artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: BitServices
         path: server
diff --git a/.github/workflows/todo-sample.cd.yml b/.github/workflows/todo-sample.cd.yml
index b4a57ec2e5..aa317b4a81 100644
--- a/.github/workflows/todo-sample.cd.yml
+++ b/.github/workflows/todo-sample.cd.yml
@@ -65,7 +65,7 @@ jobs:
       run: dotnet publish TodoSample/src/Server/TodoSample.Server.Api/TodoSample.Server.Api.csproj -c Release -o server-api -p:Version="${{ vars.APP_VERSION}}"
 
     - name: Upload server api artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: TodoApi
         path: server-api
@@ -130,7 +130,7 @@ jobs:
       run: dotnet publish TodoSample/src/Server/TodoSample.Server.Web/TodoSample.Server.Web.csproj -c Release -o server-web -p:Version="${{ vars.APP_VERSION}}"
 
     - name: Upload server web artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: Todo
         path: server-web
@@ -338,7 +338,7 @@ jobs:
           dotnet vpk pack -u TodoSample.Client.Windows -v "${{ vars.APP_VERSION }}" -p .\publish-result -e TodoSample.Client.Windows.exe -r win-x86 --framework webview2 --icon .\wwwroot\favicon.ico --packTitle TodoSample
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: WinTodo
         path: TodoSample\src\Client\TodoSample.Client.Windows\Releases
@@ -433,7 +433,7 @@ jobs:
       run: dotnet publish TodoSample/src/Client/TodoSample.Client.Maui/TodoSample.Client.Maui.csproj -c Release -p:AndroidPackageFormat=aab -p:AndroidKeyStore=true -p:AndroidSigningKeyStore="TodoSample.keystore" -p:AndroidSigningKeyAlias=bitplatform -p:AndroidSigningKeyPass="${{ secrets.ANDROID_RELEASE_KEYSTORE_PASSWORD }}" -p:AndroidSigningStorePass="${{ secrets.ANDROID_RELEASE_SIGNING_PASSWORD }}" -p:Version="${{ vars.APP_VERSION }}" -p:ApplicationTitle="TodoSample" -p:ApplicationId="com.bitplatform.Todo.Template" -f net10.0-android
   
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: android-bundle
         path: TodoSample/src/Client/TodoSample.Client.Maui/bin/Release/net10.0-android/*-Signed.*
@@ -529,7 +529,7 @@ jobs:
       run: dotnet publish TodoSample/src/Client/TodoSample.Client.Maui/TodoSample.Client.Maui.csproj -p:RuntimeIdentifier=ios-arm64 -c Release -p:ArchiveOnBuild=true -p:CodesignKey="iPhone Distribution" -p:CodesignProvision="TodoTemplate" -p:Version="${{ vars.APP_VERSION }}" -p:ApplicationTitle="Todo" -p:ApplicationId="com.bitplatform.Todo.Template" -f net10.0-ios
 
     - name: Upload artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       with:
         name: ios-bundle
         path: TodoSample/src/Client/TodoSample.Client.Maui/bin/release/net10.0-ios/ios-arm64/publish/*.ipa
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
index 8058b3aeab..ab13ed63d7 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
@@ -25,7 +25,7 @@
     <ItemGroup>
         <FrameworkReference Include="Microsoft.AspNetCore.App" PrivateAssets="all" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" PrivateAssets="all" />
-        <PackageReference Include="Jint" Version="4.6.0" PrivateAssets="all" />
+        <PackageReference Include="Jint" Version="4.6.1" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 5b38c0e2a3..8174bddfd7 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -19,7 +19,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Jint" Version="4.6.0" />
+        <PackageReference Include="Jint" Version="4.6.1" />
         <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
         <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageReference Include="MimeTypeMapOfficial" Version="1.0.17" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/16- CI-CD Pipeline and Environments.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/16- CI-CD Pipeline and Environments.md
index 2895af502b..8ad91536dd 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/16- CI-CD Pipeline and Environments.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/16- CI-CD Pipeline and Environments.md	
@@ -533,14 +533,14 @@ build_api_blazor:
     - uses: actions/setup-dotnet@v5
     - uses: actions/setup-node@v6
     - run: dotnet publish ...
-    - uses: actions/upload-artifact@v5  # Save artifact
+    - uses: actions/upload-artifact@v7  # Save artifact
 
 # Phase 2: Deploy (has production access)
 deploy_api_blazor:
   needs: build_api_blazor  # Depends on Phase 1
   runs-on: ubuntu-24.04
   steps:
-    - uses: actions/download-artifact@v6  # Get pre-built artifact
+    - uses: actions/download-artifact@v8  # Get pre-built artifact
     - uses: azure/webapps-deploy@v3      # Deploy to production
 ```
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
index de0a143b19..c756056781 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
@@ -60,7 +60,7 @@ jobs:
       - name: Publish
         run: dotnet publish src/Server/Boilerplate.Server.Web/Boilerplate.Server.Web.csproj -c Release --self-contained -r linux-x64 -o server -p:Version="${{ vars.APP_VERSION }}" -p:Environment=${{ inputs.ENV_NAME }}
       - name: Upload server artifact
-        uses: actions/upload-artifact@v5
+        uses: actions/upload-artifact@v7
         with:
           name: server-bundle
           path: server
@@ -77,7 +77,7 @@ jobs:
     steps:
 
       - name: Retrieve server bundle
-        uses: actions/download-artifact@v6
+        uses: actions/download-artifact@v8
         with:
           name: server-bundle
 
@@ -140,7 +140,7 @@ jobs:
           dotnet vpk pack -u ${{ vars.APP_ID }} -v "${{ vars.APP_VERSION }}" -p .\publish-result -e Boilerplate.Client.Windows.exe -r win-x86 --framework webview2 --icon .\wwwroot\favicon.ico --packTitle '${{ vars.APP_TITLE }}'
 
       - name: Upload artifact
-        uses: actions/upload-artifact@v5
+        uses: actions/upload-artifact@v7
         with:
           name: win-exe-bundle
           path: src\Client\Boilerplate.Client.Windows\Releases
@@ -197,7 +197,7 @@ jobs:
         run: dotnet publish src/Client/Boilerplate.Client.Maui/Boilerplate.Client.Maui.csproj -c Release -p:ApplicationId=${{ vars.APP_ID }} -p:AndroidPackageFormat=aab -p:AndroidKeyStore=true -p:AndroidSigningKeyStore="Boilerplate.keystore" -p:AndroidSigningKeyAlias=Boilerplate -p:AndroidSigningKeyPass="${{ secrets.ANDROID_RELEASE_KEYSTORE_PASSWORD }}" -p:AndroidSigningStorePass="${{ secrets.ANDROID_RELEASE_SIGNING_PASSWORD }}" -p:Version="${{ vars.APP_VERSION }}" -p:Environment=${{ inputs.ENV_NAME }} -f net10.0-android
 
       - name: Upload artifact
-        uses: actions/upload-artifact@v5
+        uses: actions/upload-artifact@v7
         with:
           name: android-bundle
           path: src/Client/Boilerplate.Client.Maui/bin/Release/net10.0-android/*-Signed.*
@@ -263,7 +263,7 @@ jobs:
         run: dotnet publish src/Client/Boilerplate.Client.Maui/Boilerplate.Client.Maui.csproj -p:ApplicationId=${{ vars.APP_ID }} -p:RuntimeIdentifier=ios-arm64 -c Release -p:ArchiveOnBuild=true -p:CodesignKey="iPhone Distribution" -p:CodesignProvision="${{ vars.IOS_CODE_SIGN_PROVISION }}" -p:Version="${{ vars.APP_VERSION }}" -p:Environment=${{ inputs.ENV_NAME }} -f net10.0-ios
 
       - name: Upload artifact
-        uses: actions/upload-artifact@v5
+        uses: actions/upload-artifact@v7
         with:
           name: iOS-bundle
           path: src/Client/Boilerplate.Client.Maui/bin/release/net10.0-ios/ios-arm64/publish/*.ipa
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/ci.yml b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/ci.yml
index 912e7e998e..25b0f31acb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/ci.yml
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/ci.yml
@@ -46,7 +46,7 @@ jobs:
       run: cd src/Tests && dotnet test
 
     - name: Upload Tests Artifact
-      uses: actions/upload-artifact@v5
+      uses: actions/upload-artifact@v7
       if: ${{ failure() && steps.test.conclusion == 'failure' }}
       with:
         name: tests-artifact
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 4f0553376d..6f17280dcf 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -15,7 +15,7 @@
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
         <PackageVersion Include="HtmlSanitizer" Version="9.0.892" />
-        <PackageVersion Include="libphonenumber-csharp" Version="9.0.24" />
+        <PackageVersion Include="libphonenumber-csharp" Version="9.0.25" />
         <PackageVersion Include="Meziantou.Framework.Win32.Jobs" Version="3.5.4" />
         <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.3" />
         <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
@@ -50,7 +50,7 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.12.47" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.1" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.3" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
@@ -97,9 +97,9 @@
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.3.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.72.0-preview" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.72.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc2" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.73.0-preview" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.73.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc3" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
@@ -119,7 +119,7 @@
         <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.3" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.3" />
         <!--/-:msbuild-conditional:noEmit -->
-        <PackageVersion Include="Humanizer" Version="3.0.1" />
+        <PackageVersion Include="Humanizer" Version="3.0.8" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
         <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.3" />
         <PackageVersion Include="FluentEmail.Smtp" Version="3.0.2" />
@@ -131,7 +131,7 @@
         <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.3" />
         <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.3" />
         <PackageVersion Include="Swashbuckle.AspNetCore" Version="10.0.0" />
-        <PackageVersion Include="Microsoft.Identity.Web" Version="4.3.0" />
+        <PackageVersion Include="Microsoft.Identity.Web" Version="4.5.0" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.3" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.3" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.3" />

From 66ff657bc7a6b5bb6a833daba97eec92ab331f08 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 6 Mar 2026 12:22:49 +0100
Subject: [PATCH 39/66] feat(templates): Refactor bit Boilerplate middlewares
 #12152 (#12153)

---
 .../Program.Middlewares.cs                    |  3 ++-
 .../Program.Services.cs                       |  1 +
 .../Extensions/WebApplicationExtensions.cs    | 25 +++++++++++++++++++
 .../Program.Middlewares.cs                    | 19 ++++++--------
 4 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
index 268ec7b806..a3f1481153 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
@@ -41,7 +41,8 @@ private static void ConfigureMiddlewares(this WebApplication app)
 
         app.UseStaticFiles();
 
-        app.UseCors();
+        app.UseEnahcedCors();
+        app.UseRateLimiter();
 
         app.UseMiddleware<ForceUpdateMiddleware>();
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index 20c37986a3..946fc4a0b2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -217,6 +217,7 @@ CorsPolicyBuilder ApplyPolicyDefaults(CorsPolicyBuilder policy)
                     .AllowCredentials();
             });
         });
+        services.AddRateLimiter();
 
         services.AddSingleton(sp =>
         {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
index 688feb37c5..0c0cb825ab 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
@@ -139,4 +139,29 @@ public static WebApplication UseSecurityHeaders(this WebApplication app)
 
         return app;
     }
+
+    /// <summary>
+    /// In addition to the `policy.SetPreflightMaxAge(TimeSpan.FromDays(1))` call in AddCors,
+    /// that caches preflight responses in browser cache, this additional middleware is neccessary to cache headers for preflight responses in CDN Edge.
+    /// </summary>
+    public static WebApplication UseEnahcedCors(this WebApplication app)
+    {
+        app.Use(async (context, next) =>
+        {
+            if (context.Request.Method == HttpMethods.Options && context.Request.Headers.ContainsKey("Access-Control-Request-Method"))
+            {
+                context.Response.GetTypedHeaders().CacheControl = new()
+                {
+                    Public = true,
+                    SharedMaxAge = TimeSpan.FromDays(1)
+                };
+                context.Response.Headers.Append("Vary", "Origin, Access-Control-Request-Method, Access-Control-Request-Headers");
+            }
+            await next();
+        });
+
+        app.UseCors();
+
+        return app;
+    }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
index 47e979693f..f8f2d87749 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
@@ -54,18 +54,16 @@ public static void ConfigureMiddlewares(this WebApplication app)
             app.UseDirectoryBrowser();
         }
 
-
-        app.Use(async (context, next) =>
+        app.UseStaticFiles(options: new()
         {
-            context.Response.OnStarting(async () =>
+            OnPrepareResponse = staticFileResponseContext =>
             {
                 if (env.IsDevelopment() is false)
                 {
                     // Caching static files on the Browser and CDN's edge servers.
-                    if (context.Request.Query.Any(q => string.Equals(q.Key, "v", StringComparison.InvariantCultureIgnoreCase)) &&
-                        env.WebRootFileProvider.GetFileInfo(context.Request.Path).Exists)
+                    if (staticFileResponseContext.Context.Request.Query.Any(q => string.Equals(q.Key, "v", StringComparison.InvariantCultureIgnoreCase)))
                     {
-                        context.Response.GetTypedHeaders().CacheControl = new()
+                        staticFileResponseContext.Context.Response.GetTypedHeaders().CacheControl = new()
                         {
                             Public = true,
                             NoTransform = true,
@@ -73,13 +71,9 @@ public static void ConfigureMiddlewares(this WebApplication app)
                         };
                     }
                 }
-            });
-
-            await next.Invoke();
+            }
         });
 
-        app.UseStaticFiles();
-
         if (string.IsNullOrEmpty(env.WebRootPath) is false && Path.Exists(Path.Combine(env.WebRootPath, @".well-known")))
         {
             // https://yurl.chayev.com/
@@ -93,7 +87,8 @@ public static void ConfigureMiddlewares(this WebApplication app)
         }
 
         //#if (api == "Integrated")
-        app.UseCors();
+        app.UseEnahcedCors();
+        app.UseRateLimiter();
         app.UseMiddleware<ForceUpdateMiddleware>();
         //#endif
 

From 4501ad7e0a0bd1aa8f9d2d5546eac5d8f6c7e201 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 6 Mar 2026 12:23:45 +0100
Subject: [PATCH 40/66] feat(templates): use csp in all blazor interactive
 modes in bit Boilerplate #12147 (#12148)

---
 .../ClientCoreSettings.cs                     |  7 ++
 .../Components/Layout/AppShell.razor          |  2 +-
 .../Components/Layout/SecurityHeaders.razor   | 19 ++++
 .../Layout/SecurityHeaders.razor.cs           | 96 +++++++++++++++++++
 .../ClientMauiSettings.cs                     |  8 +-
 .../ClientWindowsSettings.cs                  |  8 +-
 .../Extensions/WebApplicationExtensions.cs    | 10 +-
 7 files changed, 135 insertions(+), 15 deletions(-)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/ClientCoreSettings.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/ClientCoreSettings.cs
index 8b014f1658..234e47867a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/ClientCoreSettings.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/ClientCoreSettings.cs
@@ -23,6 +23,13 @@ public partial class ClientCoreSettings : SharedSettings
     public string AdUnitPath { get; set; } = default!;
     //#endif
 
+    /// <summary>
+    /// When the Blazor Hybrid app sends a request to the API server, and the API server and web app are hosted on different URLs,
+    /// the origin of the generated links (e.g., email confirmation links) will depend on `WebAppUrl` value.
+    /// The config is relevant for Blazor Hybrid apps only.
+    /// </summary>
+    public Uri? WebAppUrl { get; set; }
+
     public override IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
     {
         var validationResults = base.Validate(validationContext).ToList();
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppShell.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppShell.razor
index 0ef4b3fdb9..f1aa3b4845 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppShell.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppShell.razor
@@ -74,4 +74,4 @@
             <NavBar />
         }
     </main>
-</BitAppShell>
\ No newline at end of file
+</BitAppShell>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor
new file mode 100644
index 0000000000..4e49ae96da
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor
@@ -0,0 +1,19 @@
+@* Unlike UseSecurityHeaders in WebApplicationExtensions.cs, which only applies during Blazor Server
+   and Blazor WebAssembly Pre-Rendering, this component works across all Interactive Blazor
+   rendering modes (Server, WebAssembly, WebAssembly Standalone, Auto and Hybrid).
+   Because it enforces a stricter Content-Security-Policy, it is not enabled by default.
+   To activate it, add <SecurityHeaders /> inside AppShell.razor *@
+
+@*
+    Note: Even this CSP is not fully strict:
+    1- It allows `inline` scripts and styles, which is not recommended. To avoid this, you can use a nonce or hash-based approach.
+    2- While this gets applied immediatly in Blazor WebAssembly, Auto and Server if pre-rendering is enabled, but in Blazor WebAssembly Standalone and Blazor Hybrid
+        it gets applied late in the rendering process, which means that some content might be rendered before the CSP is applied.
+    You can mitigate this by moving the desired configuration in index.html files in Client.Maui & Client.Web projects.
+    In case you're hosting your Blazor WebAssembly, Auto and Server without pre-rendering, you can put this component in App.razor
+*@
+
+<HeadContent>
+    <meta name="referrer" content="strict-origin-when-cross-origin">
+    <meta http-equiv="Content-Security-Policy" content="@CspContent">
+</HeadContent>
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs
new file mode 100644
index 0000000000..1b222d0c23
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs
@@ -0,0 +1,96 @@
+//+:cnd:noEmit
+namespace Boilerplate.Client.Core.Components.Layout;
+
+public partial class SecurityHeaders
+{
+    [AutoInject] private ClientCoreSettings settings = default!;
+    [AutoInject] private AbsoluteServerAddressProvider absoluteServerAddressProvider = default!;
+
+    protected string? CspContent { get; set; }
+
+    protected override void OnInitialized()
+    {
+        BuildCspString();
+    }
+
+    private void BuildCspString()
+    {
+        var apiUrl = absoluteServerAddressProvider.GetAddress().ToString();
+        var webAppUrl = settings.WebAppUrl?.ToString();
+
+        // 1. Common Trusted Origins (Our own servers)
+        var ownOrigins = new HashSet<string> { "'self'", apiUrl, apiUrl.Replace("http:", "ws:").Replace("https:", "wss:") };
+        if (string.IsNullOrWhiteSpace(webAppUrl) is false)
+            ownOrigins.Add(webAppUrl);
+        var ownOriginsString = string.Join(" ", ownOrigins);
+
+        // 2. Service Specific Origins
+        var connectSrc = new HashSet<string>(ownOrigins);
+        var imgSrc = new HashSet<string> { ownOriginsString, "data:" };
+        var scriptSrc = new HashSet<string> { "'self'", "'unsafe-inline'", "'wasm-unsafe-eval'", "'unsafe-hashes'" };
+        var styleSrc = new HashSet<string> { "'self'", "'unsafe-inline'" };
+        var fontSrc = new HashSet<string> { "'self'" };
+        var frameSrc = new HashSet<string> { "'self'" };
+        var mediaSrc = new HashSet<string> { "'self'" };
+
+        //#if (appInsights == true)
+        // --- Add Azure App Insights ---
+        connectSrc.Add("https://dc.services.visualstudio.com https://*.in.applicationinsights.azure.com");
+        scriptSrc.Add("https://js.monitor.azure.com");
+        //#endif
+
+        //#if (sentry == true)
+        // --- Add Sentry ---
+        connectSrc.Add("https://*.sentry.io");
+        //#endif
+
+        //#if (captcha == "reCaptcha")
+        // --- Add Google reCAPTCHA ---
+        connectSrc.Add("https://www.google.com/");
+        scriptSrc.Add("https://www.google.com/recaptcha/ https://www.gstatic.com/");
+        frameSrc.Add("https://www.google.com/recaptcha/");
+        //#endif
+
+        //#if (ads == true)
+        // --- Add Google Ads ---
+        scriptSrc.Add("https://www.googleadservices.com https://googleads.g.doubleclick.net https://securepubads.g.doubleclick.net https://*.adtrafficquality.google https://*.googlesyndication.com");
+        connectSrc.Add("https://securepubads.g.doubleclick.net https://*.adtrafficquality.google https://*.googlesyndication.com https://csi.gstatic.com");
+        imgSrc.Add("https://www.google.com https://googleads.g.doubleclick.net https://*.googlesyndication.com https://www.gstatic.com https://imasdk.googleapis.com https://*.adtrafficquality.google");
+        frameSrc.Add("https://googleads.g.doubleclick.net https://*.googlesyndication.com https://*.adtrafficquality.google");
+        mediaSrc.Add("https://*.gvt1.com");
+        //#endif
+
+        // --- Add Google Fonts ---
+        fontSrc.Add("https://fonts.gstatic.com");
+        styleSrc.Add("https://fonts.googleapis.com");
+
+        // --- Add for home page's github stats ---
+        imgSrc.Add("https://img.shields.io");
+        connectSrc.Add("https://api.github.com");
+
+        if (AppEnvironment.IsDevelopment())
+        {
+            connectSrc.Add("ws://localhost:* wss://localhost:*"); // Allow localhost WebSocket connections during development (hot reload / debugging)
+            connectSrc.Add("https://raw.githubusercontent.com/"); // Source maps
+        }
+
+        // Construct the final CSP string
+        CspContent = $"default-src {string.Join(" ", ownOrigins)}; " + // Fallback for all directives.
+                     $"script-src {string.Join(" ", scriptSrc)}; " +   // Defines valid sources for executable JavaScript.
+                     $"style-src {string.Join(" ", styleSrc)}; " +     // Specifies trusted sources for CSS stylesheets.
+                     $"font-src {string.Join(" ", fontSrc)}; " +       // Controls where web fonts (e.g., Google Fonts) can be loaded from.
+                     $"img-src {string.Join(" ", imgSrc)}; " +         // Defines allowed origins for images.
+                     $"connect-src {string.Join(" ", connectSrc)}; " + // Limits targets for API calls (fetch, XHR, WebSockets).
+                     $"frame-src {string.Join(" ", frameSrc)}; " +     // Restricts sources for iframes and nested browsing contexts.
+                     $"media-src {string.Join(" ", mediaSrc)}; " +     // Controls where video/audio media can be loaded from.
+                     $"worker-src 'self'; " +                          // Restricts the sources from which Web Workers can be loaded to the same origin.
+                     $"base-uri {string.Join(" ", ownOrigins)}; " +    // Restricts the URLs that can be used in a document's <base> element.
+                     $"form-action {string.Join(" ", ownOrigins)}; " + // Ensures form data is only submitted to your own server.
+                     $"object-src 'none';";                            // Disallows legacy plugins like Flash.
+
+        if (AppEnvironment.IsDevelopment() is false)
+        {
+            CspContent += "upgrade-insecure-requests; ";               // Tells browsers to treat all of this site's insecure URLs (those over HTTP) as though they have been replaced with secure URLs.
+        }
+    }
+}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/ClientMauiSettings.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/ClientMauiSettings.cs
index 70a6a698d7..2baad82fd2 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/ClientMauiSettings.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/ClientMauiSettings.cs
@@ -1,13 +1,9 @@
-//+:cnd:noEmit
+//+:cnd:noEmit
 using Boilerplate.Client.Core;
 
 namespace Boilerplate.Client.Maui;
 
 public class ClientMauiSettings : ClientCoreSettings
 {
-    /// <summary>
-    /// When the maui app sends a request to the API server, and the API server and web app are hosted on different URLs,
-    /// the origin of the generated links (e.g., email confirmation links) will depend on `WebAppUrl` value.
-    /// </summary>
-    public Uri? WebAppUrl { get; set; }
+
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/ClientWindowsSettings.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/ClientWindowsSettings.cs
index 6ab1596ea2..2ccd1cc977 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/ClientWindowsSettings.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/ClientWindowsSettings.cs
@@ -1,16 +1,10 @@
-//+:cnd:noEmit
+//+:cnd:noEmit
 using Boilerplate.Client.Core;
 
 namespace Boilerplate.Client.Windows;
 
 public class ClientWindowsSettings : ClientCoreSettings
 {
-    /// <summary>
-    /// When the Windows app sends a request to the API server, and the API server and web app are hosted on different URLs,
-    /// the origin of the generated links (e.g., email confirmation links) will depend on `WebAppUrl` value.
-    /// </summary>
-    public Uri? WebAppUrl { get; set; }
-
     public WindowsUpdateOptions? WindowsUpdate { get; set; }
 
     public override IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
index 0c0cb825ab..70fa9d0ea5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
@@ -132,7 +132,15 @@ public static WebApplication UseSecurityHeaders(this WebApplication app)
             // 'object-src none': Blocks legacy plugins like Flash.
             // 'frame-ancestors self': Modern replacement for X-Frame-Options.
             // 'form-action self': Restricts forms to only submit to your own domain (prevents form hijacking).
-            context.Response.Headers.Append("Content-Security-Policy", "object-src 'none'; frame-ancestors 'self'; form-action 'self';");
+            var csp = "object-src 'none'; frame-ancestors 'self'; form-action 'self'; worker-src 'self';";
+            if (app.Environment.IsDevelopment() is false)
+            {
+                // In production, add 'upgrade-insecure-requests' to automatically upgrade any HTTP requests to HTTPS.
+                csp += " upgrade-insecure-requests;";
+            }
+            context.Response.Headers.Append("Content-Security-Policy", csp);
+            // For a stricter, app-wide CSP that also works in all Interactive Blazor rendering modes,
+            // use the SecurityHeaders.razor component in Client.Core by adding <SecurityHeaders /> to AppShell.razor
 
             await next();
         });

From 787254e834cd0a8cc162cfdc214c13d98ec8959a Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Sat, 7 Mar 2026 00:19:33 +0100
Subject: [PATCH 41/66] feat(templates): improve bit Boilerplate CSP
 configuration #12157 (#12158)

---
 .../Components/Layout/AppHeadContents.razor   | 14 ++++++++++
 .../Layout/ContentSecurityPolicy.razor        | 12 +++++++++
 ...azor.cs => ContentSecurityPolicy.razor.cs} | 16 ++++++++---
 .../Components/Layout/MainLayout.razor        |  2 ++
 .../Components/Layout/SecurityHeaders.razor   | 19 -------------
 .../Boilerplate.Client.Maui/MainPage.xaml.cs  | 13 +++++----
 .../Boilerplate.Client.Windows/Program.cs     | 15 ++++++-----
 .../Program.Middlewares.cs                    |  2 +-
 .../WebApplicationBuilderExtensions.cs        |  9 ++++++-
 .../Extensions/WebApplicationExtensions.cs    | 27 +------------------
 .../Components/App.razor                      |  7 +----
 .../Program.Middlewares.cs                    |  2 +-
 12 files changed, 67 insertions(+), 71 deletions(-)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppHeadContents.razor
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
 rename src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/{SecurityHeaders.razor.cs => ContentSecurityPolicy.razor.cs} (89%)
 delete mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppHeadContents.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppHeadContents.razor
new file mode 100644
index 0000000000..6cb8ed41d6
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppHeadContents.razor
@@ -0,0 +1,14 @@
+@*+:cnd:noEmit*@
+
+@* Global place to put head tag contents: *@
+
+<HeadContent>
+    <ContentSecurityPolicy />
+    @*#if (appInsights == true)*@
+    @if (AppPlatform.IsBlazorHybridOrBrowser)
+    {
+        @* IsWasmStandalone prevents re-downloading scripts. *@
+        <BlazorApplicationInsights.ApplicationInsightsInit IsWasmStandalone="true" />
+    }
+    @*#endif*@
+</HeadContent>
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
new file mode 100644
index 0000000000..41d6640c10
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
@@ -0,0 +1,12 @@
+@* Unlike UseSecurityHeaders in WebApplicationExtensions.cs, which only applies during Blazor Server
+   Auto and WebAssembly Pre-Rendering, this component works across all Interactive Blazor
+   rendering modes (Server, WebAssembly, WebAssembly Standalone, Auto and Hybrid).
+   
+   Note: This component renders a little bit late in Blazor Hybrid and WebAssembly Standalone, so it might be a good idea to move it to Client.Web/wwwroot/index.html and Client.Maui/wwwroot/index.html
+   For Blazor Server, Auto and WebAssembly, with or without pre-rendering, it renders early enough in App.razor
+   *@
+
+@if (AppEnvironment.IsDevelopment() is false)
+{
+    <meta http-equiv="Content-Security-Policy" content="@CspContent">
+}
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
similarity index 89%
rename from src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs
rename to src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
index 1b222d0c23..58d25e78c5 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
@@ -1,7 +1,7 @@
 //+:cnd:noEmit
 namespace Boilerplate.Client.Core.Components.Layout;
 
-public partial class SecurityHeaders
+public partial class ContentSecurityPolicy
 {
     [AutoInject] private ClientCoreSettings settings = default!;
     [AutoInject] private AbsoluteServerAddressProvider absoluteServerAddressProvider = default!;
@@ -19,7 +19,7 @@ private void BuildCspString()
         var webAppUrl = settings.WebAppUrl?.ToString();
 
         // 1. Common Trusted Origins (Our own servers)
-        var ownOrigins = new HashSet<string> { "'self'", apiUrl, apiUrl.Replace("http:", "ws:").Replace("https:", "wss:") };
+        var ownOrigins = new HashSet<string> { "'self'", apiUrl };
         if (string.IsNullOrWhiteSpace(webAppUrl) is false)
             ownOrigins.Add(webAppUrl);
         var ownOriginsString = string.Join(" ", ownOrigins);
@@ -29,13 +29,13 @@ private void BuildCspString()
         var imgSrc = new HashSet<string> { ownOriginsString, "data:" };
         var scriptSrc = new HashSet<string> { "'self'", "'unsafe-inline'", "'wasm-unsafe-eval'", "'unsafe-hashes'" };
         var styleSrc = new HashSet<string> { "'self'", "'unsafe-inline'" };
-        var fontSrc = new HashSet<string> { "'self'" };
+        var fontSrc = new HashSet<string> { "'self'", "data:" };
         var frameSrc = new HashSet<string> { "'self'" };
         var mediaSrc = new HashSet<string> { "'self'" };
 
         //#if (appInsights == true)
         // --- Add Azure App Insights ---
-        connectSrc.Add("https://dc.services.visualstudio.com https://*.in.applicationinsights.azure.com");
+        connectSrc.Add("https://dc.services.visualstudio.com https://*.in.applicationinsights.azure.com https://js.monitor.azure.com");
         scriptSrc.Add("https://js.monitor.azure.com");
         //#endif
 
@@ -60,6 +60,11 @@ private void BuildCspString()
         mediaSrc.Add("https://*.gvt1.com");
         //#endif
 
+        //#if (signalR == true)
+        connectSrc.Add("https://*.service.signalr.net");
+        connectSrc.Add(apiUrl.Replace("http:", "ws:").Replace("https:", "wss:"));
+        //#endif
+
         // --- Add Google Fonts ---
         fontSrc.Add("https://fonts.gstatic.com");
         styleSrc.Add("https://fonts.googleapis.com");
@@ -72,8 +77,11 @@ private void BuildCspString()
         {
             connectSrc.Add("ws://localhost:* wss://localhost:*"); // Allow localhost WebSocket connections during development (hot reload / debugging)
             connectSrc.Add("https://raw.githubusercontent.com/"); // Source maps
+            connectSrc.Add("https://cdn.jsdelivr.net/"); // eruda dev tools
         }
 
+        scriptSrc.Add("https://cdn.jsdelivr.net/npm/eruda"); // eruda dev tools
+
         // Construct the final CSP string
         CspContent = $"default-src {string.Join(" ", ownOrigins)}; " + // Fallback for all directives.
                      $"script-src {string.Join(" ", scriptSrc)}; " +   // Defines valid sources for executable JavaScript.
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor
index 5aca88f260..1d6b6233bb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/MainLayout.razor
@@ -7,6 +7,8 @@
             <CascadingValue Value="currentRouteData">
                 <CascadingValue Name="@Parameters.IsOnline" Value="IsOnline">
 
+                    <AppHeadContents />
+
                     <AppShell NavPanelItems="navPanelItems" IsIdentityPage="isIdentityPage">
                         @Body
                     </AppShell>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor
deleted file mode 100644
index 4e49ae96da..0000000000
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/SecurityHeaders.razor
+++ /dev/null
@@ -1,19 +0,0 @@
-@* Unlike UseSecurityHeaders in WebApplicationExtensions.cs, which only applies during Blazor Server
-   and Blazor WebAssembly Pre-Rendering, this component works across all Interactive Blazor
-   rendering modes (Server, WebAssembly, WebAssembly Standalone, Auto and Hybrid).
-   Because it enforces a stricter Content-Security-Policy, it is not enabled by default.
-   To activate it, add <SecurityHeaders /> inside AppShell.razor *@
-
-@*
-    Note: Even this CSP is not fully strict:
-    1- It allows `inline` scripts and styles, which is not recommended. To avoid this, you can use a nonce or hash-based approach.
-    2- While this gets applied immediatly in Blazor WebAssembly, Auto and Server if pre-rendering is enabled, but in Blazor WebAssembly Standalone and Blazor Hybrid
-        it gets applied late in the rendering process, which means that some content might be rendered before the CSP is applied.
-    You can mitigate this by moving the desired configuration in index.html files in Client.Maui & Client.Web projects.
-    In case you're hosting your Blazor WebAssembly, Auto and Server without pre-rendering, you can put this component in App.razor
-*@
-
-<HeadContent>
-    <meta name="referrer" content="strict-origin-when-cross-origin">
-    <meta http-equiv="Content-Security-Policy" content="@CspContent">
-</HeadContent>
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml.cs
index 20ca070ab4..c834164dff 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/MainPage.xaml.cs
@@ -1,20 +1,19 @@
-//+:cnd:noEmit
+//+:cnd:noEmit
+using System.Diagnostics.CodeAnalysis;
+using Microsoft.AspNetCore.Components.Web;
 
 namespace Boilerplate.Client.Maui;
 
 public partial class MainPage
 {
+    [DynamicDependency(DynamicallyAccessedMemberTypes.All, typeof(HeadOutlet))]
     public MainPage(ClientMauiSettings clientMauiSettings)
     {
         InitializeComponent();
-        //#if (appInsights == true)
-        AppWebView.RootComponents.Insert(0, new()
+        AppWebView.RootComponents.Add(new()
         {
-            ComponentType = typeof(BlazorApplicationInsights.ApplicationInsightsInit),
-            // The App Insights JS SDK is already included in index.html. Use `IsWasmStandalone` to prevent reloading scripts.
-            Parameters = new Dictionary<string, object?> { { nameof(BlazorApplicationInsights.ApplicationInsightsInit.IsWasmStandalone), true } },
+            ComponentType = typeof(HeadOutlet),
             Selector = "head::after"
         });
-        //#endif
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/Program.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/Program.cs
index e1d555e4d6..91ab04770e 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/Program.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Windows/Program.cs
@@ -1,15 +1,21 @@
 //+:cnd:noEmit
 using Velopack;
-using Microsoft.Web.WebView2.Core;
+
+using System.Diagnostics.CodeAnalysis;
+
 using Boilerplate.Client.Core.Components;
-using Microsoft.AspNetCore.Components.WebView.WindowsForms;
 using Boilerplate.Client.Windows.Infrastructure.Services;
 
+using Microsoft.Web.WebView2.Core;
+using Microsoft.AspNetCore.Components.Web;
+using Microsoft.AspNetCore.Components.WebView.WindowsForms;
+
 namespace Boilerplate.Client.Windows;
 
 public partial class Program
 {
     [STAThread]
+    [DynamicDependency(DynamicallyAccessedMemberTypes.All, typeof(HeadOutlet))]
     public static void Main(string[] args)
     {
         Application.ThreadException += (_, e) => LogException(e.Exception, reportedBy: nameof(Application.ThreadException));
@@ -93,10 +99,7 @@ await form.InvokeAsync(() =>
 
         blazorWebView.WebView.DefaultBackgroundColor = ColorTranslator.FromHtml("#0D2960");
 
-        //#if (appInsights == true)
-        blazorWebView.RootComponents.Add(new RootComponent("head::after", typeof(BlazorApplicationInsights.ApplicationInsightsInit), new Dictionary<string, object?> { { nameof(BlazorApplicationInsights.ApplicationInsightsInit.IsWasmStandalone), true } }));
-        //#endif
-
+        blazorWebView.RootComponents.Add(new RootComponent("head::after", typeof(HeadOutlet), null));
         blazorWebView.RootComponents.Add(new RootComponent("#app-container", typeof(Routes), null));
 
         blazorWebView.BlazorWebViewInitialized += delegate
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
index a3f1481153..f6372a6943 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Middlewares.cs
@@ -41,7 +41,7 @@ private static void ConfigureMiddlewares(this WebApplication app)
 
         app.UseStaticFiles();
 
-        app.UseEnahcedCors();
+        app.UseCors();
         app.UseRateLimiter();
 
         app.UseMiddleware<ForceUpdateMiddleware>();
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
index e801a65a4b..726613c4ae 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
@@ -196,7 +196,14 @@ private static TBuilder ConfigureOpenTelemetry<TBuilder>(this TBuilder builder)
             })
             .ConfigureResource(resource =>
             {
-                resource.AddAzureAppServiceDetector()
+                var resourceAttributes = new Dictionary<string, object>
+                {
+                    { "service.name", "Boilerplate" }
+                };
+
+                resource
+                    .AddAttributes(resourceAttributes)
+                    .AddAzureAppServiceDetector()
                     .AddAzureContainerAppsDetector()
                     .AddAzureVMDetector()
                     .AddContainerDetector()
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
index 70fa9d0ea5..7e5301a7ff 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationExtensions.cs
@@ -140,36 +140,11 @@ public static WebApplication UseSecurityHeaders(this WebApplication app)
             }
             context.Response.Headers.Append("Content-Security-Policy", csp);
             // For a stricter, app-wide CSP that also works in all Interactive Blazor rendering modes,
-            // use the SecurityHeaders.razor component in Client.Core by adding <SecurityHeaders /> to AppShell.razor
+            // check out the ContentSecurityPolicy.razor component in Client.Core
 
             await next();
         });
 
         return app;
     }
-
-    /// <summary>
-    /// In addition to the `policy.SetPreflightMaxAge(TimeSpan.FromDays(1))` call in AddCors,
-    /// that caches preflight responses in browser cache, this additional middleware is neccessary to cache headers for preflight responses in CDN Edge.
-    /// </summary>
-    public static WebApplication UseEnahcedCors(this WebApplication app)
-    {
-        app.Use(async (context, next) =>
-        {
-            if (context.Request.Method == HttpMethods.Options && context.Request.Headers.ContainsKey("Access-Control-Request-Method"))
-            {
-                context.Response.GetTypedHeaders().CacheControl = new()
-                {
-                    Public = true,
-                    SharedMaxAge = TimeSpan.FromDays(1)
-                };
-                context.Response.Headers.Append("Vary", "Origin, Access-Control-Request-Method, Access-Control-Request-Headers");
-            }
-            await next();
-        });
-
-        app.UseCors();
-
-        return app;
-    }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Components/App.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Components/App.razor
index 3c62d0c903..a1c433c3b9 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Components/App.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Components/App.razor
@@ -18,6 +18,7 @@
 <html bit-theme="dark">
 
 <head>
+    <ContentSecurityPolicy />
     <ResourcePreloader />
     <base href="/" />
 
@@ -45,12 +46,6 @@
     <Link rel="preconnect" Href="https://js.monitor.azure.com" crossorigin />
     <!-- Perform the initial static render of ApplicationInsightsInit to start App Insights ASAP. -->
     <BlazorApplicationInsights.ApplicationInsightsInit />
-    @if (renderMode is not null)
-    {
-        <!-- Initialize IApplicationInsights service using ApplicationInsightsInit with rendermode. -->
-        <!-- Use `IsWasmStandalone` to prevent re-downloading scripts. -->
-        <BlazorApplicationInsights.ApplicationInsightsInit IsWasmStandalone="true" @rendermode=renderMode />
-    }
     @*#endif*@
     <Link rel="apple-touch-icon" sizes="512x512" Href="images/icons/bit-icon-512.png" />
     <Link rel="manifest" Href="manifest.json" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
index f8f2d87749..1e4aab6220 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/Program.Middlewares.cs
@@ -87,7 +87,7 @@ public static void ConfigureMiddlewares(this WebApplication app)
         }
 
         //#if (api == "Integrated")
-        app.UseEnahcedCors();
+        app.UseCors();
         app.UseRateLimiter();
         app.UseMiddleware<ForceUpdateMiddleware>();
         //#endif

From 19578ba81d47c799e0c0e752d141cf3715e68715 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 8 Mar 2026 23:52:30 +0330
Subject: [PATCH 42/66] feat(prerelease): v-10.4.3-pre-01 #12115 (#12150)

---
 src/Besql/Bit.Besql/wwwroot/bit-besql.js      |  2 +-
 src/Bit.Build.props                           |  2 +-
 .../buildTransitive/Bit.BlazorES2019.targets  |  8 +++----
 src/BlazorUI/Bit.BlazorUI/Info.cs             |  2 +-
 src/BlazorUI/Bit.BlazorUI/Scripts/general.ts  |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  6 ++---
 .../Bit.BlazorUI.Demo.Shared.csproj           |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |  6 ++---
 .../Bit.BlazorUI.Demo.Client.Web.csproj       |  6 ++---
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  6 ++---
 src/BlazorUI/Demo/Directory.Build.props       |  2 +-
 .../Bit.Bswup.Demo/wwwroot/service-worker.js  |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../wwwroot/service-worker.js                 |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.progress.ts   |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts   |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts      |  2 +-
 .../FullDemo/Client/wwwroot/service-worker.js |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 src/Butil/Bit.Butil/Scripts/butil.ts          |  2 +-
 .../BlazorEmpty.Client.csproj                 |  8 +++----
 .../BlazorEmpty/BlazorEmpty.csproj            |  8 +++----
 .../.docs/19- Project Miscellaneous Files.md  | 10 ++++-----
 .../Boilerplate/Bit.Boilerplate/README.md     |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../src/Directory.Packages.props              | 22 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Careers.Server.csproj        |  6 ++---
 .../Bit.Websites.Careers.Shared.csproj        |  4 ++--
 .../Careers/src/Directory.Build.props         |  2 +-
 .../Bit.Websites.Platform.Client.csproj       | 14 ++++++------
 .../Templates03GettingStartedPage.razor       |  2 +-
 .../Templates03GettingStartedPage.razor.cs    |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Platform.Server.csproj       |  6 ++---
 .../Bit.Websites.Platform.Shared.csproj       |  4 ++--
 .../Platform/src/Directory.Build.props        |  2 +-
 .../Bit.Websites.Sales.Client.csproj          | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Sales.Server.csproj          |  6 ++---
 .../Bit.Websites.Sales.Shared.csproj          |  4 ++--
 src/Websites/Sales/src/Directory.Build.props  |  2 +-
 47 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
index 4bcc3d7bc6..04ab5131f3 100644
--- a/src/Besql/Bit.Besql/wwwroot/bit-besql.js
+++ b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
@@ -1,5 +1,5 @@
 var BitBesql = window.BitBesql || {};
-BitBesql.version = window['bit-besql version'] = '10.4.2';
+BitBesql.version = window['bit-besql version'] = '10.4.3-pre-01';
 
 BitBesql.persist = async function besqlPersist(fileName) {
 
diff --git a/src/Bit.Build.props b/src/Bit.Build.props
index 1a06617a3b..489ac558d2 100644
--- a/src/Bit.Build.props
+++ b/src/Bit.Build.props
@@ -27,7 +27,7 @@
         <PackageProjectUrl>https://github.com/bitfoundation/bitplatform</PackageProjectUrl>
 
         <!-- Version -->
-        <ReleaseVersion>10.4.2</ReleaseVersion>
+        <ReleaseVersion>10.4.3-pre-01</ReleaseVersion>
           <PackageVersion>$(ReleaseVersion)</PackageVersion>
         <PackageReleaseNotes>https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion)</PackageReleaseNotes>
         <Version Condition=" '$(Configuration)' == 'Release' ">$([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.'))</Version>
diff --git a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
index a5f4c51749..0de51370d3 100644
--- a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
+++ b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
@@ -1,13 +1,13 @@
 <Project>
     <ItemGroup>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.2/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.2/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
         </Content>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.2/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.2/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
diff --git a/src/BlazorUI/Bit.BlazorUI/Info.cs b/src/BlazorUI/Bit.BlazorUI/Info.cs
index 37d234742a..56a80e66e1 100644
--- a/src/BlazorUI/Bit.BlazorUI/Info.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Info.cs
@@ -8,5 +8,5 @@ public static class Info
     /// <summary>
     /// The current version string of bit BlazorUI.
     /// </summary>
-    public static string Version { get; } = "10.4.2";
+    public static string Version { get; } = "10.4.3-pre-01";
 }
diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
index 45fa0fd46f..616bab1b7c 100644
--- a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
+++ b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
@@ -1,4 +1,4 @@
-(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.2';
+(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-01';
 
 interface DotNetObject {
     invokeMethod<T>(methodIdentifier: string, ...args: any[]): T;
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 8174bddfd7..ea32bcdbe8 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -10,12 +10,12 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index e61071063b..b16c183811 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -5,11 +5,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index eea6f1316d..94b77fb09e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -16,11 +16,11 @@
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
 
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 558607530b..7ee8d1b5db 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -98,13 +98,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
         <PackageReference Include="Microsoft.AppCenter.Crashes" Version="5.0.7" />
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
index ceb81b7de6..d51a51e845 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
@@ -28,13 +28,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.Bswup" Version="10.4.2" />
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
index cf21282c09..aa7eb09ab1 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index dcbaf3307b..819a03b9bd 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -29,12 +29,12 @@
         <Using Include="Bit.BlazorUI.Demo.Client.Core.Services" />
         <Using Include="Bit.BlazorUI.Demo.Shared" />
         <Watch Remove="*.scss" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Directory.Build.props b/src/BlazorUI/Demo/Directory.Build.props
index 9160774a72..0750ccd268 100644
--- a/src/BlazorUI/Demo/Directory.Build.props
+++ b/src/BlazorUI/Demo/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.2 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
index ed267ea846..17ee9b7ccb 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
index d1e6453736..4754da27f5 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
index 493ca3eeef..b1b2752a8a 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
index 2978b502d9..4536aecee4 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 self.assetsInclude = [];
 self.assetsExclude = [
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
index 867ed80ac4..a144e67d21 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
@@ -1,4 +1,4 @@
-window['bit-bswup.progress version'] = '10.4.2';
+window['bit-bswup.progress version'] = '10.4.3-pre-01';
 
 (function () {
     const _config: IBswupProgressConfigs = {};
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
index 818d237e75..e315c7e6c2 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw-cleanup version'] = '10.4.2';
+self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-01';
 
 self.addEventListener('install', e => e.waitUntil(removeBswup()));
 
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
index 02bfbb0c0e..3c9df7f43c 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw version'] = '10.4.2';
+self['bit-bswup.sw version'] = '10.4.3-pre-01';
 
 interface Window {
     clients: any
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
index 50a49a6103..b26aa7252f 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
@@ -1,5 +1,5 @@
 var BitBswup = BitBswup || {};
-BitBswup.version = window['bit-bswup version'] = '10.4.2';
+BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-01';
 
 (function () {
     const bitBswupScript = document.currentScript;
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
index 9b8397b6f8..e0b7284670 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
index 1fefe90667..f83480dbb6 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 
 self.assetsInclude = [];
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
diff --git a/src/Butil/Bit.Butil/Scripts/butil.ts b/src/Butil/Bit.Butil/Scripts/butil.ts
index 26c3e44a68..1b1c59ffd5 100644
--- a/src/Butil/Bit.Butil/Scripts/butil.ts
+++ b/src/Butil/Bit.Butil/Scripts/butil.ts
@@ -1,2 +1,2 @@
 var BitButil = BitButil || {};
-BitButil.version = window['bit-butil version'] = '10.4.2';
\ No newline at end of file
+BitButil.version = window['bit-butil version'] = '10.4.3-pre-01';
\ No newline at end of file
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
index b528ed0f13..f5e199d28f 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.2 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-01 -->
 
 <Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
 
@@ -15,14 +15,14 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
index b99a722180..016eb21bd3 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.2 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-01 -->
 
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
@@ -18,14 +18,14 @@
   <!--#endif -->
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md
index 76b5fb6616..26eb1627f1 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
@@ -221,7 +221,7 @@ These namespaces are **automatically imported** in every C# file, eliminating th
 
 Instead of this in each `.csproj`:
 ```xml
-<PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
+<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
 ```
 
 You write this in `.csproj`:
@@ -231,7 +231,7 @@ You write this in `.csproj`:
 
 And the version is defined centrally in `Directory.Packages.props`:
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.2" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
 ```
 
 **Benefits**:
@@ -242,8 +242,8 @@ And the version is defined centrally in `Directory.Packages.props`:
 **Example packages included**:
 
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.2" />
-<PackageVersion Include="Bit.Butil" Version="10.4.2" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-01" />
 <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.0" />
 <PackageVersion Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.0" />
 <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.21" />
@@ -608,7 +608,7 @@ When you open the project in VS Code, you'll be prompted to install these extens
 **Example**:
 
 ````markdown
-This project gets generated by bit-bp template v-10.4.2 using the following command
+This project gets generated by bit-bp template v-10.4.3-pre-01 using the following command
 ```bash
 dotnet new bit-bp
     --name Boilerplate
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/README.md b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
index b5ca1438c4..07ee334c33 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/README.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
@@ -2,7 +2,7 @@
 
 Thank you for creating a new project with bit platform! We appreciate your trust in our platform and are excited to see what you'll build.
 
-This project generated by bit-bp template v-10.4.2 using the following command:
+This project generated by bit-bp template v-10.4.3-pre-01 using the following command:
 
 ```bash
     dotnet new bit-bp
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
index b17e18f156..38bd6eef18 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
@@ -1,5 +1,5 @@
 //+:cnd:noEmit
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 //#if (notification == true)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 6f17280dcf..79a032821a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -1,16 +1,16 @@
-<!-- Generated by bit-bp template v-10.4.2 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
 <Project>
     <ItemGroup>
         <!-- https://learn.microsoft.com/en-us/nuget/consume-packages/central-package-management -->
-        <PackageVersion Include="Bit.Butil" Version="10.4.2" />
-        <PackageVersion Include="Bit.BlazorUI" Version="10.4.2" />
-        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.2" />
-        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.2" />
-        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.2" />
-        <PackageVersion Include="Bit.Bswup" Version="10.4.2" />
-        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.2" />
-        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.2" />
+        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-01" />
         <PackageVersion Include="DistributedLock.FileSystem" Version="1.0.3" />
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
@@ -90,7 +90,7 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.2" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-01" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index a43d07da74..664c74ec76 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
index a7edd1254e..ded99227dc 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index ceb05d456a..7c7500407f 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Careers.Shared\Bit.Websites.Careers.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Careers.Client\Bit.Websites.Careers.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index 2e96e00658..703953d088 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Directory.Build.props b/src/Websites/Careers/src/Directory.Build.props
index d70d70447e..2b237a7d8c 100644
--- a/src/Websites/Careers/src/Directory.Build.props
+++ b/src/Websites/Careers/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.2 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 8ea0b336e8..d6b72d25d4 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -32,16 +32,16 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.2" />
-        <PackageReference Include="Bit.Butil" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 42557c5cca..dab00383b0 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -153,7 +153,7 @@ rm $HOME/dotnet.tar.gz</CodeBox>
                         </li>
                         <li>
                             <div style="margin-bottom:8px">Install <a href="https://www.nuget.org/packages/Bit.Boilerplate" target="_blank">Bit Boilerplate</a> project template</div>
-                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.2</CodeBox>
+                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-01</CodeBox>
                         </li>
                         @if (showCrossPlatform && devOS is "Windows")
                         {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
index 92b183f838..a8ecedd2f5 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
@@ -43,7 +43,7 @@ public partial class Templates03GettingStartedPage
             command:"dotnet tool install -g Aspire.Cli"),
 
             (text:@"echo 'Install the Bit.Boilerplate project template https://www.nuget.org/packages/Boilerplate.Templates';",
-            command:"dotnet new install Bit.Boilerplate::10.4.2;")
+            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-01;")
         ];
 
         if (enableVirtualization)
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
index f413d8a0ce..85443d5161 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index e82a14a4e5..60d668150c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -12,12 +12,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Platform.Shared\Bit.Websites.Platform.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Platform.Client\Bit.Websites.Platform.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index 2e96e00658..703953d088 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Directory.Build.props b/src/Websites/Platform/src/Directory.Build.props
index 9c75fd074f..3a3e279b00 100644
--- a/src/Websites/Platform/src/Directory.Build.props
+++ b/src/Websites/Platform/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.2 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
 <Project>
     <PropertyGroup>
         <LangVersion>preview</LangVersion>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index b9580c72e0..5ef583719c 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.2" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
index eb106e2455..f3ade6fa57 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.2
+// bit version: 10.4.3-pre-01
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index c7ddc328dc..114ecbe86c 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Sales.Shared\Bit.Websites.Sales.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Sales.Client\Bit.Websites.Sales.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.2" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index 2e96e00658..703953d088 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.2">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.2">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Directory.Build.props b/src/Websites/Sales/src/Directory.Build.props
index 8761876588..025326d27a 100644
--- a/src/Websites/Sales/src/Directory.Build.props
+++ b/src/Websites/Sales/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.2 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>

From 717ea3a682c4b279ec1a13934b7788f65c181afc Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Mon, 9 Mar 2026 13:02:05 +0100
Subject: [PATCH 43/66] feat(templates): improve bit Boilerplate CSP component
 #12159 (#12160)

---
 .../Components/Layout/ContentSecurityPolicy.razor   |  4 +++-
 .../Layout/ContentSecurityPolicy.razor.cs           | 13 ++++++-------
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
index 41d6640c10..c0430bb18b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor
@@ -4,7 +4,9 @@
    
    Note: This component renders a little bit late in Blazor Hybrid and WebAssembly Standalone, so it might be a good idea to move it to Client.Web/wwwroot/index.html and Client.Maui/wwwroot/index.html
    For Blazor Server, Auto and WebAssembly, with or without pre-rendering, it renders early enough in App.razor
-   *@
+
+   Warning: It's highly recommended to remove unsafe-inline, but to avoid degrading the dev experience, it's currently included.
+*@
 
 @if (AppEnvironment.IsDevelopment() is false)
 {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
index 58d25e78c5..eb047aa64b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/ContentSecurityPolicy.razor.cs
@@ -22,16 +22,15 @@ private void BuildCspString()
         var ownOrigins = new HashSet<string> { "'self'", apiUrl };
         if (string.IsNullOrWhiteSpace(webAppUrl) is false)
             ownOrigins.Add(webAppUrl);
-        var ownOriginsString = string.Join(" ", ownOrigins);
 
         // 2. Service Specific Origins
         var connectSrc = new HashSet<string>(ownOrigins);
-        var imgSrc = new HashSet<string> { ownOriginsString, "data:" };
-        var scriptSrc = new HashSet<string> { "'self'", "'unsafe-inline'", "'wasm-unsafe-eval'", "'unsafe-hashes'" };
-        var styleSrc = new HashSet<string> { "'self'", "'unsafe-inline'" };
-        var fontSrc = new HashSet<string> { "'self'", "data:" };
-        var frameSrc = new HashSet<string> { "'self'" };
-        var mediaSrc = new HashSet<string> { "'self'" };
+        var imgSrc = new HashSet<string>(ownOrigins) { "data:" };
+        var scriptSrc = new HashSet<string>(ownOrigins) { "'unsafe-inline'", "'wasm-unsafe-eval'", "'unsafe-hashes'" };
+        var styleSrc = new HashSet<string>(ownOrigins) { "'unsafe-inline'" };
+        var fontSrc = new HashSet<string>(ownOrigins) { "data:" };
+        var frameSrc = new HashSet<string>(ownOrigins);
+        var mediaSrc = new HashSet<string>(ownOrigins);
 
         //#if (appInsights == true)
         // --- Add Azure App Insights ---

From 07e12b200283e4716dc6e1a22fb518cc6558caae Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Thu, 12 Mar 2026 14:21:34 +0100
Subject: [PATCH 44/66] feat(deps): update project dependencies #12165 (#12166)

---
 .devcontainer/devcontainer.json               |  2 +-
 .../Bit.Besql.Demo.Client.csproj              |  2 +-
 .../Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj |  6 +-
 .../Bit.BlazorUI.Assets/package-lock.json     | 16 ++--
 src/BlazorUI/Bit.BlazorUI.Assets/package.json |  2 +-
 .../Bit.BlazorUI.Extras.csproj                |  2 +-
 .../Bit.BlazorUI.Extras/package-lock.json     | 16 ++--
 src/BlazorUI/Bit.BlazorUI.Extras/package.json |  2 +-
 .../Bit.BlazorUI.Icons/package-lock.json      | 16 ++--
 src/BlazorUI/Bit.BlazorUI.Icons/package.json  |  2 +-
 src/BlazorUI/Bit.BlazorUI/package-lock.json   | 16 ++--
 src/BlazorUI/Bit.BlazorUI/package.json        |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           | 12 +--
 .../Bit.BlazorUI.Demo.Shared.csproj           |  8 +-
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  8 +-
 .../package-lock.json                         | 16 ++--
 .../package.json                              |  2 +-
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |  4 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  4 +-
 .../Bit.Bswup.Demo/Bit.Bswup.Demo.csproj      |  4 +-
 .../Bit.Bswup.NewDemo.Client.csproj           |  2 +-
 .../Bit.Bswup.NewDemo.csproj                  |  2 +-
 .../Client/Bit.Bswup.Demo.Client.csproj       |  4 +-
 .../Server/Bit.Bswup.Demo.Server.csproj       |  2 +-
 .../Bit.Butil.Demo.Maui.csproj                |  6 +-
 .../Bit.Butil.Demo.Web.csproj                 |  4 +-
 .../Bit.ResxTranslator.csproj                 | 12 +--
 .../.devcontainer/devcontainer.json           |  2 +-
 .../20260119232453_Initial.Designer.cs        |  2 +-
 .../AppOfflineDbContextModelSnapshot.cs       |  2 +-
 .../Boilerplate.Client.Core/package-lock.json | 16 ++--
 .../Boilerplate.Client.Core/package.json      |  2 +-
 .../src/Directory.Packages.props              | 94 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        |  4 +-
 .../package-lock.json                         | 12 ++-
 .../Bit.Websites.Careers.Client/package.json  |  2 +-
 .../Bit.Websites.Careers.Server.csproj        |  8 +-
 .../Bit.Websites.Careers.Shared.csproj        |  6 +-
 .../Bit.Websites.Platform.Client.csproj       |  6 +-
 .../Templates03GettingStartedPage.razor       |  2 +-
 .../package-lock.json                         | 16 ++--
 .../Bit.Websites.Platform.Client/package.json |  2 +-
 .../Bit.Websites.Platform.Server.csproj       | 14 +--
 .../Bit.Websites.Platform.Shared.csproj       |  6 +-
 .../Bit.Websites.Sales.Client.csproj          |  4 +-
 .../package-lock.json                         | 16 ++--
 .../Bit.Websites.Sales.Client/package.json    |  2 +-
 .../Bit.Websites.Sales.Server.csproj          |  8 +-
 .../Bit.Websites.Sales.Shared.csproj          |  6 +-
 src/global.json                               |  2 +-
 50 files changed, 206 insertions(+), 202 deletions(-)

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index e6a705e341..5ce51473d7 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -14,7 +14,7 @@
     },
     "ghcr.io/devcontainers/features/node:1": { "version": "24" }
   },
-  "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.103",
+  "image": "mcr.microsoft.com/dotnet/sdk:10.0.200",
   "postStartCommand": "dotnet workload install wasm-tools && dotnet dev-certs https --trust",
   "waitFor": "onCreateCommand",
   "customizations": {
diff --git a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
index 2412eb6867..f696a1c6aa 100644
--- a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
@@ -10,7 +10,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
index 32e6e7210f..66f19056f5 100644
--- a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
@@ -8,7 +8,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\Bit.Besql.Demo.Client\Bit.Besql.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
@@ -17,11 +17,11 @@
              and open Nuget Package Manager Console, and select `Bit.Besql.Demo.Client` project as default project
              Then run either Add-Migration MigrationName -OutputDir Data\Migrations or
              Optimize-DbContext -OutputDir Data\CompiledModel commands. -->
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.3">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.4">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.3">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.4">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json
index 5ade51c860..fc7beb7080 100644
--- a/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI.Assets/package-lock.json
@@ -5,7 +5,7 @@
     "packages": {
         "": {
             "devDependencies": {
-                "sass": "1.97.3"
+                "sass": "1.98.0"
             }
         },
         "node_modules/@parcel/watcher": {
@@ -354,9 +354,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -448,14 +448,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/BlazorUI/Bit.BlazorUI.Assets/package.json b/src/BlazorUI/Bit.BlazorUI.Assets/package.json
index e14395e62d..20580eb644 100644
--- a/src/BlazorUI/Bit.BlazorUI.Assets/package.json
+++ b/src/BlazorUI/Bit.BlazorUI.Assets/package.json
@@ -1,5 +1,5 @@
 {
     "devDependencies": {
-        "sass": "1.97.3"
+        "sass": "1.98.0"
     }
 }
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
index ab13ed63d7..2825ad2662 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
@@ -25,7 +25,7 @@
     <ItemGroup>
         <FrameworkReference Include="Microsoft.AspNetCore.App" PrivateAssets="all" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" PrivateAssets="all" />
-        <PackageReference Include="Jint" Version="4.6.1" PrivateAssets="all" />
+        <PackageReference Include="Jint" Version="4.6.3" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
index 6508d3a5d0..09ec86de9c 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package.json b/src/BlazorUI/Bit.BlazorUI.Extras/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/package.json
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json
index c5ac7a013c..510ee2d40b 100644
--- a/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI.Icons/package-lock.json
@@ -5,7 +5,7 @@
     "packages": {
         "": {
             "devDependencies": {
-                "sass": "1.97.3"
+                "sass": "1.98.0"
             }
         },
         "node_modules/@parcel/watcher": {
@@ -354,9 +354,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -448,14 +448,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/BlazorUI/Bit.BlazorUI.Icons/package.json b/src/BlazorUI/Bit.BlazorUI.Icons/package.json
index e14395e62d..20580eb644 100644
--- a/src/BlazorUI/Bit.BlazorUI.Icons/package.json
+++ b/src/BlazorUI/Bit.BlazorUI.Icons/package.json
@@ -1,5 +1,5 @@
 {
     "devDependencies": {
-        "sass": "1.97.3"
+        "sass": "1.98.0"
     }
 }
diff --git a/src/BlazorUI/Bit.BlazorUI/package-lock.json b/src/BlazorUI/Bit.BlazorUI/package-lock.json
index cbb5d3bdee..68ed7c5479 100644
--- a/src/BlazorUI/Bit.BlazorUI/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/BlazorUI/Bit.BlazorUI/package.json b/src/BlazorUI/Bit.BlazorUI/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/BlazorUI/Bit.BlazorUI/package.json
+++ b/src/BlazorUI/Bit.BlazorUI/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index ea32bcdbe8..925e99b44a 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -19,21 +19,21 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Jint" Version="4.6.1" />
+        <PackageReference Include="Jint" Version="4.6.3" />
         <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
         <PackageReference Include="MimeTypeMapOfficial" Version="1.0.17" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.InMemory.Storage" Version="9.0.0" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="1.0.0" />
+        <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index b16c183811..b5df1f957c 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -13,10 +13,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
-        <PackageReference Include="System.Text.Json" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
+        <PackageReference Include="System.Text.Json" Version="10.0.4" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 94b77fb09e..19d9d4034e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -24,10 +24,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
index 87627042c0..e481752b48 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 7ee8d1b5db..ade2024478 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -117,8 +117,8 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.41" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.50" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.50" />
     </ItemGroup>
 
     <!-- Build Properties must be defined within these property groups to ensure successful publishing
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index 819a03b9bd..ec04e258a4 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -39,8 +39,8 @@
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
 
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.41" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.50" />
         <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageReference Include="Velopack" Version="0.0.1298" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
diff --git a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
index e1091b0747..21db792447 100644
--- a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
+++ b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
@@ -8,8 +8,8 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
index 6231201df9..cb7a6069b8 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
@@ -13,7 +13,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
index 387fcfc728..830dad20d7 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
@@ -8,7 +8,7 @@
 
   <ItemGroup>
     <ProjectReference Include="..\Bit.Bswup.NewDemo.Client\Bit.Bswup.NewDemo.Client.csproj" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
   </ItemGroup>
 
 </Project>
diff --git a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
index 2927c5e463..23137718b3 100644
--- a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
+++ b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
@@ -9,8 +9,8 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
 
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
     </ItemGroup>
diff --git a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
index e23137a92e..9b3beedef9 100644
--- a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
+++ b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
@@ -8,7 +8,7 @@
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
         <ProjectReference Include="..\Client\Bit.Bswup.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
index 2e90e19290..400566a612 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
@@ -50,9 +50,9 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.41" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.50" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.50" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
index 05db089ba7..cfb493bb5c 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
@@ -7,8 +7,8 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
   </ItemGroup>
 
   <ItemGroup>
diff --git a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
index f3d0d26276..8c6e8b30ab 100644
--- a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
+++ b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
@@ -14,13 +14,13 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.4" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
index e6c9704075..f368764d28 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
@@ -1,6 +1,6 @@
 {
     "name": "Boilerplate",
-    "image": "mcr.microsoft.com/dotnet/nightly/sdk:10.0.103",
+    "image": "mcr.microsoft.com/dotnet/sdk:10.0.200",
     "hostRequirements": {
         "cpus": 8
     },
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
index fc95635baf..e247a54e70 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
@@ -17,7 +17,7 @@ partial class Initial
     protected override void BuildTargetModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.3");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.4");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
index 7cb080ac6a..56e22be7c4 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
@@ -14,7 +14,7 @@ partial class AppOfflineDbContextModelSnapshot : ModelSnapshot
     protected override void BuildModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.3");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.4");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
index de237bb946..9d741dbff4 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 79a032821a..1cc4e6b4fa 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -17,26 +17,26 @@
         <PackageVersion Include="HtmlSanitizer" Version="9.0.892" />
         <PackageVersion Include="libphonenumber-csharp" Version="9.0.25" />
         <PackageVersion Include="Meziantou.Framework.Win32.Jobs" Version="3.5.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" />
         <PackageVersion Include="Asp.Versioning.Mvc" Version="8.1.1" />
         <PackageVersion Include="Asp.Versioning.Mvc.ApiExplorer" Version="8.1.1" />
         <PackageVersion Include="EmbedIO" Version="3.5.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.4" />
         <PackageVersion Include="AspNetCore.HealthChecks.Hangfire" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.41" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.41" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.41" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.50" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.50" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.50" />
         <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
         <PackageVersion Include="MSTest" Version="4.1.0" />
         <PackageVersion Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
@@ -50,15 +50,15 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.1" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.6" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.4" />
         <!--/+:msbuild-conditional:noEmit -->
-        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.0.0" />
+        <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.1.0" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.2-preview.1.26125.13" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.2" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
@@ -72,11 +72,11 @@
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.2" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'S3' OR '$(filesStorage)' == '') " Include="CommunityToolkit.Aspire.Hosting.Minio" Version="13.1.1" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.2-preview.1.26125.13" />
-        <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.3.0" />
-        <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.3.0" />
+        <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.4.0" />
+        <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.4.0" />
         <PackageVersion Include="OpenTelemetry.Exporter.OpenTelemetryProtocol" Version="1.15.0" />
         <PackageVersion Include="OpenTelemetry.Extensions.Hosting" Version="1.15.0" />
-        <PackageVersion Include="OpenTelemetry.Instrumentation.AspNetCore" Version="1.15.0" />
+        <PackageVersion Include="OpenTelemetry.Instrumentation.AspNetCore" Version="1.15.1" />
         <PackageVersion Include="OpenTelemetry.Instrumentation.Http" Version="1.15.0" />
         <PackageVersion Include="OpenTelemetry.Instrumentation.Runtime" Version="1.15.0" />
         <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.23" />
@@ -84,7 +84,7 @@
         <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.AspNetCore" Version="6.1.0" />
         <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.1.0" />
         <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.1.0" />
-        <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Xamarin.Firebase.Messaging" Version="125.0.1" />
+        <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Xamarin.Firebase.Messaging" Version="125.0.1.2" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Plugin.LocalNotification" Version="13.0.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="AdsPush" Version="2.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
@@ -92,19 +92,19 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-01" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
-        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
+        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.3.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.4.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.73.0-preview" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.73.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc3" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc4" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="BlazorApplicationInsights" Version="3.3.0" />
-        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.3" />
+        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.4" />
         <PackageVersion Condition=" '$(database)' == 'PostgreSQL' OR '$(database)' == '' " Include="Npgsql.EntityFrameworkCore.PostgreSQL" Version="10.0.0" />
         <PackageVersion Condition=" '$(database)' == 'MySql' OR '$(database)' == '' " Include="Pomelo.EntityFrameworkCore.MySql" Version="9.0.0" />
         <PackageVersion Condition=" '$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '' " Include="FluentStorage.Azure.Blobs" Version="6.0.2" />
@@ -116,35 +116,35 @@
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.5.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
-        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.3" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.3" />
+        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.4" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.4" />
         <!--/-:msbuild-conditional:noEmit -->
-        <PackageVersion Include="Humanizer" Version="3.0.8" />
+        <PackageVersion Include="Humanizer" Version="3.0.10" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
-        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.3" />
+        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.4" />
         <PackageVersion Include="FluentEmail.Smtp" Version="3.0.2" />
         <PackageVersion Include="FluentStorage" Version="6.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.4" />
         <PackageVersion Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.4" />
         <PackageVersion Include="Swashbuckle.AspNetCore" Version="10.0.0" />
         <PackageVersion Include="Microsoft.Identity.Web" Version="4.5.0" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.4" />
         <PackageVersion Include="AspNet.Security.OAuth.Apple" Version="10.0.0" />
         <PackageVersion Include="AspNet.Security.OAuth.GitHub" Version="10.0.0" />
         <PackageVersion Include="Riok.Mapperly" Version="4.3.1" />
         <PackageVersion Include="Twilio" Version="7.14.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
-        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.4" />
         <PackageVersion Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.3" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.4" />
         <PackageVersion Include="System.Text.Json" Version="10.0.0" />
         <PackageVersion Include="FakeItEasy" Version="9.0.1" />
         <PackageVersion Include="Microsoft.Playwright.MSTest.v4" Version="1.58.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index 664c74ec76..1a3976c773 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
index 77fc0d0f73..6da1c20e7a 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -824,7 +824,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -902,12 +904,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index 7c7500407f..a0e4c476a2 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -20,11 +20,11 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index 703953d088..e56e2d283c 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
-        <PackageReference Include="System.Text.Json" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
+        <PackageReference Include="System.Text.Json" Version="10.0.4" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index d6b72d25d4..604e46350a 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -23,7 +23,7 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
@@ -45,8 +45,8 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index dab00383b0..91304bb854 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -99,7 +99,7 @@
                             {
                                 <br />
                                 <BitAccordion Title="Ubuntu instructions">
-                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.103/dotnet-sdk-10.0.103-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
+                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.200/dotnet-sdk-10.0.200-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
 mkdir -p $HOME/.dotnet
 tar zxf $HOME/dotnet.tar.gz -C "$HOME/.dotnet"
 echo 'PATH=$HOME/.dotnet:$HOME/.dotnet/tools:$PATH' >> ~/.bashrc
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
index f1a201b532..357e338cf0 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index 60d668150c..6a1cc7695c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -21,15 +21,15 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.3.0" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.3.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="ModelContextProtocol" Version="1.0.0" />
+        <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index 703953d088..e56e2d283c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
-        <PackageReference Include="System.Text.Json" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
+        <PackageReference Include="System.Text.Json" Version="10.0.4" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index 5ef583719c..8439ec13c2 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
index 521ae4c77c..5f7934f912 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
@@ -6,7 +6,7 @@
         "": {
             "devDependencies": {
                 "esbuild": "0.27.3",
-                "sass": "1.97.3",
+                "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
@@ -840,9 +840,9 @@
             }
         },
         "node_modules/immutable": {
-            "version": "5.0.3",
-            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.0.3.tgz",
-            "integrity": "sha512-P8IdPQHq3lA1xVeBRi5VPqUm5HDgKnx0Ru51wZz5mjxHr5n3RWhjIpOFU7ybkUxfB+5IToy+OLaHYDBIWsv+uw==",
+            "version": "5.1.5",
+            "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+            "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
             "dev": true,
             "license": "MIT"
         },
@@ -934,14 +934,14 @@
             }
         },
         "node_modules/sass": {
-            "version": "1.97.3",
-            "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
-            "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+            "version": "1.98.0",
+            "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+            "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
                 "chokidar": "^4.0.0",
-                "immutable": "^5.0.2",
+                "immutable": "^5.1.5",
                 "source-map-js": ">=0.6.2 <2.0.0"
             },
             "bin": {
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
index 5e8810bec4..7b9fa7d740 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
@@ -1,7 +1,7 @@
 {
     "devDependencies": {
         "esbuild": "0.27.3",
-        "sass": "1.97.3",
+        "sass": "1.98.0",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index 114ecbe86c..ea6097028c 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -20,11 +20,11 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.3" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.3" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
-        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.4" />
+        <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index 703953d088..e56e2d283c 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.3" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.3" />
-        <PackageReference Include="System.Text.Json" Version="10.0.3" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
+        <PackageReference Include="System.Text.Json" Version="10.0.4" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/global.json b/src/global.json
index eceef3a7a6..9523d2e1ed 100644
--- a/src/global.json
+++ b/src/global.json
@@ -1,6 +1,6 @@
 {
     "sdk": {
-        "version": "10.0.103",
+        "version": "10.0.200",
         "rollForward": "disable"
     },
     "test": {

From 344755e597ef773e8498b1ac1ba531403a34b22c Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 13 Mar 2026 19:30:58 +0330
Subject: [PATCH 45/66] feat(blazorui): add Middleware feature to
 BitMarkdownViewer #12161 (#12162)

---
 .../MarkdownViewer/BitMarkdownViewer.razor.cs | 23 ++++-
 .../MarkdownViewer/BitMarkdownViewer.ts       | 16 +++-
 .../BitMarkdownViewerJsRuntimeExtensions.cs   |  6 +-
 .../Bit.BlazorUI.Extras/Scripts/Extras.ts     | 33 +++++++
 .../Services/BitMarkdownService.cs            | 37 ++++++-
 .../BitMarkdownViewerDemo.razor.cs            | 19 ++++
 .../MarkdownViewer/BitMarkdownViewerTests.cs  | 96 ++++++++++++++++++-
 7 files changed, 218 insertions(+), 12 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
index c8e7f48f51..7babbffa17 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
@@ -17,12 +17,29 @@ public partial class BitMarkdownViewer : BitComponentBase
 
 
 
+    /// <summary>
+    /// The fully qualified JavaScript function identifier to invoke as JavaScript middleware after parsing.
+    /// The string should reference a global JS function (e.g. <c>"myApp.sanitizeHtml"</c>) that accepts 
+    /// an HTML string and returns the processed HTML string.
+    /// JavaScript middleware is skipped during server-side prerendering.
+    /// </summary>
+    [Parameter, CallOnSet(nameof(OnMarkdownOrMiddlewareSet))]
+    public string? JsMiddlewareIdentifier { get; set; }
+
     /// <summary>
     /// The Markdown string value to render as an html element.
     /// </summary>
-    [Parameter, CallOnSet(nameof(OnMarkdownSet))]
+    [Parameter, CallOnSet(nameof(OnMarkdownOrMiddlewareSet))]
     public string? Markdown { get; set; }
 
+    /// <summary>
+    /// The C# function to run after parsing markdown and before rendering HTML.
+    /// The middleware receives the parsed HTML string and returns the processed HTML string.
+    /// C# middleware is applied after JavaScript middleware.
+    /// </summary>
+    [Parameter, CallOnSet(nameof(OnMarkdownOrMiddlewareSet))]
+    public Func<string, string>? Middleware { get; set; }
+
     /// <summary>
     /// A callback that is called before starting to parse the markdown.
     /// </summary>
@@ -63,7 +80,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
 
 
 
-    private void OnMarkdownSet()
+    private void OnMarkdownOrMiddlewareSet()
     {
         if (IsRendered is false) return;
 
@@ -76,7 +93,7 @@ private async Task ParseAndRender()
 
         try
         {
-            _html = await _markdownService.Parse(Markdown, _cts.Token);
+            _html = await _markdownService.Parse(Markdown, JsMiddlewareIdentifier, Middleware, _cts.Token);
         }
         catch
         {
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.ts b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.ts
index 54a0c7eae3..1249277d6e 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.ts
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.ts
@@ -5,12 +5,22 @@ namespace BitBlazorUI {
         }
 
         public static parse(md: string) {
-            const html = marked.parse(md, { async: false });
+            let html = marked.parse(md, { async: false });
+
             return html;
         }
 
-        public static async parseAsync(md: string) {
-            const html = await marked.parse(md, { async: true });
+        public static async parseAsync(md: string, middleware?: string) {
+            let html = await marked.parse(md, { async: true });
+
+            if (middleware) {
+                try {
+                    html = await Extras.invokeJs(middleware, html);
+                } catch (err) {
+                    console.error(err);
+                }
+            }
+
             return html;
         }
     }
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewerJsRuntimeExtensions.cs b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewerJsRuntimeExtensions.cs
index 6d7a1ca506..1a6accf590 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewerJsRuntimeExtensions.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewerJsRuntimeExtensions.cs
@@ -7,10 +7,10 @@ public static ValueTask<bool> BitMarkdownViewerCheckScriptLoaded(this IJSRuntime
         return jsRuntime.FastInvoke<bool>("BitBlazorUI.MarkdownViewer.checkScriptLoaded", script);
     }
 
-    public static ValueTask<string> BitMarkdownViewerParse(this IJSRuntime jsRuntime, string markdown)
+    public static ValueTask<string> BitMarkdownViewerParse(this IJSRuntime jsRuntime, string markdown, string? middleware)
     {
-        return OperatingSystem.IsBrowser()
+        return OperatingSystem.IsBrowser() && middleware.HasNoValue()
             ? jsRuntime.FastInvoke<string>("BitBlazorUI.MarkdownViewer.parse", markdown)
-            : jsRuntime.Invoke<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown);
+            : jsRuntime.Invoke<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown, middleware);
     }
 }
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Scripts/Extras.ts b/src/BlazorUI/Bit.BlazorUI.Extras/Scripts/Extras.ts
index 0a5457f3bc..55601f6233 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Scripts/Extras.ts
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Scripts/Extras.ts
@@ -92,5 +92,38 @@ namespace BitBlazorUI {
                 })
             }
         }
+
+
+        public static invokeJs<T>(identifier: string, ...args: unknown[]): Promise<T> {
+            identifier ??= '';
+            identifier = identifier.trim();
+
+            if (!identifier || identifier.length === 0) {
+                throw new Error("Identifier must not be empty.");
+            }
+
+            const parts = identifier.split(".");
+
+            let target = globalThis as unknown;
+
+            const startIndex = parts[0] === "window" ? 1 : 0;
+
+            for (let i = startIndex; i < parts.length - 1; i++) {
+                const part = parts[i];
+                if (target == null || typeof target !== "object") {
+                    throw new Error(`Cannot read property '${part}' of ${target}`);
+                }
+                target = (target as Record<string, unknown>)[part];
+            }
+
+            const fnName = parts[parts.length - 1];
+            const fn = (target as Record<string, unknown>)[fnName];
+
+            if (typeof fn !== "function") {
+                throw new Error(`'${identifier}' is not a function.`);
+            }
+
+            return Promise.resolve(fn.apply(target, args) as T);
+        }
     }
 }
\ No newline at end of file
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs b/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
index 43e73710ae..9195669be7 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
@@ -18,7 +18,26 @@ public class BitMarkdownService(IJSRuntime js, IServiceProvider serviceProvider)
 
 
 
-    public async Task<string> Parse(string? markdown, CancellationToken cancellationToken)
+    /// <summary>
+    /// Parses the given markdown string into an HTML string.
+    /// </summary>
+    /// <param name="markdown">The markdown string to parse.</param>
+    /// <param name="cancellationToken">A token to cancel the operation.</param>
+    public Task<string> Parse(string? markdown, CancellationToken cancellationToken)
+    {
+        return Parse(markdown, null, null, cancellationToken);
+    }
+
+    /// <summary>
+    /// Parses the given markdown string into an HTML string, then applies JavaScript and C# middlewares in order.
+    /// JavaScript middleware is invoked via JS interop and is skipped during server-side prerendering.
+    /// C# middleware is always applied regardless of rendering mode.
+    /// </summary>
+    /// <param name="markdown">The markdown string to parse.</param>
+    /// <param name="jsMiddleware">Optional JavaScript middleware identifier (fully qualified JS function path) to invoke via JS interop after parsing.</param>
+    /// <param name="csMiddleware">Optional C# middleware to apply after the JavaScript middleware.</param>
+    /// <param name="cancellationToken">A token to cancel the operation.</param>
+    public async Task<string> Parse(string? markdown, string? jsMiddleware, Func<string, string>? csMiddleware, CancellationToken cancellationToken)
     {
         if (markdown.HasNoValue()) return string.Empty;
 
@@ -29,6 +48,8 @@ public async Task<string> Parse(string? markdown, CancellationToken cancellation
             try
             {
                 html = await Task.Run(async () => await RunJint(markdown, cancellationToken), cancellationToken);
+
+                // js middlewares can't be executed on the server (for now)!
             }
             catch (FileNotFoundException ex) when (ex.FileName?.StartsWith("Jint") is true)
             {
@@ -46,7 +67,19 @@ public async Task<string> Parse(string? markdown, CancellationToken cancellation
                 await js.BitExtrasInitScripts([MARKED_FILE]);
             }
 
-            html = await js.BitMarkdownViewerParse(markdown!);
+            html = await js.BitMarkdownViewerParse(markdown!, jsMiddleware);
+        }
+
+        if (csMiddleware is not null)
+        {
+            try
+            {
+                html = csMiddleware(html);
+            }
+            catch (Exception ex)
+            {
+                Console.Error.WriteLine(ex.Message);
+            }
         }
 
         return html;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
index 5bcd1e5946..492da4c6ac 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
@@ -4,6 +4,16 @@ public partial class BitMarkdownViewerDemo
 {
     private readonly List<ComponentParameter> componentParameters =
     [
+        new()
+        {
+           Name = "JsMiddlewareIdentifier",
+           Type = "string?",
+           DefaultValue = "null",
+           Description = @"The fully qualified JavaScript function identifier to invoke as JavaScript middleware after parsing.
+                           The string should reference a global JS function (e.g. <c>""myApp.sanitizeHtml""</c>) that accepts
+                           an HTML string and returns the processed HTML string.
+                           JavaScript middleware is skipped during server-side prerendering.",
+        },
         new()
         {
            Name = "Markdown",
@@ -12,6 +22,15 @@ public partial class BitMarkdownViewerDemo
            Description = "The Markdown string value to render as an html element.",
         },
         new()
+        {
+           Name = "Middleware",
+           Type = "Func<string, string>?",
+           DefaultValue = "null",
+           Description = @"The C# function to run after parsing markdown and before rendering HTML.
+                           The middleware receives the parsed HTML string and returns the processed HTML string.
+                           C# middleware is applied after JavaScript middleware.",
+        },
+        new()
         {
            Name = "OnParsing",
            Type = "EventCallback<string?>",
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
index 9ac8cf36d8..6e089cc795 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
@@ -21,7 +21,7 @@ private void SetupMarkdownInterop(string markdown, string html)
     {
         Context.JSInterop.SetupVoid("BitBlazorUI.Extras.initScripts");
         Context.JSInterop.Setup<string>("BitBlazorUI.MarkdownViewer.parse", markdown).SetResult(html);
-        Context.JSInterop.Setup<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown).SetResult(html);
+        Context.JSInterop.Setup<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown, null).SetResult(html);
         Context.JSInterop.Setup<bool>("BitBlazorUI.MarkdownViewer.checkScriptLoaded", MARKED_FILE).SetResult(true);
     }
 
@@ -150,4 +150,98 @@ public void BitMarkdownViewerShouldRespectIsEnabled(bool isEnabled)
             Assert.IsTrue(root.ClassList.Contains("bit-dis"));
         }
     }
+
+    [TestMethod]
+    public void BitMarkdownViewerShouldApplyCSharpMiddleware()
+    {
+        var markdown = "middleware";
+        var html = "<p>middleware</p>";
+        var processedHtml = "<p>middleware-processed</p>";
+
+        SetupMarkdownInterop(markdown, html);
+
+        var middlewareCalled = false;
+
+        string middleware(string input)
+        {
+            middlewareCalled = input == html;
+            return processedHtml;
+        }
+
+        var component = RenderComponent<BitMarkdownViewer>(parameters =>
+        {
+            parameters.Add(p => p.Markdown, markdown);
+            parameters.Add(p => p.Middleware, middleware);
+        });
+
+        component.WaitForAssertion(() =>
+        {
+            Assert.IsTrue(middlewareCalled);
+            Assert.Contains(processedHtml, component.Markup);
+        });
+    }
+
+    [TestMethod]
+    public void BitMarkdownViewerShouldApplyJsMiddleware()
+    {
+        var markdown = "js-middleware";
+        var html = "<p>js-middleware</p>";
+        var processedHtml = "<p>js-processed</p>";
+        var jsMiddleware = "myApp.sanitize";
+
+        SetupMarkdownInterop(markdown, html);
+        Context.JSInterop.Setup<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown, jsMiddleware).SetResult(processedHtml);
+
+        var component = RenderComponent<BitMarkdownViewer>(parameters =>
+        {
+            parameters.Add(p => p.Markdown, markdown);
+            parameters.Add(p => p.JsMiddlewareIdentifier, jsMiddleware);
+        });
+
+        component.WaitForAssertion(() =>
+        {
+            Assert.Contains(processedHtml, component.Markup);
+        });
+    }
+
+    [TestMethod]
+    public void BitMarkdownViewerShouldApplyJsThenCSharpMiddleware()
+    {
+        var markdown = "combined-middleware";
+        var html = "<p>combined-middleware</p>";
+        var jsProcessedHtml = "<p>combined-middleware-js-processed</p>";
+        var csharpProcessedHtml = "<p>combined-middleware-csharp-processed</p>";
+        var jsMiddleware = "myApp.sanitize";
+
+        SetupMarkdownInterop(markdown, html);
+
+        Context.JSInterop
+            .Setup<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown, jsMiddleware)
+            .SetResult(jsProcessedHtml);
+
+        var middlewareCalled = false;
+        string? middlewareInput = null;
+
+        string csMiddleware(string input)
+        {
+            middlewareCalled = true;
+            middlewareInput = input;
+            return csharpProcessedHtml;
+        }
+
+        var component = RenderComponent<BitMarkdownViewer>(parameters =>
+        {
+            parameters.Add(p => p.Markdown, markdown);
+            parameters.Add(p => p.JsMiddlewareIdentifier, jsMiddleware);
+            parameters.Add(p => p.Middleware, csMiddleware);
+        });
+
+        component.WaitForAssertion(() =>
+        {
+            Assert.IsTrue(middlewareCalled);
+            Assert.AreEqual(jsProcessedHtml, middlewareInput);
+            Assert.Contains(csharpProcessedHtml, component.Markup);
+        });
+    }
 }
+

From 9d641bf17944975e30d2d4a299bcacb1d6e04fd3 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 15 Mar 2026 21:43:18 +0330
Subject: [PATCH 46/66] feat(blazorui): add new Icon parameters to BitPersona
 #12168 (#12169)

---
 .../Notifications/Persona/BitPersona.razor    |  61 +++++--
 .../Notifications/Persona/BitPersona.razor.cs |  71 ++++++--
 .../Persona/BitPersonaDemo.razor              |  88 ++++++++--
 .../Persona/BitPersonaDemo.razor.cs           |  76 ++++++++-
 .../Persona/BitPersonaDemo.razor.samples.cs   |  90 +++++++++-
 .../Notifications/Persona/BitPersonaTests.cs  | 160 +++++++++++++++++-
 6 files changed, 491 insertions(+), 55 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor
index d5b4cad271..57406f1597 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor
@@ -1,8 +1,11 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 @{
+    var presentationIconName = GetPresentationIconName();
     var presentationIcon = GetPresentationIcon();
+
+    var presenceIconInfo = BitIconInfo.From(presentationIcon, presentationIconName);
 }
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -16,11 +19,18 @@
         {
             if (Presence is BitPersonaPresence.None)
             {
-                <i style="@Styles?.PresentationIcon" class="bit-prs-pic bit-icon bit-icon--@presentationIcon @Classes?.PresentationIcon" role="presentation" />
+                @if (presenceIconInfo is not null)
+                {
+                    <i role="presentation"
+                       style="@Styles?.PresentationIcon"
+                       class="bit-prs-pic @presenceIconInfo.GetCssClasses() @Classes?.PresentationIcon" />
+                }
             }
             else
             {
-                <div style="@Styles?.Presentation" title="@PresenceTitle" class="bit-prs-pre @GetPresentationClass() @Classes?.Presentation"></div>
+                <div title="@PresenceTitle"
+                     style="@Styles?.Presentation"
+                     class="bit-prs-pre @GetPresentationClass() @Classes?.Presentation"></div>
             }
         }
         else
@@ -64,14 +74,14 @@
                         {
                             var dimension = GetPersonaImageDimension();
 
-                            <img src="@ImageUrl"
-                                 style="display:@(_isLoaded ? "unset": "none");@Styles?.Image"
-                                 class="bit-prs-img @Classes?.Image"
+                            <img @onload="HandleOnLoad"
+                                 @onerror="HandleOnError"
+                                 src="@ImageUrl"
                                  alt="@ImageAlt"
                                  width="@dimension"
                                  height="@dimension"
-                                 @onerror="HandleOnError"
-                                 @onload="HandleOnLoad" />
+                                 class="bit-prs-img @Classes?.Image"
+                                 style="display:@(_isLoaded ? "unset" : "none");@Styles?.Image" />
                         }
                     }
                 }
@@ -91,17 +101,28 @@
                 }
                 else
                 {
-                    <button @onclick="HandleActionClick" type="button" style="@Styles?.ActionButton" class="bit-prs-abt @Classes?.ActionButton" title="@ActionButtonTitle">
-                        <i style="@Styles?.ActionButtonIcon" class="bit-prs-aic bit-icon bit-icon--@ActionIconName @Classes?.ActionButtonIcon" />
+                    var actionIcon = BitIconInfo.From(ActionIcon, ActionIconName ?? "Edit");
+                    <button @onclick="HandleActionClick"
+                            type="button"
+                            title="@ActionButtonTitle"
+                            style="@Styles?.ActionButton"
+                            class="bit-prs-abt @Classes?.ActionButton">
+                        @if (actionIcon is not null)
+                        {
+                            <i style="@Styles?.ActionButtonIcon"
+                               class="bit-prs-aic @actionIcon.GetCssClasses() @Classes?.ActionButtonIcon" />
+                        }
                     </button>
                 }
             }
             else if (Presence is not BitPersonaPresence.None)
             {
                 <div title="@PresenceTitle" style="@GetPresentationStyle()" class="bit-prs-pre @GetPresentationClass() @Classes?.Presence">
-                    @if (presentationIcon.HasValue())
+                    @if (presenceIconInfo is not null)
                     {
-                        <i style="@Styles?.PresentationIcon" class="bit-icon bit-icon--@presentationIcon @Classes?.PresentationIcon" role="presentation" />
+                        <i role="presentation"
+                           style="@Styles?.PresentationIcon"
+                           class="@presenceIconInfo?.GetCssClasses() @Classes?.PresentationIcon" />
                     }
                 </div>
             }
@@ -111,7 +132,9 @@
     @if (HidePersonaDetails is false || Size is BitPersonaSize.Size8)
     {
         <div style="@Styles?.DetailsContainer" class="bit-prs-det @Classes?.DetailsContainer">
-            <div style="@Styles?.PrimaryTextContainer" class="bit-prs-ptx @Classes?.PrimaryTextContainer" title="@PrimaryText">
+            <div title="@PrimaryText"
+                 style="@Styles?.PrimaryTextContainer"
+                 class="bit-prs-ptx @Classes?.PrimaryTextContainer">
                 @if (PrimaryTextTemplate is not null)
                 {
                     @PrimaryTextTemplate
@@ -121,7 +144,9 @@
                     @PrimaryText
                 }
             </div>
-            <div style="@Styles?.SecondaryTextContainer" class="bit-prs-stx @Classes?.SecondaryTextContainer" title="@SecondaryText">
+            <div title="@SecondaryText"
+                 style="@Styles?.SecondaryTextContainer"
+                 class="bit-prs-stx @Classes?.SecondaryTextContainer">
                 @if (SecondaryTextTemplate is not null)
                 {
                     @SecondaryTextTemplate
@@ -131,7 +156,9 @@
                     @SecondaryText
                 }
             </div>
-            <div style="@Styles?.TertiaryTextContainer" class="bit-prs-ttx @Classes?.TertiaryTextContainer" title="@TertiaryText">
+            <div title="@TertiaryText"
+                 style="@Styles?.TertiaryTextContainer"
+                 class="bit-prs-ttx @Classes?.TertiaryTextContainer">
                 @if (TertiaryTextTemplate is not null)
                 {
                     @TertiaryTextTemplate
@@ -141,7 +168,9 @@
                     @TertiaryText
                 }
             </div>
-            <div style="@Styles?.OptionalTextContainer" class="bit-prs-otx @Classes?.OptionalTextContainer" title="@OptionalText">
+            <div title="@OptionalText"
+                 style="@Styles?.OptionalTextContainer"
+                 class="bit-prs-otx @Classes?.OptionalTextContainer">
                 @if (OptionalTextTemplate is not null)
                 {
                     @OptionalTextTemplate
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor.cs
index 976235ffca..dee9dfb4f6 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Persona/BitPersona.razor.cs
@@ -15,10 +15,23 @@ public partial class BitPersona : BitComponentBase
     /// </summary>
     [Parameter] public string ActionButtonTitle { get; set; } = "Edit image";
 
+    /// <summary>
+    /// Icon for the icon button of the custom action.
+    /// </summary>
+    /// <remarks>
+    /// When both <see cref="ActionIcon"/> and <see cref="ActionIconName"/> are provided, <see cref="ActionIcon"/> takes precedence.
+    /// Use this property when you need to configure an external or custom icon (for example, when using a custom icon font or SVG).
+    /// </remarks>
+    [Parameter] public BitIconInfo? ActionIcon { get; set; }
+
     /// <summary>
     /// Icon name for the icon button of the custom action.
     /// </summary>
-    [Parameter] public string? ActionIconName { get; set; } = "Edit";
+    /// <remarks>
+    /// This is a convenience property for specifying an icon from the built-in icon set.
+    /// If <see cref="ActionIcon"/> is specified, this property is ignored and the value of <see cref="ActionIcon"/> will be used instead.
+    /// </remarks>
+    [Parameter] public string? ActionIconName { get; set; }
 
     /// <summary>
     /// Optional Custom template for the custom action element.
@@ -123,9 +136,45 @@ public partial class BitPersona : BitComponentBase
     [Parameter] public BitPersonaPresence Presence { get; set; }
 
     /// <summary>
-    /// The icons to be used for the presence status.
-    /// </summary>
-    [Parameter] public Dictionary<BitPersonaPresence, string>? PresenceIcons { get; set; }
+    /// The icons to be used for the presence status with <see cref="BitIconInfo"/>.
+    /// </summary>
+    /// <remarks>
+    /// When both <see cref="PresenceIcons"/> and <see cref="PresenceIconNames"/> are provided, entries in
+    /// <see cref="PresenceIcons"/> take precedence for the same <see cref="BitPersonaPresence"/> key.
+    /// Use this dictionary when you need to configure presence icons using full <see cref="BitIconInfo"/> metadata
+    /// (for example, to use custom icon sources or other advanced icon settings supported by <see cref="BitIconInfo"/>).
+    /// <para>
+    /// Example:
+    /// <code>
+    /// PresenceIcons = new()
+    /// {
+    ///     [BitPersonaPresence.Online] = new BitIconInfo { Name = "SkypeCircleCheck" },
+    ///     [BitPersonaPresence.Offline] = new BitIconInfo { Name = "SkypeCircleMinus" }
+    /// };
+    /// </code>
+    /// </para>
+    /// </remarks>
+    [Parameter] public Dictionary<BitPersonaPresence, BitIconInfo>? PresenceIcons { get; set; }
+
+    /// <summary>
+    /// The icon names to be used for the presence status.
+    /// </summary>
+    /// <remarks>
+    /// This dictionary is intended for simple scenarios where built-in icon names are sufficient.
+    /// For any <see cref="BitPersonaPresence"/> value that also exists in <see cref="PresenceIcons"/>,
+    /// the corresponding entry in <see cref="PresenceIconNames"/> is ignored.
+    /// <para>
+    /// Example:
+    /// <code>
+    /// PresenceIconNames = new()
+    /// {
+    ///     [BitPersonaPresence.Online] = "SkypeCircleCheck",
+    ///     [BitPersonaPresence.Away] = "SkypeCircleClock"
+    /// };
+    /// </code>
+    /// </para>
+    /// </remarks>
+    [Parameter] public Dictionary<BitPersonaPresence, string>? PresenceIconNames { get; set; }
 
     /// <summary>
     /// Presence title to be shown as a tooltip on hover over the presence icon.
@@ -287,16 +336,18 @@ protected override void RegisterCssStyles()
         return FormattableString.Invariant($"width:{presentationSize}px;height:{presentationSize}px;{position}{Styles?.Presence?.Trim(';')}");
     }
 
-    private string? GetPresentationIcon()
+    private BitIconInfo? GetPresentationIcon()
     {
         if (Size is BitPersonaSize.Size8 or BitPersonaSize.Size24 or BitPersonaSize.Size32) return null;
 
-        if (PresenceIcons?.ContainsKey(Presence) ?? false)
-        {
-            return PresenceIcons[Presence];
-        }
+        return PresenceIcons?.TryGetValue(Presence, out var icon) is true ? icon : null;
+    }
+
+    private string? GetPresentationIconName()
+    {
+        if (Size is BitPersonaSize.Size8 or BitPersonaSize.Size24 or BitPersonaSize.Size32) return null;
 
-        return null;
+        return PresenceIconNames?.TryGetValue(Presence, out var iconName) is true ? iconName : null;
     }
 
     private string? GetCoinClass()
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor
index cf8f3751de..0bb006dc65 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/persona"
+@page "/components/persona"
 
 <PageOutlet Url="components/persona"
             Title="Persona"
@@ -183,7 +183,7 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.None"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         <br /><br /><br /><br />
@@ -191,7 +191,7 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.Offline"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         <br /><br /><br /><br />
@@ -199,7 +199,7 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.Online"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         <br /><br /><br /><br />
@@ -207,7 +207,7 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.Away"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         <br /><br /><br /><br />
@@ -215,7 +215,7 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.Dnd"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         <br /><br /><br /><br />
@@ -230,12 +230,12 @@
         <BitPersona PrimaryText="Annie Lindqvist"
                     SecondaryText="Software Engineer"
                     Presence="BitPersonaPresence.Busy"
-                    PresenceIcons="_icons"
+                    PresenceIconNames="_iconNames"
                     Size="BitPersonaSize.Size120"
                     ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
     </DemoExample>
 
-    <DemoExample Title="Reversed" RazorCode="@example8RazorCode" Id="example8">
+    <DemoExample Title="Reversed" RazorCode="@example8RazorCode" CsharpCode="@example8CsharpCode" Id="example8">
         <div>Adjust the texts position of BitPersona's image to be reversed.</div>
         <br />
         <div>
@@ -243,7 +243,7 @@
                         PrimaryText="Annie Lindqvist"
                         SecondaryText="Software Engineer"
                         Presence="BitPersonaPresence.Online"
-                        PresenceIcons="_icons"
+                        PresenceIconNames="_iconNames"
                         Size="BitPersonaSize.Size120"
                         ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
         </div>
@@ -328,7 +328,73 @@
         <BitPersona PrimaryText="TertiaryBorder" CoinColor="BitColor.TertiaryBorder" />
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example11RazorCode" Id="example11">
+    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" CsharpCode="@example11CsharpCode" Id="example11">
+        <div>
+            Use icons from external libraries like FontAwesome and Bootstrap Icons with the 
+            <b>ActionIcon</b> and <b>PresenceIcons</b> parameters.
+        </div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome action icon (hover over the image):</div>
+        <br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    TertiaryText="In a meeting"
+                    OptionalText="Available at 4:00pm"
+                    Size="BitPersonaSize.Size120"
+                    Presence="BitPersonaPresence.None"
+                    OnActionClick="() => actionClickCount++"
+                    ActionIcon="@BitIconInfo.Fa("solid camera")"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+        <p>Action Click Count: @actionClickCount</p>
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap Icons presence icons:</div>
+        <br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    Presence="BitPersonaPresence.Online"
+                    PresenceIcons="_icons"
+                    Size="BitPersonaSize.Size120"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+        <br /><br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    Presence="BitPersonaPresence.Busy"
+                    PresenceIcons="_icons"
+                    Size="BitPersonaSize.Size120"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+        <br /><br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    Presence="BitPersonaPresence.Away"
+                    PresenceIcons="_icons"
+                    Size="BitPersonaSize.Size120"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+        <br /><br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    Presence="BitPersonaPresence.Dnd"
+                    PresenceIcons="_icons"
+                    Size="BitPersonaSize.Size120"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+        <br /><br />
+        <BitPersona PrimaryText="Annie Lindqvist"
+                    SecondaryText="Software Engineer"
+                    Presence="BitPersonaPresence.Offline"
+                    PresenceIcons="_icons"
+                    Size="BitPersonaSize.Size120"
+                    ImageUrl="/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png" />
+    </DemoExample>
+
+    <DemoExample Title="Style &amp; Class" RazorCode="@example12RazorCode" Id="example12">
         <div>Component's Style & Class:</div><br />
         <BitPersona PrimaryText="Saleh Khafan"
                     Size="BitPersonaSize.Size72"
@@ -350,7 +416,7 @@
                                                PrimaryTextContainer = "custom-primary-text" })" />
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="RTL" RazorCode="@example13RazorCode" Id="example13">
         <div dir="rtl">
             <BitPersona Dir="BitDir.Rtl"
                         PrimaryText="صالح یوسف نژاد"
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.cs
index 0368185548..45455b3b36 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.cs
@@ -12,6 +12,15 @@ public partial class BitPersonaDemo
             Description = "The title of the action button (tooltip).",
         },
         new()
+        {
+            Name = "ActionIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Icon for the icon button of the custom action using BitIconInfo. Takes precedence over ActionIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "ActionIconName",
             Type = "string?",
@@ -157,9 +166,18 @@ public partial class BitPersonaDemo
         new()
         {
             Name = "PresenceIcons",
+            Type = "Dictionary<BitPersonaPresence, BitIconInfo>?",
+            DefaultValue = "null",
+            Description = "The icons to be used for the presence status with BitIconInfo. Takes precedence over PresenceIconNames when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PresenceIconNames",
             Type = "Dictionary<BitPersonaPresence, string>?",
             DefaultValue = "null",
-            Description = "The icons to be used for the presence status.",
+            Description = "The icon names to be used for the presence status.",
         },
         new()
         {
@@ -386,6 +404,38 @@ public partial class BitPersonaDemo
                     Description = "Custom CSS classes/styles for the optional text container of the BitPersona."
                 }
             ]
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = @"Gets or sets the name of the icon. 
+                                   For external icons, this can be the full CSS class name if ""BaseClass"" and ""Prefix"" are empty."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = @"Gets or sets the base CSS class for the icon.
+                                   For external icon libraries like FontAwesome, you might set this to ""fa"" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = @"Gets or sets the CSS class prefix used before the icon name.
+                                   For external icon libraries, you might set this to ""fa-"" or leave empty."
+               },
+            ]
         }
     ];
 
@@ -662,13 +712,23 @@ public partial class BitPersonaDemo
     private int actionClickCount = 0;
     private bool isDetailsShown = true;
 
-    private Dictionary<BitPersonaPresence, string> _icons = new()
+    private readonly Dictionary<BitPersonaPresence, BitIconInfo> _icons = new()
+    {
+        { BitPersonaPresence.Offline, BitIconInfo.Bi("wifi-off") },
+        { BitPersonaPresence.Online, BitIconInfo.Bi("check-circle-fill") },
+        { BitPersonaPresence.Away, BitIconInfo.Bi("clock-fill") },
+        { BitPersonaPresence.Dnd, BitIconInfo.Bi("dash-circle-fill") },
+        { BitPersonaPresence.Blocked, BitIconInfo.Bi("ban") },
+        { BitPersonaPresence.Busy, BitIconInfo.Bi("exclamation-circle-fill") },
+    };
+
+    private readonly Dictionary<BitPersonaPresence, string> _iconNames = new()
     {
-        {BitPersonaPresence.Offline, BitIconName.UnavailableOffline},
-        {BitPersonaPresence.Online, BitIconName.SkypeCheck},
-        {BitPersonaPresence.Away, BitIconName.SkypeClock},
-        {BitPersonaPresence.Dnd, BitIconName.SkypeMinus},
-        {BitPersonaPresence.Blocked, BitIconName.BlockedSolid},
-        {BitPersonaPresence.Busy, BitIconName.Blocked2Solid}
+        { BitPersonaPresence.Offline, BitIconName.UnavailableOffline },
+        { BitPersonaPresence.Online, BitIconName.SkypeCheck },
+        { BitPersonaPresence.Away, BitIconName.SkypeClock },
+        { BitPersonaPresence.Dnd, BitIconName.SkypeMinus },
+        { BitPersonaPresence.Blocked, BitIconName.BlockedSolid },
+        { BitPersonaPresence.Busy, BitIconName.Blocked2Solid },
     };
 }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.samples.cs
index 6c061296b1..49fc6f0af0 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Persona/BitPersonaDemo.razor.samples.cs
@@ -156,7 +156,7 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.None""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />
 
@@ -164,7 +164,7 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Offline""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />
 
@@ -172,7 +172,7 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Online""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />
 
@@ -180,7 +180,7 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Away""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />
 
@@ -188,7 +188,7 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Dnd""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />
 
@@ -203,11 +203,11 @@ public partial class BitPersonaDemo
 <BitPersona PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Busy""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/images/persona/persona-female.png"" />";
     private readonly string example7CsharpCode = @"
-private Dictionary<BitPersonaPresence, string> _icons = new()
+private readonly Dictionary<BitPersonaPresence, string> _iconNames = new()
 {
     {BitPersonaPresence.Offline, BitIconName.UnavailableOffline},
     {BitPersonaPresence.Online, BitIconName.SkypeCheck},
@@ -222,9 +222,19 @@ public partial class BitPersonaDemo
             PrimaryText=""Annie Lindqvist""
             SecondaryText=""Software Engineer""
             Presence=""BitPersonaPresence.Online""
-            PresenceIcons=""_icons""
+            PresenceIconNames=""_iconNames""
             Size=""BitPersonaSize.Size120""
             ImageUrl=""/_content/Bit.BlazorUI.Demo.Client.Core/images/persona/persona-female.png"" />";
+    private readonly string example8CsharpCode = @"
+private readonly Dictionary<BitPersonaPresence, string> _iconNames = new()
+{
+    {BitPersonaPresence.Offline, BitIconName.UnavailableOffline},
+    {BitPersonaPresence.Online, BitIconName.SkypeCheck},
+    {BitPersonaPresence.Away, BitIconName.SkypeClock},
+    {BitPersonaPresence.Dnd, BitIconName.SkypeMinus},
+    {BitPersonaPresence.Blocked, BitIconName.BlockedSolid},
+    {BitPersonaPresence.Busy, BitIconName.Blocked2Solid}
+};";
 
 
     private readonly string example9RazorCode = @"
@@ -292,6 +302,68 @@ Edit image
 <BitPersona PrimaryText=""TertiaryBorder"" CoinColor=""BitColor.TertiaryBorder"" />";
 
     private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            TertiaryText=""In a meeting""
+            OptionalText=""Available at 4:00pm""
+            Size=""BitPersonaSize.Size120""
+            Presence=""BitPersonaPresence.None""
+            OnActionClick=""() => actionClickCount++""
+            ActionIcon=""@BitIconInfo.Fa(""solid camera"")""
+            ImageUrl=""/images/persona/persona-female.png"" />
+<p>Action Click Count: @actionClickCount</p>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            Presence=""BitPersonaPresence.Online""
+            PresenceIcons=""_icons""
+            Size=""BitPersonaSize.Size120""
+            ImageUrl=""/images/persona/persona-female.png"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            Presence=""BitPersonaPresence.Busy""
+            PresenceIcons=""_icons""
+            Size=""BitPersonaSize.Size120""
+            ImageUrl=""/images/persona/persona-female.png"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            Presence=""BitPersonaPresence.Away""
+            PresenceIcons=""_icons""
+            Size=""BitPersonaSize.Size120""
+            ImageUrl=""/images/persona/persona-female.png"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            Presence=""BitPersonaPresence.Dnd""
+            PresenceIcons=""_icons""
+            Size=""BitPersonaSize.Size120""
+            ImageUrl=""/images/persona/persona-female.png"" />
+
+<BitPersona PrimaryText=""Annie Lindqvist""
+            SecondaryText=""Software Engineer""
+            Presence=""BitPersonaPresence.Offline""
+            PresenceIcons=""_icons""
+            Size=""BitPersonaSize.Size120""
+            ImageUrl=""/images/persona/persona-female.png"" />";
+    private readonly string example11CsharpCode = @"
+private readonly Dictionary<BitPersonaPresence, BitIconInfo> _icons = new()
+{
+    {BitPersonaPresence.Offline, BitIconInfo.Bi(""wifi-off"")},
+    {BitPersonaPresence.Online, BitIconInfo.Bi(""check-circle-fill"")},
+    {BitPersonaPresence.Away, BitIconInfo.Bi(""clock-fill"")},
+    {BitPersonaPresence.Dnd, BitIconInfo.Bi(""dash-circle-fill"")},
+    {BitPersonaPresence.Blocked, BitIconInfo.Bi(""ban"")},
+    {BitPersonaPresence.Busy, BitIconInfo.Bi(""exclamation-circle-fill"")}
+};";
+
+    private readonly string example12RazorCode = @"
 <style>
     .custom-class {
         padding: 1rem;
@@ -330,7 +402,7 @@ Edit image
             Classes=""@(new() { ImageContainer = ""custom-img-container"",
                                PrimaryTextContainer = ""custom-primary-text"" })"" />";
 
-    private readonly string example12RazorCode = @"
+    private readonly string example13RazorCode = @"
 <BitPersona Dir=""BitDir.Rtl""
             PrimaryText=""صالح یوسف نژاد""
             SecondaryText=""مهندس نرم افزار""
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Persona/BitPersonaTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Persona/BitPersonaTests.cs
index 4f1a966051..cd73b7a3ca 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Persona/BitPersonaTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Persona/BitPersonaTests.cs
@@ -1,5 +1,8 @@
-using Microsoft.VisualStudio.TestTools.UnitTesting;
+using System.Collections.Generic;
 using Bunit;
+using Microsoft.AspNetCore.Components;
+using Microsoft.AspNetCore.Components.Web;
+using Microsoft.VisualStudio.TestTools.UnitTesting;
 
 namespace Bit.BlazorUI.Tests.Components.Notifications.Persona;
 
@@ -119,4 +122,159 @@ public void BitPersonaPresenceTitleTest(string presenceTitle, BitPersonaPresence
 
         Assert.AreEqual(presenceTitle, title);
     }
+
+    [TestMethod]
+    public void BitPersonaShouldRenderActionIconCssClassesFromBitIconInfo()
+    {
+        var actionIcon = new BitIconInfo("camera", "fa", "fa-");
+
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            parameters.Add(p => p.OnActionClick, EventCallback.Factory.Create<MouseEventArgs>(this, () => { }));
+            parameters.Add(p => p.ActionIcon, actionIcon);
+            parameters.Add(p => p.Size, BitPersonaSize.Size120);
+        });
+
+        var iconEl = component.Find(".bit-prs-aic");
+
+        Assert.IsTrue(iconEl.ClassList.Contains("fa"));
+        Assert.IsTrue(iconEl.ClassList.Contains("fa-camera"));
+    }
+
+    [TestMethod]
+    public void BitPersonaActionIconShouldTakePrecedenceOverActionIconName()
+    {
+        var actionIcon = BitIconInfo.Bi("pencil-fill");
+
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            parameters.Add(p => p.OnActionClick, EventCallback.Factory.Create<MouseEventArgs>(this, () => { }));
+            parameters.Add(p => p.ActionIcon, actionIcon);
+            parameters.Add(p => p.ActionIconName, "Edit");
+            parameters.Add(p => p.Size, BitPersonaSize.Size120);
+        });
+
+        var iconEl = component.Find(".bit-prs-aic");
+
+        Assert.IsTrue(iconEl.ClassList.Contains("bi"));
+        Assert.IsTrue(iconEl.ClassList.Contains("bi-pencil-fill"));
+        Assert.IsFalse(iconEl.ClassList.Contains("bit-icon"));
+    }
+
+    [TestMethod,
+        DataRow(BitPersonaPresence.Online, "check-circle-fill"),
+        DataRow(BitPersonaPresence.Offline, "wifi-off"),
+        DataRow(BitPersonaPresence.Away, "clock-fill"),
+        DataRow(BitPersonaPresence.Dnd, "dash-circle-fill"),
+        DataRow(BitPersonaPresence.Busy, "exclamation-circle-fill")
+    ]
+    public void BitPersonaShouldRenderPresenceIconCssClassesFromPresenceIcons(BitPersonaPresence presence, string iconName)
+    {
+        var iconsInfo = new Dictionary<BitPersonaPresence, BitIconInfo>
+        {
+            { BitPersonaPresence.Online, BitIconInfo.Bi("check-circle-fill") },
+            { BitPersonaPresence.Offline, BitIconInfo.Bi("wifi-off") },
+            { BitPersonaPresence.Away, BitIconInfo.Bi("clock-fill") },
+            { BitPersonaPresence.Dnd, BitIconInfo.Bi("dash-circle-fill") },
+            { BitPersonaPresence.Busy, BitIconInfo.Bi("exclamation-circle-fill") }
+        };
+
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            parameters.Add(p => p.Presence, presence);
+            parameters.Add(p => p.PresenceIcons, iconsInfo);
+            parameters.Add(p => p.Size, BitPersonaSize.Size48);
+        });
+
+        var iconEl = component.Find(".bit-prs-pre i");
+
+        Assert.IsTrue(iconEl.ClassList.Contains("bi"));
+        Assert.IsTrue(iconEl.ClassList.Contains($"bi-{iconName}"));
+    }
+
+    [TestMethod]
+    public void BitPersonaPresenceIconsShouldTakePrecedenceOverPresenceIconNames()
+    {
+        var iconsInfo = new Dictionary<BitPersonaPresence, BitIconInfo>
+        {
+            { BitPersonaPresence.Online, BitIconInfo.Bi("check-circle-fill") }
+        };
+
+        var icons = new Dictionary<BitPersonaPresence, string>
+        {
+            { BitPersonaPresence.Online, "SkypeCheck" }
+        };
+
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            parameters.Add(p => p.Presence, BitPersonaPresence.Online);
+            parameters.Add(p => p.PresenceIcons, iconsInfo);
+            parameters.Add(p => p.PresenceIconNames, icons);
+            parameters.Add(p => p.Size, BitPersonaSize.Size48);
+        });
+
+        var iconEl = component.Find(".bit-prs-pre i");
+
+        Assert.IsTrue(iconEl.ClassList.Contains("bi"));
+        Assert.IsTrue(iconEl.ClassList.Contains("bi-check-circle-fill"));
+        Assert.IsFalse(iconEl.ClassList.Contains("bit-icon"));
+    }
+
+    [TestMethod]
+    public void BitPersonaShouldFallbackToPresenceIconNamesWhenPresenceIconsDoesNotContainPresence()
+    {
+        var icons = new Dictionary<BitPersonaPresence, BitIconInfo>
+        {
+            // Only Online is defined in PresenceIcons; Offline is intentionally missing.
+            { BitPersonaPresence.Online, BitIconInfo.Bi("check-circle-fill") }
+        };
+
+        var iconNames = new Dictionary<BitPersonaPresence, string>
+        {
+            // Offline is only defined in PresenceIconNames to verify the fallback behavior.
+            { BitPersonaPresence.Offline, "SkypeMinus" }
+        };
+
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            parameters.Add(p => p.Presence, BitPersonaPresence.Offline);
+            parameters.Add(p => p.PresenceIcons, icons);
+            parameters.Add(p => p.PresenceIconNames, iconNames);
+            parameters.Add(p => p.Size, BitPersonaSize.Size48);
+        });
+
+        var iconEl = component.Find(".bit-prs-pre i");
+
+        // When PresenceIcons has no mapping for the current Presence, the component
+        // should fall back to PresenceIconNames, which uses the BitIcon-based rendering.
+        Assert.IsTrue(iconEl.ClassList.Contains("bit-icon"));
+        Assert.IsFalse(iconEl.ClassList.Contains("bi"));
+    }
+
+    [TestMethod]
+    public void BitPersonaShouldRenderNoPresenceIconWhenNoMappingExists()
+    {
+        var icons = new Dictionary<BitPersonaPresence, BitIconInfo>
+        {
+            // Define a presence different from the one used in the test to keep it unmapped.
+            { BitPersonaPresence.Online, BitIconInfo.Bi("check-circle-fill") }
+        };
+
+        var iconNames = new Dictionary<BitPersonaPresence, string>();
+        
+        var component = RenderComponent<BitPersona>(parameters =>
+        {
+            // Use a presence that is not present in either dictionary.
+            parameters.Add(p => p.Presence, BitPersonaPresence.Busy);
+            parameters.Add(p => p.PresenceIcons, icons);
+            parameters.Add(p => p.PresenceIconNames, iconNames);
+            parameters.Add(p => p.Size, BitPersonaSize.Size48);
+        });
+        
+        var iconElements = component.FindAll(".bit-prs-pre i");
+        
+        // When neither PresenceIcons nor PresenceIconNames contains the current Presence,
+        // no presence icon should be rendered.
+        Assert.IsEmpty(iconElements);
+    }
 }

From fdcae81265c44e51f2fb320fddf89c1ade1223f9 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Mar 2026 00:27:10 +0330
Subject: [PATCH 47/66] feat(blazorui): remove redundant z-index from
 FulllWidth style of BitButton #12167 (#12171)

---
 .../Bit.BlazorUI/Components/Buttons/Button/BitButton.scss        | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
index fd19b00d45..706393d462 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Buttons/Button/BitButton.scss
@@ -100,7 +100,6 @@
 
 .bit-btn-flw {
     width: 100%;
-    z-index: $zindex-base;
 }
 
 .bit-btn-fab {

From 7f28b54e1677a7ef7af9fc015000318a4898642b Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Mar 2026 12:47:53 +0330
Subject: [PATCH 48/66] feat(blazorui): add new Icon parameter to BitSnackBar
 #12172 (#12173)

---
 .../Notifications/SnackBar/BitSnackBar.razor  |   7 +-
 .../SnackBar/BitSnackBar.razor.cs             |   5 +
 .../SnackBar/BitSnackBarDemo.razor            |  47 ++++++--
 .../SnackBar/BitSnackBarDemo.razor.cs         |  66 ++++++++++-
 .../SnackBar/BitSnackBarDemo.razor.samples.cs |  45 ++++++-
 .../SnackBar/BitSnackBarTests.cs              | 110 ++++++++++++++++++
 6 files changed, 267 insertions(+), 13 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor
index 490a40529a..752f7eeb53 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes"
@@ -19,7 +19,10 @@
                             type="button"
                             style="@Styles?.DismissButton"
                             class="bit-snb-cbt @Classes?.DismissButton">
-                        <i style="@Styles?.DismissIcon" class="bit-icon bit-icon--@(DismissIconName ?? "Cancel") @Classes?.DismissIcon" />
+                        @{
+                            var dismissIcon = BitIconInfo.From(DismissIcon, DismissIconName ?? "Cancel");
+                        }
+                        <i style="@Styles?.DismissIcon" class="@dismissIcon?.GetCssClasses() @Classes?.DismissIcon" />
                     </button>
                 }
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor.cs
index 37dad24f1d..3e49eb46ed 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/SnackBar/BitSnackBar.razor.cs
@@ -29,6 +29,11 @@ public partial class BitSnackBar : BitComponentBase
     /// </summary>
     [Parameter] public BitSnackBarClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The icon of the dismiss button.
+    /// </summary>
+    [Parameter] public BitIconInfo? DismissIcon { get; set; }
+
     /// <summary>
     /// The icon name of the dismiss button.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor
index 53110e676b..c8157a27bb 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/snackbar"
+@page "/components/snackbar"
 
 <PageOutlet Url="components/snackbar"
             Title="Snackbar"
@@ -114,7 +114,36 @@
         <BitButton OnClick="OpenBodyTemplate">Body Template</BitButton>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
+    <DemoExample Title="External Icons" RazorCode="@example5RazorCode" CsharpCode="@example5CsharpCode" Id="example5">
+        <div>
+            Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>DismissIcon</b> parameter.
+        </div>
+
+        <br /><br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitSnackBar @ref="dismissIconFaRef" DismissIcon="@BitIconInfo.Fa("solid xmark")" />
+        <BitButton OnClick="OpenDismissIconFa">FontAwesome dismiss icon</BitButton>
+        <br /><br />
+        <BitSnackBar @ref="dismissIconCssRef" DismissIcon="@BitIconInfo.Css("fa-solid fa-x")" />
+        <BitButton OnClick="OpenDismissIconCss">CSS classes dismiss icon</BitButton>
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitSnackBar @ref="dismissIconBiRef" DismissIcon="@BitIconInfo.Bi("x-lg")" />
+        <BitButton OnClick="OpenDismissIconBi">Bootstrap dismiss icon</BitButton>
+        <br /><br />
+        <BitSnackBar @ref="dismissIconImplicitRef" DismissIcon="@("bi bi-x-circle")" />
+        <BitButton OnClick="OpenDismissIconImplicit">Implicit CSS dismiss icon</BitButton>
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example6RazorCode" CsharpCode="@example6CsharpCode" Id="example6">
         <div>
             <div>Item's Style & Class:</div><br />
             <BitSnackBar @ref="snackBarStyleRef" />
@@ -126,13 +155,13 @@
             <div>Styles & Classes:</div><br />
             <BitSnackBar @ref="snackBarStylesRef"
                          Styles="@(new() { Container = "width: 16rem; background-color: purple;",
-                                               Header = "background-color: rebeccapurple; padding: 0.2rem;" })" />
-            <BitButton OnClick="OpenSnackBarStyles">Custom styles</BitButton>
-            <br /><br />
+                                     Header = "background-color: rebeccapurple; padding: 0.2rem;" })" />
+                <BitButton OnClick="OpenSnackBarStyles">Custom styles</BitButton>
+                <br /><br />
             <BitSnackBar @ref="snackBarClassesRef" AutoDismiss
                          Classes="@(new() { Container = "custom-container",
-                                                ProgressBar = "custom-progress" })" />
+                                     ProgressBar = "custom-progress" })" />
             <BitButton OnClick="OpenSnackBarClasses">Custom classes</BitButton>
-        </div>
-    </DemoExample>
-</DemoPage>
\ No newline at end of file
+            </div>
+            </DemoExample>
+                </DemoPage>
\ No newline at end of file
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.cs
index 2796147e56..283daf1d7c 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.cs
@@ -35,11 +35,20 @@ public partial class BitSnackBarDemo
             Href = "#class-styles",
         },
         new()
+        {
+            Name = "DismissIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon of the dismiss button using custom CSS classes for external icon libraries. Takes precedence over DismissIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
         {
             Name = "DismissIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon name of the dismiss button.",
+            Description = "The icon name of the dismiss button from the built-in Fluent UI icons.",
         },
         new()
         {
@@ -243,6 +252,35 @@ public partial class BitSnackBarDemo
 
     private readonly List<ComponentSubClass> componentSubClasses =
     [
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
         new()
         {
             Id = "class-styles",
@@ -501,6 +539,32 @@ private async Task OpenCustomizationSnackBar()
     }
 
 
+    private BitSnackBar dismissIconFaRef = default!;
+    private BitSnackBar dismissIconCssRef = default!;
+    private BitSnackBar dismissIconBiRef = default!;
+    private BitSnackBar dismissIconImplicitRef = default!;
+
+    private async Task OpenDismissIconFa()
+    {
+        await dismissIconFaRef.Info("Notification", "Click the FontAwesome dismiss icon to close.");
+    }
+
+    private async Task OpenDismissIconCss()
+    {
+        await dismissIconCssRef.Info("Notification", "Click the CSS class dismiss icon to close.");
+    }
+
+    private async Task OpenDismissIconBi()
+    {
+        await dismissIconBiRef.Info("Notification", "Click the Bootstrap dismiss icon to close.");
+    }
+
+    private async Task OpenDismissIconImplicit()
+    {
+        await dismissIconImplicitRef.Info("Notification", "Click the implicit CSS dismiss icon to close.");
+    }
+
+
     private BitSnackBar snackBarStyleRef = default!;
     private BitSnackBar snackBarClassRef = default!;
     private BitSnackBar snackBarStylesRef = default!;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.samples.cs
index f13cfeb41c..ae160e9a50 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/SnackBar/BitSnackBarDemo.razor.samples.cs
@@ -150,6 +150,49 @@ private async Task OpenBodyTemplate()
 }";
 
     private readonly string example5RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitSnackBar @ref=""dismissIconFaRef"" DismissIcon=""@BitIconInfo.Fa(""solid xmark"")""/>
+<BitButton OnClick=""OpenDismissIconFa"">FontAwesome dismiss icon</BitButton>
+
+<BitSnackBar @ref=""dismissIconCssRef"" DismissIcon=""@BitIconInfo.Css(""fa-solid fa-x"")""/>
+<BitButton OnClick=""OpenDismissIconCss"">CSS classes dismiss icon</BitButton>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitSnackBar @ref=""dismissIconBiRef"" DismissIcon=""@BitIconInfo.Bi(""x-lg"")""/>
+<BitButton OnClick=""OpenDismissIconBi"">Bootstrap dismiss icon</BitButton>
+
+<BitSnackBar @ref=""dismissIconImplicitRef"" DismissIcon=""@(""bi bi-x-circle"")""/>
+<BitButton OnClick=""OpenDismissIconImplicit"">Implicit CSS dismiss icon</BitButton>";
+    private readonly string example5CsharpCode = @"
+private BitSnackBar dismissIconFaRef = default!;
+private BitSnackBar dismissIconCssRef = default!;
+private BitSnackBar dismissIconBiRef = default!;
+private BitSnackBar dismissIconImplicitRef = default!;
+
+private async Task OpenDismissIconFa()
+{
+    await dismissIconFaRef.Info(""Notification"", ""Click the FontAwesome dismiss icon to close."");
+}
+
+private async Task OpenDismissIconCss()
+{
+    await dismissIconCssRef.Info(""Notification"", ""Click the CSS class dismiss icon to close."");
+}
+
+private async Task OpenDismissIconBi()
+{
+    await dismissIconBiRef.Info(""Notification"", ""Click the Bootstrap dismiss icon to close."");
+}
+
+private async Task OpenDismissIconImplicit()
+{
+    await dismissIconImplicitRef.Info(""Notification"", ""Click the implicit CSS dismiss icon to close."");
+}";
+
+    private readonly string example6RazorCode = @"
 <style>
     .custom-class {
         background-color: tomato;
@@ -181,7 +224,7 @@ private async Task OpenBodyTemplate()
              Classes=""@(new() { Container = ""custom-container"",
                                 ProgressBar = ""custom-progress"" })"" />
 <BitButton OnClick=""OpenSnackBarClasses"">Custom classes</BitButton>";
-    private readonly string example5CsharpCode = @"
+    private readonly string example6CsharpCode = @"
 private BitSnackBar snackBarStyleRef = default!;
 private BitSnackBar snackBarClassRef = default!;
 private BitSnackBar snackBarStylesRef = default!;
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/SnackBar/BitSnackBarTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/SnackBar/BitSnackBarTests.cs
index e54fda10de..b54bfe4db5 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/SnackBar/BitSnackBarTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/SnackBar/BitSnackBarTests.cs
@@ -171,6 +171,116 @@ public async Task BitSnackBarDismissIconNameTest(string title, string iconName)
         Assert.IsTrue(closeButtonIcon.ClassList.Contains($"bit-icon--{iconName}"));
     }
 
+    [TestMethod,
+        DataRow("title", "fa-solid fa-xmark"),
+        DataRow("title", "bi bi-x-lg")
+    ]
+    public async Task BitSnackBarDismissIconParameterWithCssClassesTest(string title, string cssClasses)
+    {
+        var com = RenderComponent<BitSnackBar>(
+            parameters =>
+            {
+                parameters.Add(x => x.DismissIcon, (BitIconInfo)cssClasses!);
+            }
+        );
+
+        await com.Instance.Show(title);
+
+        var closeButtonIcon = com.Find(".bit-snb-cbt > i");
+
+        var classes = cssClasses.Split(' ', StringSplitOptions.RemoveEmptyEntries);
+        foreach (var cls in classes)
+        {
+            Assert.IsTrue(closeButtonIcon.ClassList.Contains(cls), $"Dismiss icon should contain class '{cls}'");
+        }
+    }
+
+    [TestMethod,
+        DataRow("title")
+    ]
+    public async Task BitSnackBarDismissIconInfoCssHelperTest(string title)
+    {
+        var com = RenderComponent<BitSnackBar>(
+            parameters =>
+            {
+                parameters.Add(x => x.DismissIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+            }
+        );
+
+        await com.Instance.Show(title);
+
+        var closeButtonIcon = com.Find(".bit-snb-cbt > i");
+
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-xmark"));
+    }
+
+    [TestMethod,
+        DataRow("title")
+    ]
+    public async Task BitSnackBarDismissIconInfoFaHelperTest(string title)
+    {
+        var com = RenderComponent<BitSnackBar>(
+            parameters =>
+            {
+                parameters.Add(x => x.DismissIcon, BitIconInfo.Fa("solid xmark"));
+            }
+        );
+
+        await com.Instance.Show(title);
+
+        var closeButtonIcon = com.Find(".bit-snb-cbt > i");
+
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-xmark"));
+    }
+
+    [TestMethod,
+        DataRow("title")
+    ]
+    public async Task BitSnackBarDismissIconInfoBiHelperTest(string title)
+    {
+        var com = RenderComponent<BitSnackBar>(
+            parameters =>
+            {
+                parameters.Add(x => x.DismissIcon, BitIconInfo.Bi("x-lg"));
+            }
+        );
+
+        await com.Instance.Show(title);
+
+        var closeButtonIcon = com.Find(".bit-snb-cbt > i");
+
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("bi"));
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("bi-x-lg"));
+    }
+
+    [TestMethod,
+        DataRow("title")
+    ]
+    public async Task BitSnackBarDismissIconTakesPrecedenceOverDismissIconNameTest(string title)
+    {
+        var com = RenderComponent<BitSnackBar>(
+            parameters =>
+            {
+                parameters.Add(x => x.DismissIcon, BitIconInfo.Fa("solid xmark"));
+                parameters.Add(x => x.DismissIconName, "Cancel");
+            }
+        );
+
+        await com.Instance.Show(title);
+
+        var closeButtonIcon = com.Find(".bit-snb-cbt > i");
+
+        // DismissIcon should take precedence
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(closeButtonIcon.ClassList.Contains("fa-xmark"));
+
+        // Should not contain DismissIconName classes
+        Assert.IsFalse(closeButtonIcon.ClassList.Contains("bit-icon"));
+        Assert.IsFalse(closeButtonIcon.ClassList.Contains("bit-icon--Cancel"));
+    }
+
     [TestMethod,
         DataRow("title")
     ]

From 42d9667150374222d9150872d0dec800c3f9f562 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Mar 2026 19:51:42 +0330
Subject: [PATCH 49/66] feat(blazorui): add new Icon parameters to BitTag
 #12174 (#12175)

---
 .../Components/Notifications/Tag/BitTag.razor |  16 ++-
 .../Notifications/Tag/BitTag.razor.cs         |  50 ++++++-
 .../Notifications/Tag/BitTagParams.cs         |  32 +++++
 .../Notifications/Tag/BitTagDemo.razor        |  31 +++-
 .../Notifications/Tag/BitTagDemo.razor.cs     |  84 ++++++++++-
 .../Notifications/Tag/BitTagTests.cs          | 136 ++++++++++++++++++
 6 files changed, 337 insertions(+), 12 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor
index 285148027d..1e1fbebac0 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes" @onclick="HandleOnClick"
@@ -13,9 +13,11 @@
     }
     else
     {
-        @if (IconName is not null)
+        var icon = BitIconInfo.From(Icon, IconName);
+        
+        @if (icon is not null)
         {
-            <i style="@Styles?.Icon" class="bit-tag-icn bit-icon bit-icon--@IconName @Classes?.Icon" />
+            <i style="@Styles?.Icon" class="bit-tag-icn @icon.GetCssClasses() @Classes?.Icon" />
         }
 
         @if (Text is not null)
@@ -26,15 +28,15 @@
 
     @if (OnDismiss.HasDelegate)
     {
+        var dismissIcon = BitIconInfo.From(DismissIcon, DismissIconName ?? "Cancel");
+
         <button @onclick="HandleOnDismissClick"
                 style="@Styles?.DismissButton"
                 class="bit-tag-cls @Classes?.DismissButton"
                 type="button"
                 title="Dismiss"
-                aria-label="Dismiss"
-                aria-hidden="Dismiss"
-                aria-describedby="Dismiss">
-            <i style="@Styles?.DismissIcon" class="bit-icon bit-icon--Cancel @Classes?.DismissIcon" />
+                aria-label="Dismiss">
+            <i style="@Styles?.DismissIcon" class="bit-tag-dsi @dismissIcon?.GetCssClasses() @Classes?.DismissIcon" />
         </button>
     }
 </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor.cs
index 53f299bd02..844d912b9b 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTag.razor.cs
@@ -37,8 +37,56 @@ public partial class BitTag : BitComponentBase
     public BitColor? Color { get; set; }
 
     /// <summary>
-    /// The icon to show inside the tag.
+    /// Gets or sets the icon to use for the dismiss button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DismissIconName"/> when both are set.
+    /// Defaults to the built-in Cancel icon when neither is set.
     /// </summary>
+    /// <remarks>
+    /// Use this property to render a custom dismiss icon from external libraries like FontAwesome or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="DismissIconName"/> instead.
+    /// </remarks>
+    [Parameter] public BitIconInfo? DismissIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to use for the dismiss button from the built-in Fluent UI icons.
+    /// Defaults to <c>Cancel</c> when not set.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.ChromeClose</c>).
+    /// <br />
+    /// For external icon libraries, use <see cref="DismissIcon"/> instead.
+    /// </remarks>
+    [Parameter] public string? DismissIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon to display using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="IconName"/> instead.
+    /// </remarks>
+    /// <example>
+    /// Bootstrap: Icon="BitIconInfo.Bi("gear-fill")"
+    /// FontAwesome: Icon="BitIconInfo.Fa("solid house")"
+    /// Custom CSS: Icon="BitIconInfo.Css("my-icon-class")"
+    /// </example>
+    [Parameter] public BitIconInfo? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display from the built-in Fluent UI icons.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.AddFriend</c>).
+    /// <br />
+    /// Browse available names in <c>BitIconName</c> of the <c>Bit.BlazorUI.Icons</c> nuget package or the gallery: 
+    /// <see href="https://blazorui.bitplatform.dev/iconography"/>.
+    /// <br />
+    /// The value is case-sensitive and must match a valid icon identifier. 
+    /// If not set or set to <c>null</c>, no icon will be rendered.
+    /// <br />
+    /// For external icon libraries, use <see cref="Icon"/> instead.
+    /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
     /// <summary>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTagParams.cs b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTagParams.cs
index 9da43e75ac..d080d8282e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTagParams.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Notifications/Tag/BitTagParams.cs
@@ -31,11 +31,28 @@ public class BitTagParams : BitComponentBaseParams, IBitComponentParams
     /// </summary>
     public BitColor? Color { get; set; }
 
+    /// <summary>
+    /// The icon to show inside the tag using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="IconName"/> when both are set.
+    /// </summary>
+    public BitIconInfo? Icon { get; set; }
+
     /// <summary>
     /// The icon to show inside the tag.
     /// </summary>
     public string? IconName { get; set; }
 
+    /// <summary>
+    /// The icon to use for the dismiss button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="DismissIconName"/> when both are set.
+    /// </summary>
+    public BitIconInfo? DismissIcon { get; set; }
+
+    /// <summary>
+    /// The name of the icon to use for the dismiss button from the built-in Fluent UI icons.
+    /// </summary>
+    public string? DismissIconName { get; set; }
+
     /// <summary>
     /// Reverses the direction flow of the content of the tag.
     /// </summary>
@@ -92,6 +109,21 @@ public void UpdateParameters(BitTag bitTag)
             bitTag.Color = Color.Value;
         }
 
+        if (DismissIcon is not null && bitTag.HasNotBeenSet(nameof(DismissIcon)))
+        {
+            bitTag.DismissIcon = DismissIcon;
+        }
+
+        if (DismissIconName.HasValue() && bitTag.HasNotBeenSet(nameof(DismissIconName)))
+        {
+            bitTag.DismissIconName = DismissIconName;
+        }
+
+        if (Icon is not null && bitTag.HasNotBeenSet(nameof(Icon)))
+        {
+            bitTag.Icon = Icon;
+        }
+
         if (IconName.HasValue() && bitTag.HasNotBeenSet(nameof(IconName)))
         {
             bitTag.IconName = IconName;
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor
index 6ffd178c67..6f25ae28df 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/tag"
+@page "/components/tag"
 
 <PageOutlet Url="components/tag"
             Title="Tag"
@@ -145,7 +145,34 @@
         </BitTag>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example8RazorCode" Id="example8">
+    <DemoExample Title="External Icons" RazorCode="@example8RazorCode" Id="example8">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>Icon</b> parameter and <b>BitIconInfo</b>.</div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitTag Text="House" Icon="@("fa-solid fa-house")" />&nbsp;
+        <BitTag Text="Heart" Icon="@BitIconInfo.Css("fa-solid fa-heart")" />&nbsp;
+        <BitTag Text="GitHub" Icon="@BitIconInfo.Fa("fa-brands fa-github")" />&nbsp;
+        <BitTag Text="Rocket" Icon="@BitIconInfo.Fa("solid rocket")" />
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitTag Text="House" Icon="@("bi bi-house-fill")" />&nbsp;
+        <BitTag Text="Heart" Icon="@BitIconInfo.Css("bi bi-heart-fill")" />&nbsp;
+        <BitTag Text="GitHub" Icon="@BitIconInfo.Bi("github")" />&nbsp;
+        <BitTag Text="Gear" Icon="@BitIconInfo.Bi("gear-fill")" />
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example9RazorCode" Id="example9">
         <div>Empower customization by overriding default styles and classes, allowing tailored design modifications to suit specific UI requirements.</div>
         <br /><br />
         <div>Component's Style & Class:</div>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs
index 19a7ed1abd..22c0cd8d12 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Notifications/Tag/BitTagDemo.razor.cs
@@ -30,11 +30,40 @@ public partial class BitTagDemo
             Href = "#color-enum"
         },
         new()
+        {
+            Name = "DismissIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to use for the dismiss button using custom CSS classes for external icon libraries. Takes precedence over DismissIconName when both are set. Defaults to the built-in Cancel icon when neither is set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "DismissIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to use for the dismiss button from the built-in Fluent UI icons. Defaults to Cancel when not set. For external icon libraries, use DismissIcon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
         {
             Name = "IconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "Sets the Icon to use in the tag."
+            Description = "Gets or sets the name of the icon to display from the built-in Fluent UI icons. For external icon libraries, use Icon instead.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
         },
         new()
         {
@@ -137,7 +166,36 @@ public partial class BitTagDemo
                    Description = "Custom CSS classes/styles for the dismiss icon of the BitTag."
                },
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
     private readonly List<ComponentSubEnum> componentSubEnums =
@@ -375,6 +433,28 @@ public partial class BitTagDemo
 </BitTag>";
 
     private readonly string example8RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitTag Text=""House"" Icon=""@(""fa-solid fa-house"")"" />
+
+<BitTag Text=""Heart"" Icon=""@BitIconInfo.Css(""fa-solid fa-heart"")"" />
+
+<BitTag Text=""GitHub"" Icon=""@BitIconInfo.Fa(""fa-brands fa-github"")"" />
+
+<BitTag Text=""Rocket"" Icon=""@BitIconInfo.Fa(""solid rocket"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitTag Text=""House"" Icon=""@(""bi bi-house-fill"")"" />
+
+<BitTag Text=""Heart"" Icon=""@BitIconInfo.Css(""bi bi-heart-fill"")"" />
+
+<BitTag Text=""GitHub"" Icon=""@BitIconInfo.Bi(""github"")"" />
+
+<BitTag Text=""Gear"" Icon=""@BitIconInfo.Bi(""gear-fill"")"" />";
+
+    private readonly string example9RazorCode = @"
 <style>
     .custom-class {
         border-radius: 0.25rem;
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Tag/BitTagTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Tag/BitTagTests.cs
index e97509e6a6..397eb9b76f 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Tag/BitTagTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Notifications/Tag/BitTagTests.cs
@@ -31,6 +31,80 @@ public void BitTagShouldRenderIconWhenIconNameProvided()
         Assert.IsTrue(icon.ClassList.Contains("bit-icon--TestIcon"));
     }
 
+    [TestMethod]
+    public void BitTagShouldRenderIconWhenIconCssProvided()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.Icon, BitIconInfo.Css("fa-solid fa-house"));
+        });
+
+        var icon = component.Find(".bit-tag-icn");
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-house"));
+    }
+
+    [TestMethod]
+    public void BitTagShouldRenderIconWhenIconFaProvided()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.Icon, BitIconInfo.Fa("solid rocket"));
+        });
+
+        var icon = component.Find(".bit-tag-icn");
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-rocket"));
+    }
+
+    [TestMethod]
+    public void BitTagShouldRenderIconWhenIconBiProvided()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.Icon, BitIconInfo.Bi("github"));
+        });
+
+        var icon = component.Find(".bit-tag-icn");
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("bi"));
+        Assert.IsTrue(icon.ClassList.Contains("bi-github"));
+    }
+
+    [TestMethod]
+    public void BitTagIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.Icon, BitIconInfo.Css("fa-solid fa-house"));
+            parameters.Add(p => p.IconName, "Calendar");
+        });
+
+        var icon = component.Find(".bit-tag-icn");
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-house"));
+        Assert.IsFalse(icon.ClassList.Contains("bit-icon--Calendar"));
+    }
+
+    [TestMethod]
+    public void BitTagShouldAcceptImplicitStringAsIcon()
+    {
+        // BitIconInfo has an implicit operator from string; the string becomes the raw CSS class
+        BitIconInfo? iconInfo = "fa-solid fa-star";
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.Icon, iconInfo);
+        });
+
+        var icon = component.Find(".bit-tag-icn");
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-star"));
+    }
+
     [TestMethod]
     public void BitTagShouldRenderTextWhenTextProvided()
     {
@@ -194,4 +268,66 @@ public void BitTagShouldRespectAriaLabel()
         var root = component.Find(".bit-tag");
         Assert.AreEqual(aria, root.GetAttribute("aria-label"));
     }
+
+    [TestMethod]
+    public void BitTagDismissIconShouldDefaultToCancel()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.OnDismiss, EventCallback.Factory.Create<MouseEventArgs>(this, (MouseEventArgs e) => { }));
+        });
+
+        var dismissIcon = component.Find(".bit-tag-dsi");
+        Assert.IsNotNull(dismissIcon);
+        Assert.IsTrue(dismissIcon.ClassList.Contains("bit-icon"));
+        Assert.IsTrue(dismissIcon.ClassList.Contains("bit-icon--Cancel"));
+    }
+
+    [TestMethod]
+    public void BitTagShouldRenderCustomDismissIconNameWhenProvided()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.OnDismiss, EventCallback.Factory.Create<MouseEventArgs>(this, (MouseEventArgs e) => { }));
+            parameters.Add(p => p.DismissIconName, "ChromeClose");
+        });
+
+        var dismissIcon = component.Find(".bit-tag-dsi");
+        Assert.IsNotNull(dismissIcon);
+        Assert.IsTrue(dismissIcon.ClassList.Contains("bit-icon--ChromeClose"));
+        Assert.IsFalse(dismissIcon.ClassList.Contains("bit-icon--Cancel"));
+    }
+
+    [TestMethod]
+    public void BitTagShouldRenderCustomDismissIconWhenProvided()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.OnDismiss, EventCallback.Factory.Create<MouseEventArgs>(this, (MouseEventArgs e) => { }));
+            parameters.Add(p => p.DismissIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+        });
+
+        var dismissIcon = component.Find(".bit-tag-dsi");
+        Assert.IsNotNull(dismissIcon);
+        Assert.IsTrue(dismissIcon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(dismissIcon.ClassList.Contains("fa-xmark"));
+        Assert.IsFalse(dismissIcon.ClassList.Contains("bit-icon--Cancel"));
+    }
+
+    [TestMethod]
+    public void BitTagDismissIconShouldTakePrecedenceOverDismissIconName()
+    {
+        var component = RenderComponent<BitTag>(parameters =>
+        {
+            parameters.Add(p => p.OnDismiss, EventCallback.Factory.Create<MouseEventArgs>(this, (MouseEventArgs e) => { }));
+            parameters.Add(p => p.DismissIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+            parameters.Add(p => p.DismissIconName, "ChromeClose");
+        });
+
+        var dismissIcon = component.Find(".bit-tag-dsi");
+        Assert.IsNotNull(dismissIcon);
+        Assert.IsTrue(dismissIcon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(dismissIcon.ClassList.Contains("fa-xmark"));
+        Assert.IsFalse(dismissIcon.ClassList.Contains("bit-icon--ChromeClose"));
+    }
 }

From 821fde37372c272456a041ca03959491e762717d Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Mon, 16 Mar 2026 22:03:59 +0330
Subject: [PATCH 50/66] feat(blazorui): add new Icon parameter to BitSplitter
 #12176 (#12177)

---
 .../Surfaces/Splitter/BitSplitter.razor       |   9 +-
 .../Surfaces/Splitter/BitSplitter.razor.cs    |  29 +++-
 .../Surfaces/Splitter/BitSplitterDemo.razor   | 115 +++++++++++++-
 .../Splitter/BitSplitterDemo.razor.cs         | 144 +++++++++++++++++-
 .../Surfaces/Splitter/BitSplitterTests.cs     |  92 ++++++++++-
 5 files changed, 378 insertions(+), 11 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor
index 60c5b2c334..23eb8af9cd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor
@@ -1,4 +1,4 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitComponentBase
 
 <div @ref="RootElement" @attributes="HtmlAttributes" 
@@ -13,9 +13,12 @@
         @FirstPanel
     </div>
     <div class="bit-spl-gtr" @ref="_splitterGutterRef" @onpointerdown="OnPointerDown" @onpointerdown:preventDefault @ontouchstart="OnTouchStart" @ontouchstart:preventDefault>
-        @if (GutterIcon is not null)
+        @{
+            var icon = BitIconInfo.From(GutterIcon, GutterIconName);
+        }
+        @if (icon is not null)
         {
-            <i class="bit-icon bit-icon--@GutterIcon" />
+            <i class="bit-spl-gic @icon.GetCssClasses()" />
         }
         else
         {
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor.cs
index 8b3b127fa7..f4cb134f5a 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Surfaces/Splitter/BitSplitter.razor.cs
@@ -28,10 +28,33 @@ public partial class BitSplitter : BitComponentBase
     public int? GutterSize { get; set; }
 
     /// <summary>
-    /// The icon of BitSplitter gutter.
+    /// The icon for the BitSplitter gutter using <see cref="BitIconInfo"/> for external icon library support.
+    /// Takes precedence over <see cref="GutterIconName"/> when both are set.
     /// </summary>
-    [Parameter, ResetStyleBuilder]
-    public string? GutterIcon { get; set; }
+    /// <remarks>
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="GutterIconName"/> instead.
+    /// When assigning a plain <see cref="string"/> to this property, it is converted to a <see cref="BitIconInfo"/> instance and
+    /// treated as the raw CSS class name(s) for the external icon (for example, <c>"fa fa-home"</c>), not as a Fluent UI icon name.
+    /// To render built-in Fluent UI icons, use <see cref="GutterIconName"/> instead; passing a Fluent icon name as a string to
+    /// <see cref="GutterIcon"/> will compile but will not render a Fluent icon unless you also configure
+    /// <see cref="BitIconInfo.BaseClass"/> and/or <see cref="BitIconInfo.Prefix"/> for a custom icon set.
+    /// </remarks>
+    [Parameter]
+    public BitIconInfo? GutterIcon { get; set; }
+
+    /// <summary>
+    /// The name of the built-in Fluent UI icon to render in the BitSplitter gutter.
+    /// Ignored when <see cref="GutterIcon"/> is also set.
+    /// </summary>
+    /// <remarks>
+    /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.GripperDotsVertical</c>).
+    /// For external icon libraries, use <see cref="GutterIcon"/> instead, 
+    /// where string values are interpreted as CSS class name(s)
+    /// for the external icon rather than as Fluent UI icon identifiers.
+    /// </remarks>
+    [Parameter]
+    public string? GutterIconName { get; set; }
 
     /// <summary>
     /// The content for the first panel.
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor
index 33e8a6e21d..cbfe8c7e78 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor
@@ -1,4 +1,4 @@
-@page "/components/splitter"
+@page "/components/splitter"
 
 <PageOutlet Url="components/splitter"
             Title="Splitter"
@@ -7,6 +7,7 @@
 <DemoPage Name="Splitter"
           Description="The BitSplitter component divides a container into two adjustable sections, either horizontally or vertically. Users can resize these sections by dragging the divider."
           Parameters="componentParameters"
+          SubClasses="componentSubClasses"
           GitHubUrl="Surfaces/Splitter/BitSplitter.razor"
           GitHubDemoUrl="Surfaces/Splitter/BitSplitterDemo.razor">
     <DemoExample Title="Basic" RazorCode="@example1RazorCode" Id="example1">
@@ -153,7 +154,7 @@
     </DemoExample>
 
     <DemoExample Title="Gutter Icon" RazorCode="@example6RazorCode" Id="example6">
-        <BitSplitter GutterIcon="@BitIconName.GripperDotsVertical">
+        <BitSplitter GutterIconName="@BitIconName.GripperDotsVertical">
             <FirstPanel>
                 <div style="padding: 4px;">
                     First Panel
@@ -176,4 +177,114 @@
             </SecondPanel>
         </BitSplitter>
     </DemoExample>
+
+    <DemoExample Title="External Icons" RazorCode="@example7RazorCode" Id="example7">
+        <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>GutterIcon</b> parameter (<BitLink Href="#bit-icon-info">BitIconInfo</BitLink>).</div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitSplitter GutterIcon="@("fa-solid fa-arrows-left-right")">
+            <FirstPanel>
+                <div style="padding: 4px;">
+                    First Panel
+                    <br />
+                    Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                </div>
+            </FirstPanel>
+            <SecondPanel>
+                <div style="padding: 4px;">
+                    Second Panel
+                    <br />
+                    Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+                    <br/>
+                    "fa-solid fa-arrows-left-right"
+                </div>
+            </SecondPanel>
+        </BitSplitter>
+
+        <br />
+
+        <BitSplitter GutterIcon="@BitIconInfo.Css("fa-solid fa-grip-vertical")">
+            <FirstPanel>
+                <div style="padding: 4px;">
+                    First Panel
+                    <br />
+                    BitIconInfo.Css("fa-solid fa-grip-vertical")
+                </div>
+            </FirstPanel>
+            <SecondPanel>
+                <div style="padding: 4px;">
+                    Second Panel
+                    <br />
+                    BitIconInfo.Css("fa-solid fa-grip-vertical")
+                </div>
+            </SecondPanel>
+        </BitSplitter>
+
+        <br />
+
+        <BitSplitter GutterIcon="@BitIconInfo.Fa("solid grip-lines-vertical")">
+            <FirstPanel>
+                <div style="padding: 4px;">
+                    First Panel
+                    <br />
+                    BitIconInfo.Fa("solid grip-lines-vertical")
+                </div>
+            </FirstPanel>
+            <SecondPanel>
+                <div style="padding: 4px;">
+                    Second Panel
+                    <br />
+                    BitIconInfo.Fa("solid grip-lines-vertical")
+                </div>
+            </SecondPanel>
+        </BitSplitter>
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitSplitter GutterIcon="@("bi bi-grip-vertical")">
+            <FirstPanel>
+                <div style="padding: 4px;">
+                    First Panel
+                    <br />
+                    Icon=@@("bi bi-grip-vertical")
+                </div>
+            </FirstPanel>
+            <SecondPanel>
+                <div style="padding: 4px;">
+                    Second Panel
+                    <br />
+                    Icon=@@("bi bi-grip-vertical")
+                </div>
+            </SecondPanel>
+        </BitSplitter>
+
+        <br />
+
+        <BitSplitter GutterIcon="@BitIconInfo.Bi("arrow-left-right")">
+            <FirstPanel>
+                <div style="padding: 4px;">
+                    First Panel
+                    <br />
+                    BitIconInfo.Bi("arrow-left-right")
+                </div>
+            </FirstPanel>
+            <SecondPanel>
+                <div style="padding: 4px;">
+                    Second Panel
+                    <br />
+                    BitIconInfo.Bi("arrow-left-right")
+                </div>
+            </SecondPanel>
+        </BitSplitter>
+    </DemoExample>
 </DemoPage>
\ No newline at end of file
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor.cs
index 2e5b1b77e8..381a32a493 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Surfaces/Splitter/BitSplitterDemo.razor.cs
@@ -14,9 +14,20 @@ public partial class BitSplitterDemo
         new()
         {
             Name = "GutterIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon for the BitSplitter gutter using BitIconInfo for external icon library support. Takes precedence over GutterIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GutterIconName",
             Type = "string?",
             DefaultValue = "null",
-            Description = "The icon of BitSplitter gutter.",
+            Description = "The name of the built-in Fluent UI icon to render in the BitSplitter gutter. Ignored when GutterIcon is also set.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
         },
         new()
         {
@@ -85,6 +96,41 @@ public partial class BitSplitterDemo
 
 
 
+    private readonly List<ComponentSubClass> componentSubClasses =
+    [
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
+    ];
+
+
+
     private double gutterSize = 10;
 
 
@@ -229,7 +275,7 @@ Second Panel
 ";
 
     private readonly string example6RazorCode = @"
-<BitSplitter GutterIcon=""@BitIconName.GripperDotsVertical"">
+<BitSplitter GutterIconName=""@BitIconName.GripperDotsVertical"">
     <FirstPanel>
         <div style=""padding: 4px;"">
             First Panel
@@ -251,4 +297,98 @@ Second Panel
         </div>
     </SecondPanel>
 </BitSplitter>";
+
+    private readonly string example7RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitSplitter GutterIcon=""@(""fa-solid fa-arrows-left-right"")"">
+    <FirstPanel>
+        <div style=""padding: 4px;"">
+            First Panel
+            <br />
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+        </div>
+    </FirstPanel>
+    <SecondPanel>
+        <div style=""padding: 4px;"">
+            Second Panel
+            <br />
+            Once upon a time, stories wove connections between people, a symphony of voices crafting shared dreams.
+            <br/>
+            ""fa-solid fa-arrows-left-right""
+        </div>
+    </SecondPanel>
+</BitSplitter>
+
+<BitSplitter GutterIcon=""@BitIconInfo.Css(""fa-solid fa-grip-vertical"")"">
+    <FirstPanel>
+        <div style=""padding: 4px;"">
+            First Panel
+            <br />
+            BitIconInfo.Css(""fa-solid fa-grip-vertical"")
+        </div>
+    </FirstPanel>
+    <SecondPanel>
+        <div style=""padding: 4px;"">
+            Second Panel
+            <br />
+            BitIconInfo.Css(""fa-solid fa-grip-vertical"")
+        </div>
+    </SecondPanel>
+</BitSplitter>
+
+<BitSplitter GutterIcon=""@BitIconInfo.Fa(""solid grip-lines-vertical"")"">
+    <FirstPanel>
+        <div style=""padding: 4px;"">
+            First Panel
+            <br />
+            BitIconInfo.Fa(""solid grip-lines-vertical"")
+        </div>
+    </FirstPanel>
+    <SecondPanel>
+        <div style=""padding: 4px;"">
+            Second Panel
+            <br />
+            BitIconInfo.Fa(""solid grip-lines-vertical"")
+        </div>
+    </SecondPanel>
+</BitSplitter>
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitSplitter GutterIcon=""@(""bi bi-grip-vertical"")"">
+    <FirstPanel>
+        <div style=""padding: 4px;"">
+            First Panel
+            <br />
+            Icon=@@(""bi bi-grip-vertical"")
+        </div>
+    </FirstPanel>
+    <SecondPanel>
+        <div style=""padding: 4px;"">
+            Second Panel
+            <br />
+            Icon=@@(""bi bi-grip-vertical"")
+        </div>
+    </SecondPanel>
+</BitSplitter>
+
+<BitSplitter GutterIcon=""@BitIconInfo.Bi(""arrow-left-right"")"">
+    <FirstPanel>
+        <div style=""padding: 4px;"">
+            First Panel
+            <br />
+            BitIconInfo.Bi(""arrow-left-right"")
+        </div>
+    </FirstPanel>
+    <SecondPanel>
+        <div style=""padding: 4px;"">
+            Second Panel
+            <br />
+            BitIconInfo.Bi(""arrow-left-right"")
+        </div>
+    </SecondPanel>
+</BitSplitter>";
+
 }
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Surfaces/Splitter/BitSplitterTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Surfaces/Splitter/BitSplitterTests.cs
index 02370a9f08..e9309a96c1 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Surfaces/Splitter/BitSplitterTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Surfaces/Splitter/BitSplitterTests.cs
@@ -47,7 +47,7 @@ public void BitSplitterShouldRenderGutterIconWhenProvided()
         var iconName = "GripperDotsVertical";
         var component = RenderComponent<BitSplitter>(parameters =>
         {
-            parameters.Add(p => p.GutterIcon, iconName);
+            parameters.Add(p => p.GutterIconName, iconName);
         });
 
         var icon = component.Find(".bit-spl .bit-icon");
@@ -55,6 +55,96 @@ public void BitSplitterShouldRenderGutterIconWhenProvided()
         Assert.IsTrue(icon.ClassList.Contains($"bit-icon--{iconName}"));
     }
 
+    [TestMethod]
+    public void BitSplitterIconShouldRenderWithBitIconInfo()
+    {
+        var iconName = "GripperDotsVertical";
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIcon, BitIconInfo.Bit(iconName));
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon"));
+        Assert.IsTrue(icon.ClassList.Contains($"bit-icon--{iconName}"));
+    }
+
+    [TestMethod]
+    public void BitSplitterIconShouldRenderExternalCssClasses()
+    {
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIcon, BitIconInfo.Css("fa-solid fa-grip-vertical"));
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-grip-vertical"));
+    }
+
+    [TestMethod]
+    public void BitSplitterIconShouldRenderFontAwesomeClasses()
+    {
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIcon, BitIconInfo.Fa("solid grip-lines-vertical"));
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-grip-lines-vertical"));
+    }
+
+    [TestMethod]
+    public void BitSplitterIconShouldRenderBootstrapIconClasses()
+    {
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIcon, BitIconInfo.Bi("grip-vertical"));
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        Assert.IsTrue(icon.ClassList.Contains("bi"));
+        Assert.IsTrue(icon.ClassList.Contains("bi-grip-vertical"));
+    }
+
+    [TestMethod]
+    public void BitSplitterGutterIconShouldTakePrecedenceOverGutterIconName()
+    {
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIcon, BitIconInfo.Css("fa-solid fa-grip-vertical"));
+            parameters.Add(p => p.GutterIconName, "GripperDotsVertical");
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        // GutterIcon (BitIconInfo.Css) should take precedence
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-grip-vertical"));
+        Assert.IsFalse(icon.ClassList.Contains("bit-icon"));
+    }
+
+    [TestMethod]
+    public void BitSplitterIconShouldRenderGutterIconClassOnIconElement()
+    {
+        var iconName = "GripperDotsVertical";
+        var component = RenderComponent<BitSplitter>(parameters =>
+        {
+            parameters.Add(p => p.GutterIconName, iconName);
+        });
+
+        var icon = component.Find(".bit-spl-gic");
+
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon"));
+        Assert.IsTrue(icon.ClassList.Contains($"bit-icon--{iconName}"));
+    }
+
     [TestMethod]
     public void BitSplitterShouldRespectVerticalClass()
     {

From 7d789cf3f902f23a310777a7217b01128e49f0bc Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Tue, 17 Mar 2026 16:14:21 +0330
Subject: [PATCH 51/66] feat(blazorui): add new Icon parameters to BitCalendar
 #12180 (#12181)

---
 .../Inputs/Calendar/BitCalendar.razor         |  73 ++-
 .../Inputs/Calendar/BitCalendar.razor.cs      | 226 +++++--
 .../Inputs/Calendar/BitCalendar.scss          |   4 +-
 .../Inputs/Calendar/BitCalendarDemo.razor     |  40 +-
 .../Inputs/Calendar/BitCalendarDemo.razor.cs  | 363 +++++++++--
 .../Calendar/BitCalendarDemo.razor.samples.cs |  22 +-
 .../Inputs/Calendar/BitCalendarTests.cs       | 562 ++++++++++++++++++
 7 files changed, 1184 insertions(+), 106 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor
index ca293841f5..6268617932 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor
@@ -1,6 +1,27 @@
-@namespace Bit.BlazorUI
+@namespace Bit.BlazorUI
 @inherits BitInputBase<DateTimeOffset?>
 
+@{
+    var todayYear = _culture.Calendar.GetYear(DateTime.Now);
+    var todayMonth = _culture.Calendar.GetMonth(DateTime.Now);
+    var todayDay = _culture.Calendar.GetDayOfMonth(DateTime.Now);
+
+    var prevMonthNavIconCss = BitIconInfo.From(PrevMonthNavIcon, PrevMonthNavIconName ?? "Up")?.GetCssClasses();
+    var nextMonthNavIconCss = BitIconInfo.From(NextMonthNavIcon, NextMonthNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var goToTodayIconCss = BitIconInfo.From(GoToTodayIcon, GoToTodayIconName ?? "GotoToday")?.GetCssClasses();
+    var showTimePickerIconCss = BitIconInfo.From(ShowTimePickerIcon, ShowTimePickerIconName ?? "Clock")?.GetCssClasses();
+    var prevYearNavIconCss = BitIconInfo.From(PrevYearNavIcon, PrevYearNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearNavIconCss = BitIconInfo.From(NextYearNavIcon, NextYearNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var prevYearRangeNavIconCss = BitIconInfo.From(PrevYearRangeNavIcon, PrevYearRangeNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearRangeNavIconCss = BitIconInfo.From(NextYearRangeNavIcon, NextYearRangeNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var goToNowIconCss = BitIconInfo.From(GoToNowIcon, GoToNowIconName ?? "Clock")?.GetCssClasses();
+    var hideTimePickerIconCss = BitIconInfo.From(HideTimePickerIcon, HideTimePickerIconName ?? "CalendarMirrored")?.GetCssClasses();
+    var increaseHourIconCss = BitIconInfo.From(TimePickerIncreaseHourIcon, TimePickerIncreaseHourIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var decreaseHourIconCss = BitIconInfo.From(TimePickerDecreaseHourIcon, TimePickerDecreaseHourIconName ?? "ChevronDownSmall")?.GetCssClasses();
+    var increaseMinuteIconCss = BitIconInfo.From(TimePickerIncreaseMinuteIcon, TimePickerIncreaseMinuteIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var decreaseMinuteIconCss = BitIconInfo.From(TimePickerDecreaseMinuteIcon, TimePickerDecreaseMinuteIconName ?? "ChevronDownSmall")?.GetCssClasses();
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      style="@StyleBuilder.Value"
@@ -12,12 +33,6 @@
             @(string.Format(SelectedDateAriaAtomic, CurrentValueAsString))
         </div>
 
-        @{
-            var todayYear = _culture.Calendar.GetYear(DateTime.Now);
-            var todayMonth = _culture.Calendar.GetMonth(DateTime.Now);
-            var todayDay = _culture.Calendar.GetDayOfMonth(DateTime.Now);
-        }
-
         @if (DayPickerIsVisible())
         {
             <div style="@Styles?.DayPickerWrapper" class="bit-cal-dwp @Classes?.DayPickerWrapper">
@@ -63,7 +78,7 @@
                                 aria-disabled="@prevDisabled">
                             <i aria-hidden="true"
                                style="@Styles?.PrevMonthNavIcon"
-                               class="bit-icon bit-icon--Up @Classes?.PrevMonthNavIcon" />
+                               class="bit-cal-ico @prevMonthNavIconCss @Classes?.PrevMonthNavIcon" />
                         </button>
                         @if (ShowGoToToday && (ShowMonthPickerAsOverlay || ShowMonthPicker is false))
                         {
@@ -78,7 +93,7 @@
                                     class="bit-cal-gtb @Classes?.GoToTodayButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.GoToTodayIcon"
-                                   class="bit-cal-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                   class="bit-cal-ico @goToTodayIconCss @Classes?.GoToTodayIcon" />
                             </button>
                         }
                         <button @onclick="() => HandleMonthChange(true)"
@@ -90,7 +105,7 @@
                                 aria-disabled="@nextDisabled">
                             <i aria-hidden="true"
                                style="@Styles?.NextMonthNavIcon"
-                               class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextMonthNavIcon" />
+                               class="bit-cal-ico @nextMonthNavIconCss @Classes?.NextMonthNavIcon" />
                         </button>
                         @if (ShowTimePicker && ShowTimePickerAsOverlay && (ShowMonthPicker is false || ShowMonthPickerAsOverlay))
                         {
@@ -107,7 +122,7 @@
                                     class="bit-cal-nbt @Classes?.ShowTimePickerButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.ShowTimePickerIcon"
-                                   class="bit-cal-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                   class="bit-cal-ico @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                             </button>
                         }
                     </div>
@@ -218,7 +233,7 @@
                                     class="bit-cal-nbt @Classes?.PrevYearNavButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.PrevYearNavIcon"
-                                   class="bit-icon bit-icon--Up @Classes?.PrevYearNavIcon" />
+                                   class="bit-cal-ico @prevYearNavIconCss @Classes?.PrevYearNavIcon" />
                             </button>
                             @if (ShowGoToToday)
                             {
@@ -234,7 +249,7 @@
                                         class="bit-cal-gtb @Classes?.GoToTodayButton">
                                     <i aria-hidden="true"
                                        style="@Styles?.GoToTodayIcon"
-                                       class="bit-cal-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                       class="bit-cal-ico @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                 </button>
                             }
                             <button @onclick="() => HandleYearChange(true)"
@@ -247,7 +262,7 @@
                                     class="bit-cal-nbt @Classes?.NextYearNavButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.NextYearNavIcon"
-                                   class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearNavIcon" />
+                                   class="bit-cal-ico @nextYearNavIconCss @Classes?.NextYearNavIcon" />
                             </button>
                             @if (ShowTimePickerAsOverlay && ShowTimePicker)
                             {
@@ -264,7 +279,7 @@
                                         class="bit-cal-nbt @Classes?.ShowTimePickerButton">
                                     <i aria-hidden="true"
                                        style="@Styles?.ShowTimePickerIcon"
-                                       class="bit-cal-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                       class="bit-cal-ico @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                                 </button>
                             }
                         </div>
@@ -334,7 +349,7 @@
                                     class="bit-cal-nbt @Classes?.PrevYearRangeNavButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.PrevYearRangeNavIcon"
-                                   class="bit-icon bit-icon--Up @Classes?.PrevYearRangeNavIcon" />
+                                   class="bit-cal-ico @prevYearRangeNavIconCss @Classes?.PrevYearRangeNavIcon" />
                             </button>
                             @if (ShowGoToToday)
                             {
@@ -350,7 +365,7 @@
                                         class="bit-cal-gtb @Classes?.GoToTodayButton">
                                     <i aria-hidden="true"
                                        style="@Styles?.GoToTodayIcon"
-                                       class="bit-cal-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                       class="bit-cal-ico @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                 </button>
                             }
                             <button @onclick="() => HandleYearRangeChange(true)"
@@ -363,7 +378,7 @@
                                     class="bit-cal-nbt @Classes?.NextYearRangeNavButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.NextYearRangeNavIcon"
-                                   class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearRangeNavIcon" />
+                                   class="bit-cal-ico @nextYearRangeNavIconCss @Classes?.NextYearRangeNavIcon" />
                             </button>
                         </div>
                     </div>
@@ -424,7 +439,7 @@
                                     class="bit-cal-gtn @Classes?.GoToNowButton">
                                 <i aria-hidden="true"
                                    style="@Styles?.GoToNowIcon"
-                                   class="bit-cal-gti bit-icon bit-icon--Clock @Classes?.GoToNowIcon" />
+                                   class="bit-cal-ico @goToNowIconCss @Classes?.GoToNowIcon" />
                             </button>
                         }
                         @if (ShowTimePickerAsOverlay)
@@ -436,7 +451,9 @@
                                     aria-disabled="@(IsEnabled is false)"
                                     style="@Styles?.HideTimePickerButton"
                                     class="bit-cal-nbt @Classes?.HideTimePickerButton">
-                                <i style="@Styles?.HideTimePickerIcon" class="bit-icon bit-icon--CalendarMirrored @Classes?.HideTimePickerIcon" aria-hidden="true" />
+                                <i aria-hidden="true"
+                                   style="@Styles?.HideTimePickerIcon"
+                                   class="bit-cal-ico @hideTimePickerIconCss @Classes?.HideTimePickerIcon" />
                             </button>
                         }
                     </div>
@@ -451,7 +468,9 @@
                                 aria-disabled="@(IsEnabled is false)"
                                 style="@Styles?.TimePickerIncreaseHourButton"
                                 class="bit-cal-tbt @Classes?.TimePickerIncreaseHourButton">
-                            <i style="@Styles?.TimePickerIncreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.TimePickerIncreaseHourIcon" aria-hidden="true" />
+                            <i aria-hidden="true"
+                               style="@Styles?.TimePickerIncreaseHourIcon"
+                               class="bit-cal-ico @increaseHourIconCss @Classes?.TimePickerIncreaseHourIcon" />
                         </button>
                         <input @ref="_inputTimeHourRef"
                                @bind="@_hourView"
@@ -475,7 +494,9 @@
                                 aria-disabled="@(IsEnabled is false)"
                                 style="@Styles?.TimePickerDecreaseHourButton"
                                 class="bit-cal-tbt @Classes?.TimePickerDecreaseHourButton">
-                            <i style="@Styles?.TimePickerDecreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.TimePickerDecreaseHourIcon" aria-hidden="true" />
+                            <i aria-hidden="true"
+                               style="@Styles?.TimePickerDecreaseHourIcon"
+                               class="bit-cal-ico @decreaseHourIconCss @Classes?.TimePickerDecreaseHourIcon" />
                         </button>
                     </div>
                     <div style="@Styles?.TimePickerHourMinuteSeparator" class="bit-cal-tpr bit-cal-tdv @Classes?.TimePickerHourMinuteSeparator">:</div>
@@ -488,7 +509,9 @@
                                 aria-disabled="@(IsEnabled is false)"
                                 style="@Styles?.TimePickerIncreaseMinuteButton"
                                 class="bit-cal-tbt @Classes?.TimePickerIncreaseMinuteButton">
-                            <i style="@Styles?.TimePickerIncreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.TimePickerIncreaseMinuteIcon" aria-hidden="true" />
+                            <i aria-hidden="true"
+                               style="@Styles?.TimePickerIncreaseMinuteIcon"
+                               class="bit-cal-ico @increaseMinuteIconCss @Classes?.TimePickerIncreaseMinuteIcon" />
                         </button>
                         <input @ref="_inputTimeMinuteRef"
                                @bind="@_minuteView"
@@ -512,7 +535,9 @@
                                 aria-disabled="@(IsEnabled is false)"
                                 style="@Styles?.TimePickerDecreaseMinuteButton"
                                 class="bit-cal-tbt @Classes?.TimePickerDecreaseMinuteButton">
-                            <i style="@Styles?.TimePickerDecreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.TimePickerDecreaseMinuteIcon" aria-hidden="true" />
+                            <i aria-hidden="true"
+                               style="@Styles?.TimePickerDecreaseMinuteIcon"
+                               class="bit-cal-ico @decreaseMinuteIconCss @Classes?.TimePickerDecreaseMinuteIcon" />
                         </button>
                     </div>
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor.cs
index adec01d13d..031b349f59 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.razor.cs
@@ -136,6 +136,22 @@ private int _minuteView
     /// </summary>
     [Parameter] public string GoToNextYearTitle { get; set; } = "Go to next year {0}";
 
+    /// <summary>
+    /// Gets or sets the icon to display in the GoToNow button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="GoToNowIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? GoToNowIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the GoToNow button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? GoToNowIconName { get; set; }
+
+    /// <summary>
+    /// The title of the GoToNow button (tooltip).
+    /// </summary>
+    [Parameter] public string GoToNowTitle { get; set; } = "Go to now";
+
     /// <summary>
     /// The title of the Go to previous month button (tooltip).
     /// </summary>
@@ -151,20 +167,32 @@ private int _minuteView
     /// </summary>
     [Parameter] public string GoToPrevYearTitle { get; set; } = "Go to previous year {0}";
 
+    /// <summary>
+    /// Gets or sets the icon to display in the GoToToday button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="GoToTodayIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? GoToTodayIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the GoToToday button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? GoToTodayIconName { get; set; }
+
     /// <summary>
     /// The title of the GoToToday button (tooltip).
     /// </summary>
     [Parameter] public string GoToTodayTitle { get; set; } = "Go to today";
 
     /// <summary>
-    /// The title of the GoToNow button (tooltip).
+    /// Gets or sets the icon to display in the HideTimePicker button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="HideTimePickerIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string GoToNowTitle { get; set; } = "Go to now";
+    [Parameter] public BitIconInfo? HideTimePickerIcon { get; set; }
 
     /// <summary>
-    /// The title of the ShowTimePicker button (tooltip).
+    /// Gets or sets the name of the icon to display in the HideTimePicker button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
+    [Parameter] public string? HideTimePickerIconName { get; set; }
 
     /// <summary>
     /// The title of the HideTimePicker button (tooltip).
@@ -182,16 +210,14 @@ private int _minuteView
     [Parameter] public bool HighlightSelectedMonth { get; set; }
 
     /// <summary>
-    /// The custom validation error message for the invalid value.
+    /// Determines increment/decrement steps for calendar's hour.
     /// </summary>
-    [Parameter] public string? InvalidErrorMessage { get; set; }
+    [Parameter] public int HourStep { get; set; } = 1;
 
     /// <summary>
-    /// Whether the month picker is shown or hidden.
+    /// The custom validation error message for the invalid value.
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public bool ShowMonthPicker { get; set; } = true;
+    [Parameter] public string? InvalidErrorMessage { get; set; }
 
     /// <summary>
     /// The maximum allowable date of the calendar.
@@ -207,6 +233,11 @@ private int _minuteView
     [CallOnSet(nameof(OnSetParameters))]
     public DateTimeOffset? MinDate { get; set; }
 
+    /// <summary>
+    /// Determines increment/decrement steps for calendar's minute.
+    /// </summary>
+    [Parameter] public int MinuteStep { get; set; } = 1;
+
     /// <summary>
     /// Used to customize how content inside the month cell is rendered. 
     /// </summary>
@@ -218,29 +249,102 @@ private int _minuteView
     [Parameter] public string MonthPickerToggleTitle { get; set; } = "{0}, change month";
 
     /// <summary>
-    /// Show month picker on top of date picker when visible.
+    /// Gets or sets the icon to display in the Go to next month button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="NextMonthNavIconName"/> when both are set.
     /// </summary>
-    [Parameter] public bool ShowMonthPickerAsOverlay { get; set; }
+    [Parameter] public BitIconInfo? NextMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to next month button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? NextMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon to display in the Go to next year button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="NextYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to next year button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? NextYearNavIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon to display in the Go to next year range button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="NextYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to next year range button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? NextYearRangeNavIconName { get; set; }
 
     /// <summary>
     /// Callback for when the user selects a date.
     /// </summary>
     [Parameter] public EventCallback<DateTimeOffset?> OnSelectDate { get; set; }
 
+    /// <summary>
+    /// Gets or sets the icon to display in the Go to previous month button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="PrevMonthNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to previous month button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? PrevMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon to display in the Go to previous year button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="PrevYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to previous year button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? PrevYearNavIconName { get; set; }
+
+    /// <summary>
+    /// Gets or sets the icon to display in the Go to previous year range button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="PrevYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the Go to previous year range button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? PrevYearRangeNavIconName { get; set; }
+
     /// <summary>
     /// The text of selected date aria-atomic of the calendar.
     /// </summary>
     [Parameter] public string SelectedDateAriaAtomic { get; set; } = "Selected date {0}";
 
+    /// <summary>
+    /// Whether the GoToNow button should be shown or not.
+    /// </summary>
+    [Parameter] public bool ShowGoToNow { get; set; } = true;
+
     /// <summary>
     /// Whether the GoToToday button should be shown or not.
     /// </summary>
     [Parameter] public bool ShowGoToToday { get; set; } = true;
 
     /// <summary>
-    /// Whether the GoToNow button should be shown or not.
+    /// Whether the month picker is shown or hidden.
     /// </summary>
-    [Parameter] public bool ShowGoToNow { get; set; } = true;
+    [Parameter]
+    [CallOnSet(nameof(OnSetParameters))]
+    public bool ShowMonthPicker { get; set; } = true;
+
+    /// <summary>
+    /// Show month picker on top of date picker when visible.
+    /// </summary>
+    [Parameter] public bool ShowMonthPickerAsOverlay { get; set; }
 
     /// <summary>
     /// Whether the time picker should be shown or not.
@@ -250,68 +354,118 @@ private int _minuteView
     public bool ShowTimePicker { get; set; }
 
     /// <summary>
-    /// The time format of the time-picker, 24H or 12H.
+    /// Show time picker on top of date picker when visible.
     /// </summary>
-    [Parameter] public BitTimeFormat TimeFormat { get; set; }
+    [Parameter] public bool ShowTimePickerAsOverlay { get; set; }
 
     /// <summary>
-    /// TimeZone for the DatePicker.
+    /// Gets or sets the icon to display in the ShowTimePicker button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="ShowTimePickerIconName"/> when both are set.
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public TimeZoneInfo? TimeZone { get; set; }
+    [Parameter] public BitIconInfo? ShowTimePickerIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the ShowTimePicker button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? ShowTimePickerIconName { get; set; }
+
+    /// <summary>
+    /// The title of the ShowTimePicker button (tooltip).
+    /// </summary>
+    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
 
     /// <summary>
     /// Whether the week number (weeks 1 to 53) should be shown before each week row.
     /// </summary>
     [Parameter] public bool ShowWeekNumbers { get; set; }
 
+    /// <summary>
+    /// Specifies the date and time of the calendar when it is showing without any selected value.
+    /// </summary>
+    [Parameter]
+    [CallOnSet(nameof(OnSetParameters))]
+    public DateTimeOffset? StartingValue { get; set; }
+
     /// <summary>
     /// Custom CSS styles for different parts of the BitCalendar component.
     /// </summary>
     [Parameter] public BitCalendarClassStyles? Styles { get; set; }
 
     /// <summary>
-    /// The title of the week number (tooltip).
+    /// The time format of the time-picker, 24H or 12H.
     /// </summary>
-    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
+    [Parameter] public BitTimeFormat TimeFormat { get; set; }
 
     /// <summary>
-    /// Used to customize how content inside the year cell is rendered.
+    /// Gets or sets the icon to display in the decrease-hour button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="TimePickerDecreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
+    [Parameter] public BitIconInfo? TimePickerDecreaseHourIcon { get; set; }
 
     /// <summary>
-    /// The title of the year picker's toggle (tooltip).
+    /// Gets or sets the name of the icon to display in the decrease-hour button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
+    [Parameter] public string? TimePickerDecreaseHourIconName { get; set; }
 
     /// <summary>
-    /// The title of the year range picker's toggle (tooltip).
+    /// Gets or sets the icon to display in the decrease-minute button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="TimePickerDecreaseMinuteIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
+    [Parameter] public BitIconInfo? TimePickerDecreaseMinuteIcon { get; set; }
 
     /// <summary>
-    /// Show month picker on top of date picker when visible.
+    /// Gets or sets the name of the icon to display in the decrease-minute button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public bool ShowTimePickerAsOverlay { get; set; }
+    [Parameter] public string? TimePickerDecreaseMinuteIconName { get; set; }
 
     /// <summary>
-    /// Determines increment/decrement steps for calendar's hour.
+    /// Gets or sets the icon to display in the increase-hour button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="TimePickerIncreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public int HourStep { get; set; } = 1;
+    [Parameter] public BitIconInfo? TimePickerIncreaseHourIcon { get; set; }
 
     /// <summary>
-    /// Determines increment/decrement steps for calendar's minute.
+    /// Gets or sets the name of the icon to display in the increase-hour button from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public int MinuteStep { get; set; } = 1;
+    [Parameter] public string? TimePickerIncreaseHourIconName { get; set; }
 
     /// <summary>
-    /// Specifies the date and time of the calendar when it is showing without any selected value.
+    /// Gets or sets the icon to display in the increase-minute button using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="TimePickerIncreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? TimePickerIncreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the name of the icon to display in the increase-minute button from the built-in Fluent UI icons.
+    /// </summary>
+    [Parameter] public string? TimePickerIncreaseMinuteIconName { get; set; }
+
+    /// <summary>
+    /// TimeZone for the DatePicker.
     /// </summary>
     [Parameter]
     [CallOnSet(nameof(OnSetParameters))]
-    public DateTimeOffset? StartingValue { get; set; }
+    public TimeZoneInfo? TimeZone { get; set; }
+
+    /// <summary>
+    /// The title of the week number (tooltip).
+    /// </summary>
+    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
+
+    /// <summary>
+    /// Used to customize how content inside the year cell is rendered.
+    /// </summary>
+    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
+
+    /// <summary>
+    /// The title of the year picker's toggle (tooltip).
+    /// </summary>
+    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
+
+    /// <summary>
+    /// The title of the year range picker's toggle (tooltip).
+    /// </summary>
+    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
 
 
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scss
index f7fcfeeb6a..1fae265f32 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Calendar/BitCalendar.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 
 .bit-cal {
     margin: 0;
@@ -275,7 +275,7 @@
         background-color: transparent;
 
         .bit-icon,
-        .bit-cal-gti {
+        .bit-cal-ico {
             color: $clr-fg-dis;
         }
     }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor
index 01995aaff4..ba6cd62726 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor
@@ -237,7 +237,43 @@
             </div>
     </DemoExample>
 
-    <DemoExample Title="Style & Class" RazorCode="@example12RazorCode" Id="example12">
+    <DemoExample Title="External Icons" RazorCode="@example12RazorCode" Id="example12">
+            <div>
+                Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>GoToTodayIcon</b>, <b>GoToNowIcon</b>, <b>PrevMonthNavIcon</b>, <b>NextMonthNavIcon</b>, and other icon parameters.
+                <br /><br />
+                For built-in icons use the <b>IconName</b> variant of each parameter (e.g. <b>GoToTodayIconName</b>).
+                <br /><br />
+                The <b>Icon</b> parameters accept a
+                <BitLink Href="#bit-icon-info">BitIconInfo</BitLink> value, created via helpers like <b>BitIconInfo.Fa(...)</b>, <b>BitIconInfo.Bi(...)</b>, or <b>BitIconInfo.Css(...)</b>.
+            </div>
+            <br /><br />
+
+            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+            <div>FontAwesome icons:</div>
+            <br />
+            <BitCalendar GoToTodayIcon="@BitIconInfo.Fa("solid calendar-day")"
+                         PrevMonthNavIcon="@BitIconInfo.Fa("solid chevron-left")"
+                         NextMonthNavIcon="@BitIconInfo.Fa("solid chevron-right")" />
+
+            <br /><br /><br />
+
+            <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+            <div>Bootstrap icons (with ShowTimePicker):</div>
+            <br />
+            <BitCalendar ShowTimePicker="true"
+                         GoToTodayIcon="@BitIconInfo.Bi("calendar-check")"
+                         GoToNowIcon="@BitIconInfo.Bi("clock")"
+                         PrevMonthNavIcon="@BitIconInfo.Bi("chevron-left")"
+                         NextMonthNavIcon="@BitIconInfo.Bi("chevron-right")"
+                         TimePickerIncreaseHourIcon="@BitIconInfo.Bi("chevron-up")"
+                         TimePickerDecreaseHourIcon="@BitIconInfo.Bi("chevron-down")"
+                         TimePickerIncreaseMinuteIcon="@BitIconInfo.Bi("chevron-up")"
+                         TimePickerDecreaseMinuteIcon="@BitIconInfo.Bi("chevron-down")" />
+    </DemoExample>
+
+    <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" Id="example13">
             <div>Showcases custom styling and class usage for the calendar component.</div>
             <br /><br />
             <div>Component's Style & Class:</div>
@@ -275,7 +311,7 @@
             </div>
     </DemoExample>
 
-    <DemoExample Title="RTL" RazorCode="@example11RazorCode" Id="example13">
+    <DemoExample Title="RTL" RazorCode="@example14RazorCode" Id="example14">
             <div>Use BitCalendar in right-to-left (RTL).</div>
             <br />
             <div class="example-content">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.cs
index ce4ef67a80..529940b931 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.cs
@@ -56,6 +56,31 @@ public partial class BitCalendarDemo
             Description = "The title of the Go to next year button (tooltip)."
         },
         new()
+        {
+            Name = "GoToNowIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the GoToNow button using custom CSS classes for external icon libraries. Takes precedence over GoToNowIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "GoToNowIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the GoToNow button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "GoToNowTitle",
+            Type = "string",
+            DefaultValue = "Go to now",
+            Description = "The title of the GoToNow button (tooltip)."
+        },
+        new()
         {
             Name = "GoToPrevMonthTitle",
             Type = "string",
@@ -77,6 +102,24 @@ public partial class BitCalendarDemo
             Description = "The title of the Go to previous year button (tooltip)."
         },
         new()
+        {
+            Name = "GoToTodayIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the GoToToday button using custom CSS classes for external icon libraries. Takes precedence over GoToTodayIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "GoToTodayIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the GoToToday button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
         {
             Name = "GoToTodayTitle",
             Type = "string",
@@ -85,10 +128,28 @@ public partial class BitCalendarDemo
         },
         new()
         {
-            Name = "GoToNowTitle",
+            Name = "HideTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the HideTimePicker button using custom CSS classes for external icon libraries. Takes precedence over HideTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "HideTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the HideTimePicker button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "HideTimePickerTitle",
             Type = "string",
-            DefaultValue = "Go to now",
-            Description = "The title of the GoToNow button (tooltip)."
+            DefaultValue = "Hide time picker",
+            Description = "The title of the HideTimePicker button (tooltip)."
         },
         new()
         {
@@ -106,10 +167,10 @@ public partial class BitCalendarDemo
         },
         new()
         {
-            Name = "HideTimePickerTitle",
-            Type = "string",
-            DefaultValue = "Hide time picker",
-            Description = "The title of the HideTimePicker button (tooltip)."
+            Name = "HourStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for calendar's hour.",
         },
         new()
         {
@@ -119,13 +180,6 @@ public partial class BitCalendarDemo
             Description = "The custom validation error message for the invalid value."
         },
         new()
-        {
-            Name = "ShowMonthPicker",
-            Type = "bool",
-            DefaultValue = "true",
-            Description = "Whether the month picker is shown or hidden."
-        },
-        new()
         {
             Name = "MaxDate",
             Type = "DateTimeOffset",
@@ -140,6 +194,13 @@ public partial class BitCalendarDemo
             Description = "The minimum allowable date of the calendar."
         },
         new()
+        {
+            Name = "MinuteStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for calendar's minute.",
+        },
+        new()
         {
             Name = "MonthCellTemplate",
             Type = "RenderFragment<DateTimeOffset>?",
@@ -155,10 +216,57 @@ public partial class BitCalendarDemo
         },
         new()
         {
-            Name = "ShowMonthPickerAsOverlay",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Show month picker on top of date picker when visible."
+            Name = "NextMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to next month button using custom CSS classes for external icon libraries. Takes precedence over NextMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "NextMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to next month button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "NextYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to next year button using custom CSS classes for external icon libraries. Takes precedence over NextYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "NextYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to next year button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to next year range button using custom CSS classes for external icon libraries. Takes precedence over NextYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to next year range button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
         },
         new()
         {
@@ -167,6 +275,60 @@ public partial class BitCalendarDemo
             Description = "Callback for when the user selects a date."
         },
         new()
+        {
+            Name = "PrevMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to previous month button using custom CSS classes for external icon libraries. Takes precedence over PrevMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "PrevMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to previous month button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "PrevYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to previous year button using custom CSS classes for external icon libraries. Takes precedence over PrevYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "PrevYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to previous year button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the Go to previous year range button using custom CSS classes for external icon libraries. Takes precedence over PrevYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the Go to previous year range button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
         {
             Name = "SelectedDateAriaAtomic",
             Type = "string",
@@ -174,6 +336,13 @@ public partial class BitCalendarDemo
             Description = "The text of selected date aria-atomic of the calendar."
         },
         new()
+        {
+            Name = "ShowGoToNow",
+            Type = "bool",
+            DefaultValue = "true",
+            Description = "Whether the GoToNow button should be shown or not."
+        },
+        new()
         {
             Name = "ShowGoToToday",
             Type = "bool",
@@ -181,6 +350,20 @@ public partial class BitCalendarDemo
             Description = "Whether the GoToToday button should be shown or not."
         },
         new()
+        {
+            Name = "ShowMonthPicker",
+            Type = "bool",
+            DefaultValue = "true",
+            Description = "Whether the month picker is shown or hidden."
+        },
+        new()
+        {
+            Name = "ShowMonthPickerAsOverlay",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Show month picker on top of date picker when visible."
+        },
+        new()
         {
             Name = "ShowTimePicker",
             Type = "bool",
@@ -188,6 +371,24 @@ public partial class BitCalendarDemo
             Description = "Whether the time picker should be shown or not."
         },
         new()
+        {
+            Name = "ShowTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the ShowTimePicker button using custom CSS classes for external icon libraries. Takes precedence over ShowTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "ShowTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the ShowTimePicker button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
         {
             Name = "ShowTimePickerTitle",
             Type = "string",
@@ -202,13 +403,6 @@ public partial class BitCalendarDemo
             Description = "Whether the week number (weeks 1 to 53) should be shown before each week row."
         },
         new()
-        {
-            Name = "ShowGoToNow",
-            Type = "bool",
-            DefaultValue = "true",
-            Description = "Whether the GoToNow button should be shown or not."
-        },
-        new()
         {
             Name = "StartingValue",
             Type = "DateTimeOffset?",
@@ -234,6 +428,78 @@ public partial class BitCalendarDemo
             Href = "#time-format-enum"
         },
         new()
+        {
+            Name = "TimePickerDecreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the decrease-hour button using custom CSS classes for external icon libraries. Takes precedence over TimePickerDecreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the decrease-hour button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the decrease-minute button using custom CSS classes for external icon libraries. Takes precedence over TimePickerDecreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the decrease-minute button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the increase-hour button using custom CSS classes for external icon libraries. Takes precedence over TimePickerIncreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the increase-hour button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the icon to display in the increase-minute button using custom CSS classes for external icon libraries. Takes precedence over TimePickerIncreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info"
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "Gets or sets the name of the icon to display in the increase-minute button from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography"
+        },
+        new()
         {
             Name = "TimeZone",
             Type = "TimeZoneInfo?",
@@ -267,20 +533,6 @@ public partial class BitCalendarDemo
             Type = "string",
             DefaultValue = "{0} - {1}, change month",
             Description = "The title of the year range picker's toggle (tooltip)."
-        },
-        new()
-        {
-            Name = "HourStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for calendar's hour.",
-        },
-        new()
-        {
-            Name = "MinuteStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for calendar's minute.",
         }
     ];
 
@@ -332,7 +584,7 @@ public partial class BitCalendarDemo
                     Description="Show time pickers in 12 hours format.",
                     Value="1"
                 }
-            ]
+        ]
         }
     ];
 
@@ -653,7 +905,36 @@ public partial class BitCalendarDemo
                     Description = "Custom CSS classes/styles for each year button of the BitCalendar."
                 }
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.samples.cs
index aa10630371..b13d33ca77 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Calendar/BitCalendarDemo.razor.samples.cs
@@ -167,6 +167,26 @@ private void HandleValidSubmit() { }
 </BitCalendar>";
 
     private readonly string example12RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitCalendar GoToTodayIcon=""@BitIconInfo.Fa(""solid calendar-day"")""
+             PrevMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-left"")""
+             NextMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-right"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitCalendar ShowTimePicker=""true""
+             GoToTodayIcon=""@BitIconInfo.Bi(""calendar-check"")""
+             GoToNowIcon=""@BitIconInfo.Bi(""clock"")""
+             PrevMonthNavIcon=""@BitIconInfo.Bi(""chevron-left"")""
+             NextMonthNavIcon=""@BitIconInfo.Bi(""chevron-right"")""
+             TimePickerIncreaseHourIcon=""@BitIconInfo.Bi(""chevron-up"")""
+             TimePickerDecreaseHourIcon=""@BitIconInfo.Bi(""chevron-down"")""
+             TimePickerIncreaseMinuteIcon=""@BitIconInfo.Bi(""chevron-up"")""
+             TimePickerDecreaseMinuteIcon=""@BitIconInfo.Bi(""chevron-down"")"" />";
+
+    private readonly string example13RazorCode = @"
 <style>
     .custom-class {
         margin: 1rem;
@@ -256,6 +276,6 @@ private void HandleValidSubmit() { }
                              WeekNumbersHeader = ""custom-week-header"",
                              YearMonthPickerWrapper = ""custom-year-picker"" })"" />";
 
-    private readonly string example13RazorCode = @"
+    private readonly string example14RazorCode = @"
 <BitCalendar Dir=""BitDir.Rtl"" />";
 }
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Calendar/BitCalendarTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Calendar/BitCalendarTests.cs
index 39aee79fcd..c55ca15e9f 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Calendar/BitCalendarTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Calendar/BitCalendarTests.cs
@@ -100,4 +100,566 @@ public void BitCalendarSelectingTodayShouldUpdateValue()
         Assert.AreEqual(DateTimeOffset.Now.Date, component.Instance.Value!.Value.Date);
         Assert.AreEqual(TimeZoneInfo.Local.GetUtcOffset(DateTimeOffset.Now), component.Instance.Value!.Value.Offset);
     }
+
+    [TestMethod,
+        DataRow("Up", null, "bit-icon bit-icon--Up"),
+        DataRow(null, "chevron-left", "fa fa-chevron-left"),
+        DataRow("ChevronLeft", "chevron-left", "fa fa-chevron-left")]
+    public void BitCalendarShouldRespectPrevMonthNavIconName(string? iconName, string? externalIconName, string expectedClass)
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevMonthNavIconName, iconName);
+            }
+
+            if (externalIconName is not null)
+            {
+                parameters.Add(p => p.PrevMonthNavIcon, new BitIconInfo(externalIconName, "fa", "fa-"));
+            }
+        });
+
+        var icon = component.Find(".bit-cal-nbt:first-child i");
+
+        foreach (var expectedCls in expectedClass.Split(' ', StringSplitOptions.RemoveEmptyEntries))
+        {
+            Assert.IsTrue(icon.ClassList.Contains(expectedCls));
+        }
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevMonthNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            
+            parameters.Add(p => p.PrevMonthNavIconName, "Up");
+            parameters.Add(p => p.PrevMonthNavIcon, BitIconInfo.Css("fa-solid fa-arrow-left"));
+        });
+
+        var icon = component.Find(".bit-cal-nbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+    }
+
+    [TestMethod]
+    public void BitCalendarGoToTodayIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.GoToTodayIconName, "CustomTodayIcon");
+        });
+
+        var icon = component.Find(".bit-cal-gtb i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomTodayIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarGoToTodayIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.GoToTodayIcon, BitIconInfo.Css("fa-solid fa-calendar-day"));
+        });
+
+        var icon = component.Find(".bit-cal-gtb i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-calendar-day"));
+    }
+
+    [TestMethod]
+    public void BitCalendarGoToTodayIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.GoToTodayIconName, "GotoToday");
+            parameters.Add(p => p.GoToTodayIcon, BitIconInfo.Css("fa-solid fa-calendar-check"));
+        });
+
+        var icon = component.Find(".bit-cal-gtb i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-calendar-check"));
+    }
+
+    [TestMethod]
+    public void BitCalendarShowTimePickerIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowTimePickerAsOverlay, true);
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.ShowTimePickerIconName, "CustomClockIcon");
+            parameters.Add(p => p.Classes, new BitCalendarClassStyles { ShowTimePickerIcon = "picker-icon" });
+        });
+
+        var icon = component.Find(".picker-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomClockIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarShowTimePickerIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowTimePickerAsOverlay, true);
+            parameters.Add(p => p.ShowGoToToday, false);
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.ShowTimePickerIcon, BitIconInfo.Css("fa-solid fa-clock"));
+            parameters.Add(p => p.Classes, new BitCalendarClassStyles { ShowTimePickerIcon = "picker-icon" });
+        });
+
+        var icon = component.Find(".picker-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-clock"));
+    }
+
+    [TestMethod]
+    public void BitCalendarGoToNowIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.GoToNowIconName, "CustomNowIcon");
+        });
+
+        var icon = component.Find(".bit-cal-gtn i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomNowIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarGoToNowIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.GoToNowIcon, BitIconInfo.Css("bi bi-clock"));
+        });
+
+        var icon = component.Find(".bit-cal-gtn i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bi"));
+        Assert.IsTrue(icon.ClassList.Contains("bi-clock"));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerIncreaseHourIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseHourIconName, "CustomUpIcon");
+        });
+
+        var icon = component.Find(".bit-cal-tpr:first-child .bit-cal-tbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomUpIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerIncreaseHourIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseHourIcon, BitIconInfo.Css("bi bi-chevron-up"));
+        });
+
+        var icon = component.Find(".bit-cal-tpr:first-child .bit-cal-tbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bi-chevron-up"));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseHourIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseHourIconName, "CustomDownIcon");
+        });
+
+        var icon = component.Find(".bit-cal-tpr:first-child .bit-cal-tbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomDownIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseHourIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseHourIcon, BitIconInfo.Css("bi bi-chevron-down"));
+        });
+
+        var icon = component.Find(".bit-cal-tpr:first-child .bit-cal-tbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bi-chevron-down"));
+    }
+
+    [TestMethod]
+    public void BitCalendarNextMonthNavIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.NextMonthNavIconName, "CustomNextIcon");
+        });
+
+        var icon = component.Find(".bit-cal-nbc .bit-cal-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--CustomNextIcon"));
+    }
+
+    [TestMethod]
+    public void BitCalendarNextMonthNavIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.NextMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-right"));
+        });
+
+        var icon = component.Find(".bit-cal-nbc .bit-cal-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-right"));
+    }
+
+    [TestMethod]
+    public void BitCalendarNextMonthNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowMonthPicker, false);
+            parameters.Add(p => p.NextMonthNavIconName, "ShouldNotRender");
+            parameters.Add(p => p.NextMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-right"));
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-chevron-right", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearNavIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearNavIconName, "CustomPrevYearIcon");
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("bit-icon--CustomPrevYearIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearNavIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-left"));
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-angles-left", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearNavIconName, "ShouldNotRender");
+            parameters.Add(p => p.PrevYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-left"));
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-angles-left", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearNavIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearNavIconName, "CustomNextYearIcon");
+        });
+    
+        var markup = component.Markup;
+        
+        Assert.Contains("bit-icon--CustomNextYearIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearNavIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-right"));
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-angles-right", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearNavIconName, "ShouldNotRender");
+            parameters.Add(p => p.NextYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-right"));
+        });
+        
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-angles-right", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearRangeNavIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearRangeNavIconName, "CustomPrevYearRangeIcon");
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+
+        var markup = component.Markup;
+    
+        Assert.Contains("bit-icon--CustomPrevYearRangeIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearRangeNavIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-backward"));
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+
+        var markup = component.Markup;
+    
+        Assert.Contains("fa-backward", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarPrevYearRangeNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.PrevYearRangeNavIconName, "ShouldNotRender");
+            parameters.Add(p => p.PrevYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-backward"));
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+
+        var markup = component.Markup;
+        
+        Assert.Contains("fa-backward", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearRangeNavIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearRangeNavIconName, "CustomNextYearRangeIcon");
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("bit-icon--CustomNextYearRangeIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearRangeNavIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-forward"));
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+
+        var markup = component.Markup;
+        
+        Assert.Contains("fa-forward", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarNextYearRangeNavIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.NextYearRangeNavIconName, "ShouldNotRender");
+            parameters.Add(p => p.NextYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-forward"));
+        });
+
+        var ptb = component.Find(".bit-cal-ptb");
+
+        ptb.Click();
+
+        var markup = component.Markup;
+
+        Assert.Contains("fa-forward", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerIncreaseMinuteIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseMinuteIconName, "CustomIncMinuteIcon");
+        });
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("bit-icon--CustomIncMinuteIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerIncreaseMinuteIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+        });
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("fa-chevron-up", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerIncreaseMinuteIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseMinuteIconName, "ShouldNotRender");
+            parameters.Add(p => p.TimePickerIncreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+        });
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("fa-chevron-up", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseMinuteIconNameShouldRenderCustomIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseMinuteIconName, "CustomDecMinuteIcon");
+        });
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("bit-icon--CustomDecMinuteIcon", markup);
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseMinuteIconShouldRenderExternalIcon()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+        });
+        
+        var markup = component.Markup;
+        
+        Assert.Contains("fa-chevron-down", markup);
+    }
+
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseMinuteIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseMinuteIconName, "ShouldNotRender");
+            parameters.Add(p => p.TimePickerDecreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+        });
+        
+        var markup = component.Markup;
+
+        Assert.Contains("fa-chevron-down", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarHideTimePickerIconShouldHideTimePickerIcons()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, false);
+            parameters.Add(p => p.TimePickerIncreaseMinuteIconName, "HiddenIncMinuteIcon");
+            parameters.Add(p => p.TimePickerDecreaseMinuteIconName, "HiddenDecMinuteIcon");
+        });
+
+        var markup = component.Markup;
+
+        Assert.IsFalse(markup.Contains("bit-icon--HiddenIncMinuteIcon", StringComparison.Ordinal));
+        Assert.IsFalse(markup.Contains("bit-icon--HiddenDecMinuteIcon", StringComparison.Ordinal));
+    }
+
+    [TestMethod]
+    public void BitCalendarTimePickerDecreaseHourIconShouldTakePrecedenceOverIconName()
+    {
+        var component = RenderComponent<BitCalendar>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseHourIconName, "ShouldNotRender");
+            parameters.Add(p => p.TimePickerDecreaseHourIcon, BitIconInfo.Css("bi bi-chevron-down"));
+        });
+        
+        var markup = component.Markup;
+
+        Assert.Contains("bi-chevron-down", markup);
+        Assert.IsFalse(markup.Contains("bit-icon--ShouldNotRender", StringComparison.Ordinal));
+    }
 }

From 13256f1fad8ef41c1a5245a25d4ed0eb1a725511 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Tue, 17 Mar 2026 17:51:05 +0100
Subject: [PATCH 52/66] feat(templates): improve bit Boilerplate caching
 configuration #12184 (#12185)

---
 ...ogging, OpenTelemetry and Health Checks.md |  4 ++--
 .../src/Directory.Packages.props              |  9 +++----
 .../Boilerplate.Server.Shared.csproj          |  1 +
 .../Extensions/IConfigurationExtensions.cs    |  0
 .../WebApplicationBuilderExtensions.cs        | 24 +++++++++++++++----
 .../ISharedServiceCollectionExtensions.cs     |  4 +++-
 6 files changed, 31 insertions(+), 11 deletions(-)
 rename src/Templates/Boilerplate/Bit.Boilerplate/src/Server/{Boilerplate.Server.Api => Boilerplate.Server.Shared}/Infrastructure/Extensions/IConfigurationExtensions.cs (100%)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/15- Logging, OpenTelemetry and Health Checks.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/15- Logging, OpenTelemetry and Health Checks.md
index e462e8edb3..6d8d82a801 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/15- Logging, OpenTelemetry and Health Checks.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/15- Logging, OpenTelemetry and Health Checks.md	
@@ -359,8 +359,8 @@ public static IHealthChecksBuilder AddDefaultHealthChecks<TBuilder>(this TBuilde
     where TBuilder : IHostApplicationBuilder
 {
     return builder.Services.AddHealthChecks()
-        .AddDiskStorageHealthCheck(opt => 
-            opt.AddDrive(Path.GetPathRoot(Directory.GetCurrentDirectory())!, 
+        .AddDiskStorageHealthCheck(options => 
+            options.AddDrive(Path.GetPathRoot(Directory.GetCurrentDirectory())!, 
             minimumFreeMegabytes: 5 * 1024), 
             tags: ["live"]);
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 1cc4e6b4fa..7d7f6bacd8 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -113,11 +113,12 @@
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta7" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.2" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.2" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.5.0" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.6.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
         <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.4" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.4" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Locking.Distributed.Redis" Version="2.6.0" />
         <!--/-:msbuild-conditional:noEmit -->
         <PackageVersion Include="Humanizer" Version="3.0.10" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
@@ -148,8 +149,8 @@
         <PackageVersion Include="System.Text.Json" Version="10.0.0" />
         <PackageVersion Include="FakeItEasy" Version="9.0.1" />
         <PackageVersion Include="Microsoft.Playwright.MSTest.v4" Version="1.58.0" />
-        <PackageVersion Include="ZiggyCreatures.FusionCache.AspNetCore.OutputCaching" Version="2.5.0" />
-        <PackageVersion Include="ZiggyCreatures.FusionCache.OpenTelemetry" Version="2.5.0" />
-        <PackageVersion Include="ZiggyCreatures.FusionCache.Serialization.SystemTextJson" Version="2.5.0" />
+        <PackageVersion Include="ZiggyCreatures.FusionCache.AspNetCore.OutputCaching" Version="2.6.0" />
+        <PackageVersion Include="ZiggyCreatures.FusionCache.OpenTelemetry" Version="2.6.0" />
+        <PackageVersion Include="ZiggyCreatures.FusionCache.Serialization.SystemTextJson" Version="2.6.0" />
     </ItemGroup>
 </Project>
\ No newline at end of file
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Boilerplate.Server.Shared.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Boilerplate.Server.Shared.csproj
index 97123818a8..1f19058efa 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Boilerplate.Server.Shared.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Boilerplate.Server.Shared.csproj
@@ -27,6 +27,7 @@
         <PackageReference Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" />
         <PackageReference Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" />
         <PackageReference Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" />
+        <PackageReference Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Locking.Distributed.Redis" />
         <PackageReference Include="OpenTelemetry.Resources.Azure" />
         <PackageReference Include="OpenTelemetry.Resources.Container" />
         <PackageReference Include="OpenTelemetry.Resources.Host" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/IConfigurationExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/IConfigurationExtensions.cs
similarity index 100%
rename from src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Infrastructure/Extensions/IConfigurationExtensions.cs
rename to src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/IConfigurationExtensions.cs
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
index 726613c4ae..a893a35a92 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Shared/Infrastructure/Extensions/WebApplicationBuilderExtensions.cs
@@ -59,9 +59,11 @@ public static TBuilder AddServerSharedServices<TBuilder>(this TBuilder builder)
         //#endif
 
         services.AddFusionCache()
+            .AsHybridCache()
+            .WithRegisteredMemoryCache()
             .WithDefaultEntryOptions(options => options.Size = 1)
             // Auto-clone cached objects to avoid further issues after scaling out and switching to distributed caching.
-            .WithOptions(opt => opt.DefaultEntryOptions.EnableAutoClone = true)
+            .WithOptions(options => options.DefaultEntryOptions.EnableAutoClone = true)
             //#if(redis == true)
             // Use Redis backplane for cache synchronization across multiple server instances
             .WithDistributedCache(sp =>
@@ -75,12 +77,26 @@ public static TBuilder AddServerSharedServices<TBuilder>(this TBuilder builder)
                 {
                     ConnectionMultiplexerFactory = async () => sp.GetRequiredKeyedService<StackExchange.Redis.IConnectionMultiplexer>("redis-cache"),
                 }))
+            .WithDistributedLocker(sp => new ZiggyCreatures.Caching.Fusion.Locking.Distributed.Redis.RedisDistributedLocker(new ZiggyCreatures.Caching.Fusion.Locking.Distributed.Redis.RedisDistributedLockerOptions
+            {
+                ConnectionMultiplexerFactory = async () => sp.GetRequiredKeyedService<StackExchange.Redis.IConnectionMultiplexer>("redis-cache"),
+            }))
             //#endif
             .WithSerializer(new FusionCacheSystemTextJsonSerializer())
             .WithCacheKeyPrefix("Boilerplate:Cache:");
 
         services.AddFusionOutputCache(); // For ASP.NET Core Output Caching with FusionCache
 
+        // Registering Microsoft's IDistributedCache here doesn't mean you have to use it in your code. It's only for libraries that might rely on it.
+        //#if(redis == true)
+        services.AddStackExchangeRedisCache(options =>
+        {
+            options.Configuration = configuration.GetRequiredConnectionString("redis-cache");
+        });
+        //#else
+        services.AddDistributedMemoryCache();
+        //#endif
+
         services.AddHttpContextAccessor();
 
         services.AddResponseCompression(opts =>
@@ -90,8 +106,8 @@ public static TBuilder AddServerSharedServices<TBuilder>(this TBuilder builder)
             opts.Providers.Add<BrotliCompressionProvider>();
             opts.Providers.Add<GzipCompressionProvider>();
         })
-            .Configure<BrotliCompressionProviderOptions>(opt => opt.Level = CompressionLevel.Fastest)
-            .Configure<GzipCompressionProviderOptions>(opt => opt.Level = CompressionLevel.Fastest);
+            .Configure<BrotliCompressionProviderOptions>(options => options.Level = CompressionLevel.Fastest)
+            .Configure<GzipCompressionProviderOptions>(options => options.Level = CompressionLevel.Fastest);
 
         services.AddAntiforgery();
 
@@ -251,6 +267,6 @@ public static IHealthChecksBuilder AddDefaultHealthChecks<TBuilder>(this TBuilde
             build: static policy => policy.Expire(TimeSpan.FromSeconds(10))));
 
         return builder.Services.AddHealthChecks()
-            .AddDiskStorageHealthCheck(opt => opt.AddDrive(Path.GetPathRoot(Directory.GetCurrentDirectory())!, minimumFreeMegabytes: 5 * 1024), tags: ["live"]);
+            .AddDiskStorageHealthCheck(options => options.AddDrive(Path.GetPathRoot(Directory.GetCurrentDirectory())!, minimumFreeMegabytes: 5 * 1024), tags: ["live"]);
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
index 447447aa87..557a172b02 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
@@ -2,6 +2,7 @@
 using Boilerplate.Shared.Features.Identity;
 using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Components.Web;
+using Microsoft.Extensions.Caching.Memory;
 
 namespace Microsoft.Extensions.DependencyInjection;
 
@@ -38,10 +39,11 @@ public static IServiceCollection AddSharedProjectServices(this IServiceCollectio
         services.ConfigureAuthorizationCore();
 
         services.AddLocalization();
-        services.AddMemoryCache(options =>
+        services.Configure<MemoryCacheOptions>(options =>
         {
             configuration.GetRequiredSection("MemoryCache").Bind(options);
         });
+        services.AddMemoryCache();
 
         return services;
     }

From 3225aa89aa98e5fd6df2778fcac4b51d7f69fb30 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Tue, 17 Mar 2026 17:54:58 +0100
Subject: [PATCH 53/66] feat(deps): Update project dependencies #12178 (#12179)

---
 .../Bit.Besql.Demo.Client.csproj              |  2 +-
 .../Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj |  6 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  2 +-
 .../Bit.BlazorUI.Demo.Shared.csproj           |  8 +-
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  8 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  4 +-
 .../Bit.Bswup.Demo/Bit.Bswup.Demo.csproj      |  4 +-
 .../Bit.Bswup.NewDemo.Client.csproj           |  2 +-
 .../Bit.Bswup.NewDemo.csproj                  |  2 +-
 .../Client/Bit.Bswup.Demo.Client.csproj       |  4 +-
 .../Server/Bit.Bswup.Demo.Server.csproj       |  2 +-
 .../Bit.Butil.Demo.Maui.csproj                |  2 +-
 .../Bit.Butil.Demo.Web.csproj                 |  4 +-
 .../Bit.ResxTranslator.csproj                 |  8 +-
 .../20260119232453_Initial.Designer.cs        |  2 +-
 .../AppOfflineDbContextModelSnapshot.cs       |  2 +-
 .../src/Directory.Packages.props              | 84 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        |  4 +-
 .../Bit.Websites.Careers.Server.csproj        |  6 +-
 .../Bit.Websites.Careers.Shared.csproj        |  6 +-
 .../Bit.Websites.Platform.Client.csproj       |  6 +-
 .../Bit.Websites.Platform.Server.csproj       |  6 +-
 .../Bit.Websites.Platform.Shared.csproj       |  6 +-
 .../Bit.Websites.Sales.Client.csproj          |  4 +-
 .../Bit.Websites.Sales.Server.csproj          |  6 +-
 .../Bit.Websites.Sales.Shared.csproj          |  6 +-
 26 files changed, 98 insertions(+), 98 deletions(-)

diff --git a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
index f696a1c6aa..396f0b5636 100644
--- a/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo.Client/Bit.Besql.Demo.Client.csproj
@@ -10,7 +10,7 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
index 66f19056f5..3a3523cfa1 100644
--- a/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
+++ b/src/Besql/Demo/Bit.Besql.Demo/Bit.Besql.Demo.csproj
@@ -8,7 +8,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\Bit.Besql.Demo.Client\Bit.Besql.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
@@ -17,11 +17,11 @@
              and open Nuget Package Manager Console, and select `Bit.Besql.Demo.Client` project as default project
              Then run either Add-Migration MigrationName -OutputDir Data\Migrations or
              Optimize-DbContext -OutputDir Data\CompiledModel commands. -->
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.4">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tasks" Version="10.0.5">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.4">
+        <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.5">
           <PrivateAssets>all</PrivateAssets>
           <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 925e99b44a..d69535213d 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -30,7 +30,7 @@
         <PackageReference Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
         <PackageReference Include="AspNetCore.HealthChecks.UI.InMemory.Storage" Version="9.0.0" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index b5df1f957c..f7c37555d0 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -13,10 +13,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
-        <PackageReference Include="System.Text.Json" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Localization" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.5" />
+        <PackageReference Include="System.Text.Json" Version="10.0.5" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 19d9d4034e..45db7dd0dc 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -24,10 +24,10 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Json" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index ec04e258a4..14d7b18e79 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -39,9 +39,9 @@
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
 
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
         <PackageReference Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.50" />
-        <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
+        <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.3856.49" />
         <PackageReference Include="Velopack" Version="0.0.1298" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
         <Content Include="..\Bit.BlazorUI.Demo.Client.Maui\wwwroot\index.html" Link="wwwroot\index.html">
diff --git a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
index 21db792447..7d9b419c8d 100644
--- a/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
+++ b/src/Bswup/Bit.Bswup.Demo/Bit.Bswup.Demo.csproj
@@ -8,8 +8,8 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.5" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
index cb7a6069b8..438942f229 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/Bit.Bswup.NewDemo.Client.csproj
@@ -13,7 +13,7 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
index 830dad20d7..5392b155e2 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.csproj
@@ -8,7 +8,7 @@
 
   <ItemGroup>
     <ProjectReference Include="..\Bit.Bswup.NewDemo.Client\Bit.Bswup.NewDemo.Client.csproj" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
   </ItemGroup>
 
 </Project>
diff --git a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
index 23137718b3..c4022ba441 100644
--- a/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
+++ b/src/Bswup/FullDemo/Client/Bit.Bswup.Demo.Client.csproj
@@ -9,8 +9,8 @@
 
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.5" PrivateAssets="all" />
 
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
     </ItemGroup>
diff --git a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
index 9b3beedef9..f8c59f33c1 100644
--- a/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
+++ b/src/Bswup/FullDemo/Server/Bit.Bswup.Demo.Server.csproj
@@ -8,7 +8,7 @@
     <ItemGroup>
         <ProjectReference Include="..\..\Bit.Bswup\Bit.Bswup.csproj" />
         <ProjectReference Include="..\Client\Bit.Bswup.Demo.Client.csproj" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
index 400566a612..93298f4924 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Maui/Bit.Butil.Demo.Maui.csproj
@@ -52,7 +52,7 @@
     <ItemGroup>
         <PackageReference Include="Microsoft.Maui.Controls" Version="10.0.50" />
         <PackageReference Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.50" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Debug" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
index cfb493bb5c..6713f0ec06 100644
--- a/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
+++ b/src/Butil/Demo/Bit.Butil.Demo.Web/Bit.Butil.Demo.Web.csproj
@@ -7,8 +7,8 @@
   </PropertyGroup>
 
   <ItemGroup>
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.5" PrivateAssets="all" />
   </ItemGroup>
 
   <ItemGroup>
diff --git a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
index 8c6e8b30ab..1b7d4f067e 100644
--- a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
+++ b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
@@ -17,10 +17,10 @@
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Logging.Console" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.5" />
     </ItemGroup>
 
 </Project>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
index e247a54e70..77375d13e9 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/20260119232453_Initial.Designer.cs
@@ -17,7 +17,7 @@ partial class Initial
     protected override void BuildTargetModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.4");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.5");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
index 56e22be7c4..defe227b98 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Infrastructure/Data/Migrations/AppOfflineDbContextModelSnapshot.cs
@@ -14,7 +14,7 @@ partial class AppOfflineDbContextModelSnapshot : ModelSnapshot
     protected override void BuildModel(ModelBuilder modelBuilder)
     {
 #pragma warning disable 612, 618
-        modelBuilder.HasAnnotation("ProductVersion", "10.0.4");
+        modelBuilder.HasAnnotation("ProductVersion", "10.0.5");
 
         modelBuilder.Entity("Boilerplate.Shared.Dtos.Todo.TodoItemDto", b =>
             {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 7d7f6bacd8..0a7eb2f495 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -15,29 +15,29 @@
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
         <PackageVersion Include="HtmlSanitizer" Version="9.0.892" />
-        <PackageVersion Include="libphonenumber-csharp" Version="9.0.25" />
+        <PackageVersion Include="libphonenumber-csharp" Version="9.0.26" />
         <PackageVersion Include="Meziantou.Framework.Win32.Jobs" Version="3.5.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Authorization" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="10.0.5" />
         <PackageVersion Include="Asp.Versioning.Mvc" Version="8.1.1" />
         <PackageVersion Include="Asp.Versioning.Mvc.ApiExplorer" Version="8.1.1" />
         <PackageVersion Include="EmbedIO" Version="3.5.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.DataProtection.EntityFrameworkCore" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.OpenApi" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Caching.Memory" Version="10.0.5" />
         <PackageVersion Include="AspNetCore.HealthChecks.Hangfire" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
         <PackageVersion Include="AspNetCore.HealthChecks.UI.Client" Version="9.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.EnvironmentVariables" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Diagnostics.HealthChecks.EntityFrameworkCore" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Options.DataAnnotations" Version="10.0.5" />
         <PackageVersion Include="Microsoft.Maui.Controls" Version="10.0.50" />
         <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.Maui" Version="10.0.50" />
         <PackageVersion Include="Microsoft.AspNetCore.Components.WebView.WindowsForms" Version="10.0.50" />
-        <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3800.47" />
+        <PackageVersion Include="Microsoft.Web.WebView2" Version="1.0.3856.49" />
         <PackageVersion Include="MSTest" Version="4.1.0" />
         <PackageVersion Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageVersion Include="OpenTelemetry.Instrumentation.EntityFrameworkCore" Version="1.15.0-beta.1" />
@@ -50,13 +50,13 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.6" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.10" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.Console" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventLog" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.5" />
         <!--/+:msbuild-conditional:noEmit -->
         <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.1.0" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.2-preview.1.26125.13" />
@@ -81,9 +81,9 @@
         <PackageVersion Include="OpenTelemetry.Instrumentation.Runtime" Version="1.15.0" />
         <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.23" />
         <PackageVersion Include="Hangfire.EntityFrameworkCore" Version="0.9.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.AspNetCore" Version="6.1.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.1.0" />
-        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.1.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.AspNetCore" Version="6.2.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.2.0" />
+        <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.2.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Xamarin.Firebase.Messaging" Version="125.0.1.2" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Plugin.LocalNotification" Version="13.0.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="AdsPush" Version="2.0.0" />
@@ -92,7 +92,7 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-01" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
-        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
+        <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
@@ -104,48 +104,48 @@
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Exporter" Version="1.6.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="BlazorApplicationInsights" Version="3.3.0" />
-        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.4" />
-        <PackageVersion Condition=" '$(database)' == 'PostgreSQL' OR '$(database)' == '' " Include="Npgsql.EntityFrameworkCore.PostgreSQL" Version="10.0.0" />
+        <PackageVersion Condition=" '$(database)' == 'SqlServer' OR '$(database)' == '' " Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.5" />
+        <PackageVersion Condition=" '$(database)' == 'PostgreSQL' OR '$(database)' == '' " Include="Npgsql.EntityFrameworkCore.PostgreSQL" Version="10.0.1" />
         <PackageVersion Condition=" '$(database)' == 'MySql' OR '$(database)' == '' " Include="Pomelo.EntityFrameworkCore.MySql" Version="9.0.0" />
         <PackageVersion Condition=" '$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '' " Include="FluentStorage.Azure.Blobs" Version="6.0.2" />
         <PackageVersion Condition=" '$(filesStorage)' == 'S3' OR '$(filesStorage)' == '' " Include="FluentStorage.AWS" Version="6.0.2" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.AspNetCore" Version="1.4.0" />
-        <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta7" />
+        <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta8" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.2" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.2" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.6.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
-        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.4" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.4" />
+        <PackageVersion Condition=" ('$(redis)' == 'true' OR '$(redis)' == '') AND ('$(signalR)' == 'true' OR '$(signalR)' == '')" Include="Microsoft.AspNetCore.SignalR.StackExchangeRedis" Version="10.0.5" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Microsoft.Extensions.Caching.StackExchangeRedis" Version="10.0.5" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Locking.Distributed.Redis" Version="2.6.0" />
         <!--/-:msbuild-conditional:noEmit -->
         <PackageVersion Include="Humanizer" Version="3.0.10" />
         <PackageVersion Include="QRCoder" Version="1.7.0" />
-        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.10.4" />
+        <PackageVersion Include="Magick.NET-Q16-AnyCPU" Version="14.11.0" />
         <PackageVersion Include="FluentEmail.Smtp" Version="3.0.2" />
         <PackageVersion Include="FluentStorage" Version="6.0.2" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.JwtBearer" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="10.0.5" />
         <PackageVersion Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.5" />
         <PackageVersion Include="Swashbuckle.AspNetCore" Version="10.0.0" />
         <PackageVersion Include="Microsoft.Identity.Web" Version="4.5.0" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.5" />
         <PackageVersion Include="AspNet.Security.OAuth.Apple" Version="10.0.0" />
         <PackageVersion Include="AspNet.Security.OAuth.GitHub" Version="10.0.0" />
         <PackageVersion Include="Riok.Mapperly" Version="4.3.1" />
         <PackageVersion Include="Twilio" Version="7.14.3" />
-        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
-        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.AspNetCore.Authorization" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.5" />
+        <PackageVersion Include="Microsoft.Extensions.Localization" Version="10.0.5" />
         <PackageVersion Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.0" />
-        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.4" />
+        <PackageVersion Include="Microsoft.Extensions.Configuration.Json" Version="10.0.5" />
         <PackageVersion Include="System.Text.Json" Version="10.0.0" />
         <PackageVersion Include="FakeItEasy" Version="9.0.1" />
         <PackageVersion Include="Microsoft.Playwright.MSTest.v4" Version="1.58.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index 1a3976c773..e5b8d44df7 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index a0e4c476a2..17ca5267ab 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -20,9 +20,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index e56e2d283c..41cf548245 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
-        <PackageReference Include="System.Text.Json" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.5" />
+        <PackageReference Include="System.Text.Json" Version="10.0.5" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 604e46350a..5962d090f8 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -23,7 +23,7 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
@@ -45,8 +45,8 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index 6a1cc7695c..bfe8bdc8a5 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -22,9 +22,9 @@
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
         <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
         <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index e56e2d283c..41cf548245 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
-        <PackageReference Include="System.Text.Json" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.5" />
+        <PackageReference Include="System.Text.Json" Version="10.0.5" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index 8439ec13c2..12cae7670a 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -20,7 +20,7 @@
 
     <ItemGroup>
         <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
     </ItemGroup>
 
     <ItemGroup>
@@ -41,7 +41,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
 
         <Using Include="System.Net.Http.Json" />
         <Using Include="System.Collections.Concurrent" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index ea6097028c..f2b2e4ecc9 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -20,9 +20,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.4" />
-        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.4" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
+        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
         <PackageReference Include="AspNetCore.HealthChecks.System" Version="9.0.0" />
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index e56e2d283c..41cf548245 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -14,9 +14,9 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.4" />
-        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.4" />
-        <PackageReference Include="System.Text.Json" Version="10.0.4" />
+        <PackageReference Include="Microsoft.Extensions.DependencyInjection.Abstractions" Version="10.0.5" />
+        <PackageReference Include="Microsoft.Extensions.Configuration.Binder" Version="10.0.5" />
+        <PackageReference Include="System.Text.Json" Version="10.0.5" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" PrivateAssets="all" ExcludeAssets="runtime">
             <IncludeAssets>compile; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>

From aa293f3df07e6d0d059f5e07cb830c46535306b1 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Tue, 17 Mar 2026 21:01:18 +0100
Subject: [PATCH 54/66] feat(prerelease): v-10.4.3-pre-02 #12186 (#12187)

---
 src/Besql/Bit.Besql/wwwroot/bit-besql.js      |  2 +-
 src/Bit.Build.props                           |  2 +-
 .../buildTransitive/Bit.BlazorES2019.targets  |  8 +++----
 src/BlazorUI/Bit.BlazorUI/Info.cs             |  2 +-
 src/BlazorUI/Bit.BlazorUI/Scripts/general.ts  |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  6 ++---
 .../Bit.BlazorUI.Demo.Shared.csproj           |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |  6 ++---
 .../Bit.BlazorUI.Demo.Client.Web.csproj       |  6 ++---
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  6 ++---
 src/BlazorUI/Demo/Directory.Build.props       |  2 +-
 .../Bit.Bswup.Demo/wwwroot/service-worker.js  |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../wwwroot/service-worker.js                 |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.progress.ts   |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts   |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts      |  2 +-
 .../FullDemo/Client/wwwroot/service-worker.js |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 src/Butil/Bit.Butil/Scripts/butil.ts          |  2 +-
 .../BlazorEmpty.Client.csproj                 |  8 +++----
 .../BlazorEmpty/BlazorEmpty.csproj            |  8 +++----
 .../.docs/19- Project Miscellaneous Files.md  | 10 ++++-----
 .../Boilerplate/Bit.Boilerplate/README.md     |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../src/Directory.Packages.props              | 22 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Careers.Server.csproj        |  6 ++---
 .../Bit.Websites.Careers.Shared.csproj        |  4 ++--
 .../Careers/src/Directory.Build.props         |  2 +-
 .../Bit.Websites.Platform.Client.csproj       | 14 ++++++------
 .../Templates03GettingStartedPage.razor       |  2 +-
 .../Templates03GettingStartedPage.razor.cs    |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Platform.Server.csproj       |  6 ++---
 .../Bit.Websites.Platform.Shared.csproj       |  4 ++--
 .../Platform/src/Directory.Build.props        |  2 +-
 .../Bit.Websites.Sales.Client.csproj          | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Sales.Server.csproj          |  6 ++---
 .../Bit.Websites.Sales.Shared.csproj          |  4 ++--
 src/Websites/Sales/src/Directory.Build.props  |  2 +-
 47 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
index 04ab5131f3..bdcf1ef48a 100644
--- a/src/Besql/Bit.Besql/wwwroot/bit-besql.js
+++ b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
@@ -1,5 +1,5 @@
 var BitBesql = window.BitBesql || {};
-BitBesql.version = window['bit-besql version'] = '10.4.3-pre-01';
+BitBesql.version = window['bit-besql version'] = '10.4.3-pre-02';
 
 BitBesql.persist = async function besqlPersist(fileName) {
 
diff --git a/src/Bit.Build.props b/src/Bit.Build.props
index 489ac558d2..82ba2ccd07 100644
--- a/src/Bit.Build.props
+++ b/src/Bit.Build.props
@@ -27,7 +27,7 @@
         <PackageProjectUrl>https://github.com/bitfoundation/bitplatform</PackageProjectUrl>
 
         <!-- Version -->
-        <ReleaseVersion>10.4.3-pre-01</ReleaseVersion>
+        <ReleaseVersion>10.4.3-pre-02</ReleaseVersion>
           <PackageVersion>$(ReleaseVersion)</PackageVersion>
         <PackageReleaseNotes>https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion)</PackageReleaseNotes>
         <Version Condition=" '$(Configuration)' == 'Release' ">$([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.'))</Version>
diff --git a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
index 0de51370d3..23058b3974 100644
--- a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
+++ b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
@@ -1,13 +1,13 @@
 <Project>
     <ItemGroup>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
         </Content>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-01/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
diff --git a/src/BlazorUI/Bit.BlazorUI/Info.cs b/src/BlazorUI/Bit.BlazorUI/Info.cs
index 56a80e66e1..00486ee754 100644
--- a/src/BlazorUI/Bit.BlazorUI/Info.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Info.cs
@@ -8,5 +8,5 @@ public static class Info
     /// <summary>
     /// The current version string of bit BlazorUI.
     /// </summary>
-    public static string Version { get; } = "10.4.3-pre-01";
+    public static string Version { get; } = "10.4.3-pre-02";
 }
diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
index 616bab1b7c..e19210af91 100644
--- a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
+++ b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
@@ -1,4 +1,4 @@
-(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-01';
+(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-02';
 
 interface DotNetObject {
     invokeMethod<T>(methodIdentifier: string, ...args: any[]): T;
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index d69535213d..e87ddaf65c 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -10,12 +10,12 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index f7c37555d0..51070ed05b 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -5,11 +5,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 45db7dd0dc..285fb5d5d6 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -16,11 +16,11 @@
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
 
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index ade2024478..8ac60138a1 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -98,13 +98,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
         <PackageReference Include="Microsoft.AppCenter.Crashes" Version="5.0.7" />
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
index d51a51e845..bdc5110c7d 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
@@ -28,13 +28,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
index aa7eb09ab1..e8d2a3d751 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index 14d7b18e79..bbf401c576 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -29,12 +29,12 @@
         <Using Include="Bit.BlazorUI.Demo.Client.Core.Services" />
         <Using Include="Bit.BlazorUI.Demo.Shared" />
         <Watch Remove="*.scss" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Directory.Build.props b/src/BlazorUI/Demo/Directory.Build.props
index 0750ccd268..21b09d8992 100644
--- a/src/BlazorUI/Demo/Directory.Build.props
+++ b/src/BlazorUI/Demo/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
index 17ee9b7ccb..38ba99be8d 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
index 4754da27f5..a15af28079 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
index b1b2752a8a..39c900c0a9 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
index 4536aecee4..c52defb3d7 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 self.assetsInclude = [];
 self.assetsExclude = [
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
index a144e67d21..01505b1cda 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
@@ -1,4 +1,4 @@
-window['bit-bswup.progress version'] = '10.4.3-pre-01';
+window['bit-bswup.progress version'] = '10.4.3-pre-02';
 
 (function () {
     const _config: IBswupProgressConfigs = {};
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
index e315c7e6c2..93f56dfc34 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-01';
+self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-02';
 
 self.addEventListener('install', e => e.waitUntil(removeBswup()));
 
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
index 3c9df7f43c..0109245c75 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw version'] = '10.4.3-pre-01';
+self['bit-bswup.sw version'] = '10.4.3-pre-02';
 
 interface Window {
     clients: any
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
index b26aa7252f..d65f71ea0d 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
@@ -1,5 +1,5 @@
 var BitBswup = BitBswup || {};
-BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-01';
+BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-02';
 
 (function () {
     const bitBswupScript = document.currentScript;
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
index e0b7284670..c2f8e14353 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
index f83480dbb6..0b7c2e37cd 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 
 self.assetsInclude = [];
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
diff --git a/src/Butil/Bit.Butil/Scripts/butil.ts b/src/Butil/Bit.Butil/Scripts/butil.ts
index 1b1c59ffd5..567241686c 100644
--- a/src/Butil/Bit.Butil/Scripts/butil.ts
+++ b/src/Butil/Bit.Butil/Scripts/butil.ts
@@ -1,2 +1,2 @@
 var BitButil = BitButil || {};
-BitButil.version = window['bit-butil version'] = '10.4.3-pre-01';
\ No newline at end of file
+BitButil.version = window['bit-butil version'] = '10.4.3-pre-02';
\ No newline at end of file
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
index f5e199d28f..836edb850e 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-01 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-02 -->
 
 <Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
 
@@ -15,14 +15,14 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
index 016eb21bd3..f82902ed2f 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-01 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-02 -->
 
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
@@ -18,14 +18,14 @@
   <!--#endif -->
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md
index 26eb1627f1..0d1d8baae6 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
@@ -221,7 +221,7 @@ These namespaces are **automatically imported** in every C# file, eliminating th
 
 Instead of this in each `.csproj`:
 ```xml
-<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
 ```
 
 You write this in `.csproj`:
@@ -231,7 +231,7 @@ You write this in `.csproj`:
 
 And the version is defined centrally in `Directory.Packages.props`:
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
 ```
 
 **Benefits**:
@@ -242,8 +242,8 @@ And the version is defined centrally in `Directory.Packages.props`:
 **Example packages included**:
 
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
-<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-01" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-02" />
 <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.0" />
 <PackageVersion Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.0" />
 <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.21" />
@@ -608,7 +608,7 @@ When you open the project in VS Code, you'll be prompted to install these extens
 **Example**:
 
 ````markdown
-This project gets generated by bit-bp template v-10.4.3-pre-01 using the following command
+This project gets generated by bit-bp template v-10.4.3-pre-02 using the following command
 ```bash
 dotnet new bit-bp
     --name Boilerplate
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/README.md b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
index 07ee334c33..b2fa1743d7 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/README.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
@@ -2,7 +2,7 @@
 
 Thank you for creating a new project with bit platform! We appreciate your trust in our platform and are excited to see what you'll build.
 
-This project generated by bit-bp template v-10.4.3-pre-01 using the following command:
+This project generated by bit-bp template v-10.4.3-pre-02 using the following command:
 
 ```bash
     dotnet new bit-bp
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
index 38bd6eef18..bb864cc4d3 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
@@ -1,5 +1,5 @@
 //+:cnd:noEmit
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 //#if (notification == true)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 0a7eb2f495..44a16e6839 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -1,16 +1,16 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
 <Project>
     <ItemGroup>
         <!-- https://learn.microsoft.com/en-us/nuget/consume-packages/central-package-management -->
-        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01" />
-        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-01" />
+        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-02" />
         <PackageVersion Include="DistributedLock.FileSystem" Version="1.0.3" />
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
@@ -90,7 +90,7 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-01" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-02" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index e5b8d44df7..655580e543 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
index ded99227dc..ce5f1e767b 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index 17ca5267ab..7b032f69be 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Careers.Shared\Bit.Websites.Careers.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Careers.Client\Bit.Websites.Careers.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index 41cf548245..92075e34ea 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Directory.Build.props b/src/Websites/Careers/src/Directory.Build.props
index 2b237a7d8c..81c2f48789 100644
--- a/src/Websites/Careers/src/Directory.Build.props
+++ b/src/Websites/Careers/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 5962d090f8..6f888a82dc 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -32,16 +32,16 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 91304bb854..1c695089e1 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -153,7 +153,7 @@ rm $HOME/dotnet.tar.gz</CodeBox>
                         </li>
                         <li>
                             <div style="margin-bottom:8px">Install <a href="https://www.nuget.org/packages/Bit.Boilerplate" target="_blank">Bit Boilerplate</a> project template</div>
-                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-01</CodeBox>
+                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-02</CodeBox>
                         </li>
                         @if (showCrossPlatform && devOS is "Windows")
                         {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
index a8ecedd2f5..c5da533429 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
@@ -43,7 +43,7 @@ public partial class Templates03GettingStartedPage
             command:"dotnet tool install -g Aspire.Cli"),
 
             (text:@"echo 'Install the Bit.Boilerplate project template https://www.nuget.org/packages/Boilerplate.Templates';",
-            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-01;")
+            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-02;")
         ];
 
         if (enableVirtualization)
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
index 85443d5161..00eb62e4f4 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index bfe8bdc8a5..3daeb9809c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -12,12 +12,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Platform.Shared\Bit.Websites.Platform.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Platform.Client\Bit.Websites.Platform.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index 41cf548245..92075e34ea 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Directory.Build.props b/src/Websites/Platform/src/Directory.Build.props
index 3a3e279b00..033867b035 100644
--- a/src/Websites/Platform/src/Directory.Build.props
+++ b/src/Websites/Platform/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
 <Project>
     <PropertyGroup>
         <LangVersion>preview</LangVersion>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index 12cae7670a..cf17313303 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
index f3ade6fa57..cdb86cba9f 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-01
+// bit version: 10.4.3-pre-02
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index f2b2e4ecc9..2efe92c66f 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Sales.Shared\Bit.Websites.Sales.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Sales.Client\Bit.Websites.Sales.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-01" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index 41cf548245..92075e34ea 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-01">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Directory.Build.props b/src/Websites/Sales/src/Directory.Build.props
index 025326d27a..f765a3910a 100644
--- a/src/Websites/Sales/src/Directory.Build.props
+++ b/src/Websites/Sales/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-01 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>

From a34494791864d9a7e7e8e679557949875ef4b9df Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 18 Mar 2026 10:37:14 +0100
Subject: [PATCH 55/66] feat(infra): update repo to dotnet sdk 10.0.201 #12190
 (#12191)

---
 .devcontainer/devcontainer.json                                 | 2 +-
 .../Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json | 2 +-
 .../Pages/Templates/Templates03GettingStartedPage.razor         | 2 +-
 src/global.json                                                 | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index 5ce51473d7..a9b05a187f 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -14,7 +14,7 @@
     },
     "ghcr.io/devcontainers/features/node:1": { "version": "24" }
   },
-  "image": "mcr.microsoft.com/dotnet/sdk:10.0.200",
+  "image": "mcr.microsoft.com/dotnet/sdk:10.0.201",
   "postStartCommand": "dotnet workload install wasm-tools && dotnet dev-certs https --trust",
   "waitFor": "onCreateCommand",
   "customizations": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
index f368764d28..be9daec178 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.devcontainer/devcontainer.json
@@ -1,6 +1,6 @@
 {
     "name": "Boilerplate",
-    "image": "mcr.microsoft.com/dotnet/sdk:10.0.200",
+    "image": "mcr.microsoft.com/dotnet/sdk:10.0.201",
     "hostRequirements": {
         "cpus": 8
     },
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 1c695089e1..51b7d3f639 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -99,7 +99,7 @@
                             {
                                 <br />
                                 <BitAccordion Title="Ubuntu instructions">
-                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.200/dotnet-sdk-10.0.200-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
+                                <CodeBox>wget https://builds.dotnet.microsoft.com/dotnet/Sdk/10.0.201/dotnet-sdk-10.0.201-linux-x64.tar.gz -O $HOME/dotnet.tar.gz
 mkdir -p $HOME/.dotnet
 tar zxf $HOME/dotnet.tar.gz -C "$HOME/.dotnet"
 echo 'PATH=$HOME/.dotnet:$HOME/.dotnet/tools:$PATH' >> ~/.bashrc
diff --git a/src/global.json b/src/global.json
index 9523d2e1ed..c5eb971005 100644
--- a/src/global.json
+++ b/src/global.json
@@ -1,6 +1,6 @@
 {
     "sdk": {
-        "version": "10.0.200",
+        "version": "10.0.201",
         "rollForward": "disable"
     },
     "test": {

From 3c0a3a9138835a327a7b0f046477c9fab0d830ae Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 19 Mar 2026 12:07:53 +0330
Subject: [PATCH 56/66] feat(blazorui): apply required improvements on
 BitMarkdownViewer #12192 (#12195)

---
 .../MarkdownViewer/BitMarkdownViewer.razor.cs | 10 +++++++--
 .../Services/BitMarkdownService.cs            | 21 +++++++++++++++----
 .../BitMarkdownViewerDemo.razor.cs            |  9 +++++++-
 .../MarkdownViewer/BitMarkdownViewerTests.cs  | 17 +++++++++------
 4 files changed, 44 insertions(+), 13 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
index 7babbffa17..3cea62fb85 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Components/MarkdownViewer/BitMarkdownViewer.razor.cs
@@ -38,7 +38,13 @@ public partial class BitMarkdownViewer : BitComponentBase
     /// C# middleware is applied after JavaScript middleware.
     /// </summary>
     [Parameter, CallOnSet(nameof(OnMarkdownOrMiddlewareSet))]
-    public Func<string, string>? Middleware { get; set; }
+    public Func<string, Task<string>>? Middleware { get; set; }
+
+    /// <summary>
+    /// Disables parse and render of the markdown content in the prerendering phase.
+    /// </summary>
+    [Parameter]
+    public bool NoPrerender { get; set; }
 
     /// <summary>
     /// A callback that is called before starting to parse the markdown.
@@ -93,7 +99,7 @@ private async Task ParseAndRender()
 
         try
         {
-            _html = await _markdownService.Parse(Markdown, JsMiddlewareIdentifier, Middleware, _cts.Token);
+            _html = await _markdownService.Parse(Markdown, JsMiddlewareIdentifier, Middleware, NoPrerender, _cts.Token);
         }
         catch
         {
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs b/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
index 9195669be7..a75f432931 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Services/BitMarkdownService.cs
@@ -25,19 +25,29 @@ public class BitMarkdownService(IJSRuntime js, IServiceProvider serviceProvider)
     /// <param name="cancellationToken">A token to cancel the operation.</param>
     public Task<string> Parse(string? markdown, CancellationToken cancellationToken)
     {
-        return Parse(markdown, null, null, cancellationToken);
+        return Parse(markdown, null, null, false, cancellationToken);
     }
 
     /// <summary>
     /// Parses the given markdown string into an HTML string, then applies JavaScript and C# middlewares in order.
     /// JavaScript middleware is invoked via JS interop and is skipped during server-side prerendering.
-    /// C# middleware is always applied regardless of rendering mode.
+    /// C# middleware is applied to the generated HTML when rendering occurs, 
+    /// but is not invoked when prerendering is skipped via <paramref name="noPrerender"/>.
     /// </summary>
     /// <param name="markdown">The markdown string to parse.</param>
     /// <param name="jsMiddleware">Optional JavaScript middleware identifier (fully qualified JS function path) to invoke via JS interop after parsing.</param>
     /// <param name="csMiddleware">Optional C# middleware to apply after the JavaScript middleware.</param>
+    /// <param name="noPrerender">
+    /// When <see langword="true"/>, parsing and JavaScript middleware execution are skipped during server-side prerendering,
+    /// and C# middleware will not be invoked on that prerendering pass.
+    /// </param>
     /// <param name="cancellationToken">A token to cancel the operation.</param>
-    public async Task<string> Parse(string? markdown, string? jsMiddleware, Func<string, string>? csMiddleware, CancellationToken cancellationToken)
+    public async Task<string> Parse(
+        string? markdown,
+        string? jsMiddleware,
+        Func<string, Task<string>>? csMiddleware,
+        bool noPrerender,
+        CancellationToken cancellationToken)
     {
         if (markdown.HasNoValue()) return string.Empty;
 
@@ -45,6 +55,8 @@ public async Task<string> Parse(string? markdown, string? jsMiddleware, Func<str
 
         if (js.IsRuntimeInvalid()) // server (prerendering)
         {
+            if (noPrerender) return string.Empty;
+
             try
             {
                 html = await Task.Run(async () => await RunJint(markdown, cancellationToken), cancellationToken);
@@ -59,6 +71,7 @@ public async Task<string> Parse(string? markdown, string? jsMiddleware, Func<str
             {
                 Console.Error.WriteLine(ex.Message);
             }
+
         }
         else // client
         {
@@ -74,7 +87,7 @@ public async Task<string> Parse(string? markdown, string? jsMiddleware, Func<str
         {
             try
             {
-                html = csMiddleware(html);
+                html = await csMiddleware(html);
             }
             catch (Exception ex)
             {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
index 492da4c6ac..4b70b02b3e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Extras/MarkdownViewer/BitMarkdownViewerDemo.razor.cs
@@ -24,13 +24,20 @@ an HTML string and returns the processed HTML string.
         new()
         {
            Name = "Middleware",
-           Type = "Func<string, string>?",
+           Type = "Func<string, Task<string>>?",
            DefaultValue = "null",
            Description = @"The C# function to run after parsing markdown and before rendering HTML.
                            The middleware receives the parsed HTML string and returns the processed HTML string.
                            C# middleware is applied after JavaScript middleware.",
         },
         new()
+        {
+           Name = "NoPrerender",
+           Type = "bool",
+           DefaultValue = "false",
+           Description = "Disables parse and render of the markdown content in the prerendering phase.",
+        },
+        new()
         {
            Name = "OnParsing",
            Type = "EventCallback<string?>",
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
index 6e089cc795..9e126402a4 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Extras/MarkdownViewer/BitMarkdownViewerTests.cs
@@ -42,7 +42,7 @@ public void BitMarkdownViewerShouldRenderParsedHtml()
 
         component.WaitForAssertion(() =>
         {
-            Assert.IsTrue(root.InnerHtml.Contains(html));
+            Assert.Contains(html, root.InnerHtml);
             Assert.AreEqual(Context.JSInterop.VerifyInvoke("BitBlazorUI.MarkdownViewer.parseAsync").Arguments[0], markdown);
         });
     }
@@ -55,7 +55,9 @@ public void BitMarkdownViewerShouldInvokeCallbacks()
 
         SetupMarkdownInterop(markdown, html);
 
-        bool parsingCalled = false, parsedCalled = false, renderedCalled = false;
+        var parsingCalled = false;
+        var parsedCalled = false;
+        var renderedCalled = false;
         string? parsedValue = null;
 
         var component = RenderComponent<BitMarkdownViewer>(parameters =>
@@ -105,7 +107,7 @@ public void BitMarkdownViewerShouldReparseWhenMarkdownChanges()
 
         component.WaitForAssertion(() =>
         {
-            Assert.IsTrue(component.Markup.Contains(html));
+            Assert.Contains(html, component.Markup);
         });
 
         markdown = "two";
@@ -120,7 +122,7 @@ public void BitMarkdownViewerShouldReparseWhenMarkdownChanges()
 
         component.WaitForAssertion(() =>
         {
-            Assert.IsTrue(component.Markup.Contains(html));
+            Assert.Contains(html, component.Markup);
         });
     }
 
@@ -162,9 +164,10 @@ public void BitMarkdownViewerShouldApplyCSharpMiddleware()
 
         var middlewareCalled = false;
 
-        string middleware(string input)
+        async Task<string> middleware(string input)
         {
             middlewareCalled = input == html;
+            await Task.Delay(1);
             return processedHtml;
         }
 
@@ -190,6 +193,7 @@ public void BitMarkdownViewerShouldApplyJsMiddleware()
         var jsMiddleware = "myApp.sanitize";
 
         SetupMarkdownInterop(markdown, html);
+
         Context.JSInterop.Setup<string>("BitBlazorUI.MarkdownViewer.parseAsync", markdown, jsMiddleware).SetResult(processedHtml);
 
         var component = RenderComponent<BitMarkdownViewer>(parameters =>
@@ -222,10 +226,11 @@ public void BitMarkdownViewerShouldApplyJsThenCSharpMiddleware()
         var middlewareCalled = false;
         string? middlewareInput = null;
 
-        string csMiddleware(string input)
+        async Task<string> csMiddleware(string input)
         {
             middlewareCalled = true;
             middlewareInput = input;
+            await Task.Delay(1);
             return csharpProcessedHtml;
         }
 

From f97f2986e6d429dd18b344af09b43a3ee05214a4 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 19 Mar 2026 16:24:03 +0330
Subject: [PATCH 57/66] feat(blazorui): add missing new Icon parameters to
 BitDatePicker #12182 (#12193)

---
 .../Inputs/DatePicker/BitDatePicker.razor     |  77 +-
 .../Inputs/DatePicker/BitDatePicker.razor.cs  | 335 ++++++---
 .../Inputs/DatePicker/BitDatePicker.scss      |   6 +-
 .../Inputs/DatePicker/BitDatePickerDemo.razor |  37 +
 .../DatePicker/BitDatePickerDemo.razor.cs     | 364 ++++++++-
 .../BitDatePickerDemo.razor.samples.cs        |  32 +-
 .../Inputs/DatePicker/BitDatePickerTests.cs   | 704 +++++++++++++++++-
 7 files changed, 1393 insertions(+), 162 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
index 554d4f2f42..d40520f0a8 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor
@@ -1,6 +1,26 @@
 @namespace Bit.BlazorUI
 @inherits BitInputBase<DateTimeOffset?>
 
+@{
+    var iconCss = BitIconInfo.From(Icon, IconName ?? "CalendarMirrored")?.GetCssClasses();
+    var clearBtnIconCss = BitIconInfo.From(ClearButtonIcon, ClearButtonIconName ?? "Cancel")?.GetCssClasses();
+    var closeButtonIconCss = BitIconInfo.From(CloseButtonIcon, CloseButtonIconName ?? "Cancel")?.GetCssClasses();
+    var prevMonthNavIconCss = BitIconInfo.From(PrevMonthNavIcon, PrevMonthNavIconName ?? "Up")?.GetCssClasses();
+    var nextMonthNavIconCss = BitIconInfo.From(NextMonthNavIcon, NextMonthNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var goToTodayIconCss = BitIconInfo.From(GoToTodayIcon, GoToTodayIconName ?? "GotoToday")?.GetCssClasses();
+    var showTimePickerIconCss = BitIconInfo.From(ShowTimePickerIcon, ShowTimePickerIconName ?? "Clock")?.GetCssClasses();
+    var prevYearNavIconCss = BitIconInfo.From(PrevYearNavIcon, PrevYearNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearNavIconCss = BitIconInfo.From(NextYearNavIcon, NextYearNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var prevYearRangeNavIconCss = BitIconInfo.From(PrevYearRangeNavIcon, PrevYearRangeNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearRangeNavIconCss = BitIconInfo.From(NextYearRangeNavIcon, NextYearRangeNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var goToNowIconCss = BitIconInfo.From(GoToNowIcon, GoToNowIconName ?? "Clock")?.GetCssClasses();
+    var hideTimePickerIconCss = BitIconInfo.From(HideTimePickerIcon, HideTimePickerIconName ?? "CalendarMirrored")?.GetCssClasses();
+    var increaseHourIconCss = BitIconInfo.From(TimePickerIncreaseHourIcon, TimePickerIncreaseHourIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var decreaseHourIconCss = BitIconInfo.From(TimePickerDecreaseHourIcon, TimePickerDecreaseHourIconName ?? "ChevronDownSmall")?.GetCssClasses();
+    var increaseMinuteIconCss = BitIconInfo.From(TimePickerIncreaseMinuteIcon, TimePickerIncreaseMinuteIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var decreaseMinuteIconCss = BitIconInfo.From(TimePickerDecreaseMinuteIcon, TimePickerDecreaseMinuteIconName ?? "ChevronDownSmall")?.GetCssClasses();
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      style="@StyleBuilder.Value"
@@ -56,7 +76,9 @@
                             aria-hidden="true"
                             aria-label="Clear date"
                             disabled="@(CurrentValue.HasValue is false)">
-                        <i style="@Styles?.ClearButtonIcon" class="bit-icon bit-icon--Cancel @Classes?.ClearButtonIcon" aria-hidden="true" />
+                        <i aria-hidden="true"
+                           style="@Styles?.ClearButtonIcon"
+                           class="bit-dtp-cic @clearBtnIconCss @Classes?.ClearButtonIcon" />
                     </button>
                 }
 
@@ -66,8 +88,9 @@
                 }
                 else
                 {
-                    var icon = BitIconInfo.From(Icon, IconName ?? "CalendarMirrored");
-                    <i style="@Styles?.Icon" class="bit-dtp-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
+                    <i aria-hidden="true"
+                       style="@Styles?.Icon"
+                       class="bit-dtp-ico @iconCss @Classes?.Icon" />
                 }
             </div>
         </div>
@@ -90,7 +113,7 @@
     }
 
     <div id="@_calloutId"
-         style="@Styles?.Callout" 
+         style="@Styles?.Callout"
          class="@GetCalloutCssClasses()">
         <div style="@Styles?.CalloutContainer" class="bit-dtp-cac @Classes?.CalloutContainer" role="dialog" @attributes=@CalloutHtmlAttributes aria-label="@CalloutAriaLabel">
             <div style="@Styles?.Group" class="bit-dtp-grp @Classes?.Group" role="group" aria-label="">
@@ -150,7 +173,7 @@
                                         aria-disabled="@prevDisabled">
                                     <i aria-hidden="true"
                                        style="@Styles?.PrevMonthNavIcon"
-                                       class="bit-icon bit-icon--Up @Classes?.PrevMonthNavIcon" />
+                                       class="bit-dtp-cic @prevMonthNavIconCss @Classes?.PrevMonthNavIcon" />
                                 </button>
                                 @if (ShowGoToToday && (_showMonthPickerAsOverlayInternal || (ShowTimePicker && _showTimePickerAsOverlayInternal is false)))
                                 {
@@ -165,7 +188,7 @@
                                             aria-disabled="@goToTodayDisabled">
                                         <i aria-hidden="true"
                                            style="@Styles?.GoToTodayIcon"
-                                           class="bit-dtp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                           class="bit-dtp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                     </button>
                                 }
                                 <button @onclick="() => HandleMonthChange(true)"
@@ -177,7 +200,7 @@
                                         aria-disabled="@nextDisabled">
                                     <i aria-hidden="true"
                                        style="@Styles?.NextMonthNavIcon"
-                                       class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextMonthNavIcon" />
+                                       class="bit-dtp-cic @nextMonthNavIconCss @Classes?.NextMonthNavIcon" />
                                 </button>
                                 @if (ShowCloseButton && Standalone is false)
                                 {
@@ -189,7 +212,7 @@
                                             aria-label="@CloseDatePickerTitle">
                                         <i aria-hidden="true"
                                            style="@Styles?.CloseButtonIcon"
-                                           class="bit-icon bit-icon--Cancel @Classes?.CloseButtonIcon" />
+                                           class="bit-dtp-cic @closeButtonIconCss @Classes?.CloseButtonIcon" />
                                     </button>
                                 }
                                 @if (_showMonthPickerAsOverlayInternal && _showTimePickerAsOverlayInternal && ShowTimePicker)
@@ -207,7 +230,7 @@
                                             class="bit-dtp-nbt @Classes?.ShowTimePickerButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.ShowTimePickerIcon"
-                                           class="bit-dtp-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                           class="bit-dtp-cic @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                                     </button>
                                 }
                             </div>
@@ -321,7 +344,7 @@
                                             class="bit-dtp-nbt @Classes?.PrevYearNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.PrevYearNavIcon"
-                                           class="bit-icon bit-icon--Up @Classes?.PrevYearNavIcon" />
+                                           class="bit-dtp-cic @prevYearNavIconCss @Classes?.PrevYearNavIcon" />
                                     </button>
                                     @if (ShowGoToToday)
                                     {
@@ -337,7 +360,7 @@
                                                 class="bit-dtp-gtb @Classes?.GoToTodayButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.GoToTodayIcon"
-                                               class="bit-dtp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                               class="bit-dtp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                         </button>
                                     }
                                     <button @onclick="() => HandleYearChange(true)"
@@ -350,7 +373,7 @@
                                             class="bit-dtp-nbt @Classes?.NextYearNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.NextYearNavIcon"
-                                           class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearNavIcon" />
+                                           class="bit-dtp-cic @nextYearNavIconCss @Classes?.NextYearNavIcon" />
                                     </button>
                                     @if (_showTimePickerAsOverlayInternal && ShowTimePicker)
                                     {
@@ -367,7 +390,7 @@
                                                 class="bit-dtp-nbt @Classes?.ShowTimePickerButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.ShowTimePickerIcon"
-                                               class="bit-dtp-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                               class="bit-dtp-cic @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                                         </button>
                                     }
                                 </div>
@@ -439,7 +462,7 @@
                                             class="bit-dtp-nbt @Classes?.PrevYearRangeNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.PrevYearRangeNavIcon"
-                                           class="bit-icon bit-icon--Up @Classes?.PrevYearRangeNavIcon" />
+                                           class="bit-dtp-cic @prevYearRangeNavIconCss @Classes?.PrevYearRangeNavIcon" />
                                     </button>
                                     @if (ShowGoToToday)
                                     {
@@ -455,7 +478,7 @@
                                                 class="bit-dtp-gtb @Classes?.GoToTodayButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.GoToTodayIcon"
-                                               class="bit-dtp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                               class="bit-dtp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                         </button>
                                     }
                                     <button @onclick="() => HandleYearRangeChange(true)"
@@ -468,7 +491,7 @@
                                             class="bit-dtp-nbt @Classes?.NextYearRangeNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.NextYearRangeNavIcon"
-                                           class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearRangeNavIcon" />
+                                           class="bit-dtp-cic @nextYearRangeNavIconCss @Classes?.NextYearRangeNavIcon" />
                                     </button>
                                 </div>
                             </div>
@@ -530,7 +553,7 @@
                                             class="bit-dtp-gtn @Classes?.GoToNowButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.GoToNowIcon"
-                                           class="bit-dtp-gti bit-icon bit-icon--Clock @Classes?.GoToNowIcon" />
+                                           class="bit-dtp-cic @goToNowIconCss @Classes?.GoToNowIcon" />
                                     </button>
                                 }
                                 @if (_isTimePickerOverlayOnTop)
@@ -542,7 +565,9 @@
                                             aria-disabled="@(IsEnabled is false)"
                                             style="@Styles?.HideTimePickerButton"
                                             class="bit-dtp-nbt @Classes?.HideTimePickerButton">
-                                        <i style="@Styles?.HideTimePickerIcon" class="bit-icon bit-icon--CalendarMirrored @Classes?.HideTimePickerIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.HideTimePickerIcon"
+                                           class="bit-dtp-cic @hideTimePickerIconCss @Classes?.HideTimePickerIcon" />
                                     </button>
                                 }
                             </div>
@@ -557,7 +582,9 @@
                                         aria-disabled="@(IsEnabled is false)"
                                         style="@Styles?.TimePickerIncreaseHourButton"
                                         class="bit-dtp-tbt @Classes?.TimePickerIncreaseHourButton">
-                                    <i style="@Styles?.TimePickerIncreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.TimePickerIncreaseHourIcon" aria-hidden="true" />
+                                    <i aria-hidden="true"
+                                       style="@Styles?.TimePickerIncreaseHourIcon"
+                                       class="bit-dtp-cic @increaseHourIconCss @Classes?.TimePickerIncreaseHourIcon" />
                                 </button>
                                 <input @ref="_inputTimeHourRef"
                                        @bind="@_hourView"
@@ -581,7 +608,9 @@
                                         aria-disabled="@(IsEnabled is false)"
                                         style="@Styles?.TimePickerDecreaseHourButton"
                                         class="bit-dtp-tbt @Classes?.TimePickerDecreaseHourButton">
-                                    <i style="@Styles?.TimePickerDecreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.TimePickerDecreaseHourIcon" aria-hidden="true" />
+                                    <i aria-hidden="true"
+                                       style="@Styles?.TimePickerDecreaseHourIcon"
+                                       class="bit-dtp-cic @decreaseHourIconCss @Classes?.TimePickerDecreaseHourIcon" />
                                 </button>
                             </div>
                             <div style="@Styles?.TimePickerHourMinuteSeparator" class="bit-dtp-tpr bit-dtp-tdv @Classes?.TimePickerHourMinuteSeparator">:</div>
@@ -594,7 +623,9 @@
                                         aria-disabled="@(IsEnabled is false)"
                                         style="@Styles?.TimePickerIncreaseMinuteButton"
                                         class="bit-dtp-tbt @Classes?.TimePickerIncreaseMinuteButton">
-                                    <i style="@Styles?.TimePickerIncreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.TimePickerIncreaseMinuteIcon" aria-hidden="true" />
+                                    <i aria-hidden="true"
+                                       style="@Styles?.TimePickerIncreaseMinuteIcon"
+                                       class="bit-dtp-cic @increaseMinuteIconCss @Classes?.TimePickerIncreaseMinuteIcon" />
                                 </button>
                                 <input @ref="_inputTimeMinuteRef"
                                        @bind="@_minuteView"
@@ -618,7 +649,9 @@
                                         aria-disabled="@(IsEnabled is false)"
                                         style="@Styles?.TimePickerDecreaseMinuteButton"
                                         class="bit-dtp-tbt @Classes?.TimePickerDecreaseMinuteButton">
-                                    <i style="@Styles?.TimePickerDecreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.TimePickerDecreaseMinuteIcon" aria-hidden="true" />
+                                    <i aria-hidden="true"
+                                       style="@Styles?.TimePickerDecreaseMinuteIcon"
+                                       class="bit-dtp-cic @decreaseMinuteIconCss @Classes?.TimePickerDecreaseMinuteIcon" />
                                 </button>
                             </div>
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
index 05601dcdf8..adf9eec359 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
@@ -134,6 +134,33 @@ private int _minuteView
     /// </summary>
     [Parameter] public BitDatePickerClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The icon to display inside the clear button.
+    /// Takes precedence over <see cref="ClearButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? ClearButtonIcon { get; set; }
+
+    /// <summary>
+    /// The name of the clear button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? ClearButtonIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the close button.
+    /// Takes precedence over <see cref="CloseButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? CloseButtonIcon { get; set; }
+
+    /// <summary>
+    /// The name of the close button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? CloseButtonIconName { get; set; }
+
+    /// <summary>
+    /// The title of the CloseDatePicker button (tooltip).
+    /// </summary>
+    [Parameter] public string CloseDatePickerTitle { get; set; } = "Close date picker";
+
     /// <summary>
     /// CultureInfo for the DatePicker.
     /// </summary>
@@ -166,6 +193,22 @@ private int _minuteView
     /// </summary>
     [Parameter] public string GoToNextYearTitle { get; set; } = "Go to next year {0}";
 
+    /// <summary>
+    /// The icon to display inside the GoToNow button.
+    /// Takes precedence over <see cref="GoToNowIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? GoToNowIcon { get; set; }
+
+    /// <summary>
+    /// The name of the GoToNow button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? GoToNowIconName { get; set; }
+
+    /// <summary>
+    /// The title of the GoToNow button (tooltip).
+    /// </summary>
+    [Parameter] public string GoToNowTitle { get; set; } = "Go to now";
+
     /// <summary>
     /// The title of the Go to previous month button (tooltip).
     /// </summary>
@@ -182,35 +225,42 @@ private int _minuteView
     [Parameter] public string GoToPrevYearTitle { get; set; } = "Go to previous year {0}";
 
     /// <summary>
-    /// The title of the GoToToday button (tooltip).
+    /// The icon to display inside the GoToToday button.
+    /// Takes precedence over <see cref="GoToTodayIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string GoToTodayTitle { get; set; } = "Go to today";
+    [Parameter] public BitIconInfo? GoToTodayIcon { get; set; }
 
     /// <summary>
-    /// The title of the GoToNow button (tooltip).
+    /// The name of the GoToToday button's icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public string GoToNowTitle { get; set; } = "Go to now";
+    [Parameter] public string? GoToTodayIconName { get; set; }
 
     /// <summary>
-    /// The title of the ShowTimePicker button (tooltip).
+    /// The title of the GoToToday button (tooltip).
     /// </summary>
-    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
+    [Parameter] public string GoToTodayTitle { get; set; } = "Go to today";
 
     /// <summary>
-    /// The title of the HideTimePicker button (tooltip).
+    /// Determines if the DatePicker has a border.
     /// </summary>
-    [Parameter] public string HideTimePickerTitle { get; set; } = "Hide time picker";
+    [Parameter, ResetClassBuilder]
+    public bool HasBorder { get; set; } = true;
 
     /// <summary>
-    /// The title of the CloseDatePicker button (tooltip).
+    /// The icon to display inside the HideTimePicker button.
+    /// Takes precedence over <see cref="HideTimePickerIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string CloseDatePickerTitle { get; set; } = "Close date picker";
+    [Parameter] public BitIconInfo? HideTimePickerIcon { get; set; }
 
     /// <summary>
-    /// Determines if the DatePicker has a border.
+    /// The name of the HideTimePicker button's icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter, ResetClassBuilder]
-    public bool HasBorder { get; set; } = true;
+    [Parameter] public string? HideTimePickerIconName { get; set; }
+
+    /// <summary>
+    /// The title of the HideTimePicker button (tooltip).
+    /// </summary>
+    [Parameter] public string HideTimePickerTitle { get; set; } = "Hide time picker";
 
     /// <summary>
     /// Whether the month picker should highlight the current month.
@@ -223,15 +273,9 @@ private int _minuteView
     [Parameter] public bool HighlightSelectedMonth { get; set; }
 
     /// <summary>
-    /// Custom template for the DatePicker's icon.
-    /// </summary>
-    [Parameter] public RenderFragment? IconTemplate { get; set; }
-
-    /// <summary>
-    /// Determines the location of the DatePicker's icon.
+    /// Determines increment/decrement steps for date-picker's hour.
     /// </summary>
-    [Parameter, ResetClassBuilder]
-    public BitIconLocation IconLocation { get; set; } = BitIconLocation.Right;
+    [Parameter] public int HourStep { get; set; } = 1;
 
     /// <summary>
     /// The icon to display in the DatePicker input.
@@ -248,16 +292,26 @@ private int _minuteView
     /// </example>
     [Parameter] public BitIconInfo? Icon { get; set; }
 
+    /// <summary>
+    /// Determines the location of the DatePicker's icon.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public BitIconLocation IconLocation { get; set; } = BitIconLocation.Right;
+
     /// <summary>
     /// The name of the DatePicker's icon from the built-in Fluent UI icon set.
     /// </summary>
     /// <remarks>
     /// The icon name should be from the Fluent UI icon set (e.g., <c>BitIconName.CalendarMirrored</c>).
-    /// Defaults to "CalendarMirrored" when not set.
     /// For external icon libraries, use <see cref="Icon"/> instead.
     /// </remarks>
     [Parameter] public string? IconName { get; set; }
 
+    /// <summary>
+    /// Custom template for the DatePicker's icon.
+    /// </summary>
+    [Parameter] public RenderFragment? IconTemplate { get; set; }
+
     /// <summary>
     /// The custom validation error message for the invalid value.
     /// </summary>
@@ -298,6 +352,11 @@ private int _minuteView
     [CallOnSet(nameof(OnSetParameters))]
     public DateTimeOffset? MinDate { get; set; }
 
+    /// <summary>
+    /// Determines increment/decrement steps for date-picker's minute.
+    /// </summary>
+    [Parameter] public int MinuteStep { get; set; } = 1;
+
     /// <summary>
     /// The selection mode of the DatePicker (DatePicker or MonthPicker).
     /// </summary>
@@ -315,6 +374,39 @@ private int _minuteView
     /// </summary>
     [Parameter] public string MonthPickerToggleTitle { get; set; } = "{0}, change month";
 
+    /// <summary>
+    /// The icon to display inside the next-month navigation button.
+    /// Takes precedence over <see cref="NextMonthNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-month navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the next-year navigation button.
+    /// Takes precedence over <see cref="NextYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-year navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextYearNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the next-year-range navigation button.
+    /// Takes precedence over <see cref="NextYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-year-range navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextYearRangeNavIconName { get; set; }
+
     /// <summary>
     /// The callback for clicking on the DatePicker's input.
     /// </summary>
@@ -336,14 +428,42 @@ private int _minuteView
     [Parameter] public EventCallback OnFocusOut { get; set; }
 
     /// <summary>
-    /// The text of selected date aria-atomic of the DatePicker.
+    /// The placeholder text of the DatePicker's input.
     /// </summary>
-    [Parameter] public string SelectedDateAriaAtomic { get; set; } = "Selected date {0}";
+    [Parameter] public string Placeholder { get; set; } = string.Empty;
 
     /// <summary>
-    /// The placeholder text of the DatePicker's input.
+    /// The icon to display inside the previous-month navigation button.
+    /// Takes precedence over <see cref="PrevMonthNavIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string Placeholder { get; set; } = string.Empty;
+    [Parameter] public BitIconInfo? PrevMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-month navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the previous-year navigation button.
+    /// Takes precedence over <see cref="PrevYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-year navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevYearNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the previous-year-range navigation button.
+    /// Takes precedence over <see cref="PrevYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-year-range navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevYearRangeNavIconName { get; set; }
 
     /// <summary>
     /// Enables the responsive mode in small screens.
@@ -351,20 +471,30 @@ private int _minuteView
     [Parameter] public bool Responsive { get; set; }
 
     /// <summary>
-    /// Whether the DatePicker's close button should be shown or not.
+    /// The text of selected date aria-atomic of the DatePicker.
     /// </summary>
-    [Parameter] public bool ShowCloseButton { get; set; }
+    [Parameter] public string SelectedDateAriaAtomic { get; set; } = "Selected date {0}";
 
     /// <summary>
-    /// Whether the GoToToday button should be shown or not.
+    /// Whether the clear button should be shown or not when the BitDatePicker has a value.
     /// </summary>
-    [Parameter] public bool ShowGoToToday { get; set; } = true;
+    [Parameter] public bool ShowClearButton { get; set; }
+
+    /// <summary>
+    /// Whether the DatePicker's close button should be shown or not.
+    /// </summary>
+    [Parameter] public bool ShowCloseButton { get; set; }
 
     /// <summary>
     /// Whether the GoToNow button should be shown or not.
     /// </summary>
     [Parameter] public bool ShowGoToNow { get; set; } = true;
 
+    /// <summary>
+    /// Whether the GoToToday button should be shown or not.
+    /// </summary>
+    [Parameter] public bool ShowGoToToday { get; set; } = true;
+
     /// <summary>
     /// Show month picker on top of date picker when visible.
     /// </summary>
@@ -379,11 +509,48 @@ private int _minuteView
     [CallOnSet(nameof(OnSetParameters))]
     public bool ShowTimePicker { get; set; }
 
+    /// <summary>
+    /// Show the time picker as an overlay on top of the date picker when visible.
+    /// </summary>
+    [Parameter]
+    [CallOnSet(nameof(OnSetParameters))]
+    public bool ShowTimePickerAsOverlay { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the ShowTimePicker button.
+    /// Takes precedence over <see cref="ShowTimePickerIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? ShowTimePickerIcon { get; set; }
+
+    /// <summary>
+    /// The name of the ShowTimePicker button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? ShowTimePickerIconName { get; set; }
+
+    /// <summary>
+    /// The title of the ShowTimePicker button (tooltip).
+    /// </summary>
+    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
+
     /// <summary>
     /// Whether the week number (weeks 1 to 53) should be shown before each week row.
     /// </summary>
     [Parameter] public bool ShowWeekNumbers { get; set; }
 
+    /// <summary>
+    /// Whether the date-picker is rendered standalone or with the input component and callout.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    [CallOnSet(nameof(OnSetParameters))]
+    public bool Standalone { get; set; }
+
+    /// <summary>
+    /// Specifies the date and time of the date-picker when it is opened without any selected value.
+    /// </summary>
+    [Parameter]
+    [CallOnSet(nameof(OnSetParameters))]
+    public DateTimeOffset? StartingValue { get; set; }
+
     /// <summary>
     /// Custom CSS styles for different parts of the BitDatePicker component.
     /// </summary>
@@ -395,73 +562,81 @@ private int _minuteView
     [Parameter] public BitTimeFormat TimeFormat { get; set; }
 
     /// <summary>
-    /// TimeZone for the DatePicker.
+    /// The icon to display inside the time-picker's decrease-hour button.
+    /// Takes precedence over <see cref="TimePickerDecreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public TimeZoneInfo? TimeZone { get; set; }
+    [Parameter] public BitIconInfo? TimePickerDecreaseHourIcon { get; set; }
 
     /// <summary>
-    /// Whether or not the text field of the DatePicker is underlined.
+    /// The name of the time-picker's decrease-hour button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter, ResetClassBuilder]
-    public bool Underlined { get; set; }
+    [Parameter] public string? TimePickerDecreaseHourIconName { get; set; }
 
     /// <summary>
-    /// The title of the week number (tooltip).
+    /// The icon to display inside the time-picker's decrease-minute button.
+    /// Takes precedence over <see cref="TimePickerDecreaseMinuteIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
+    [Parameter] public BitIconInfo? TimePickerDecreaseMinuteIcon { get; set; }
 
     /// <summary>
-    /// Custom template to render the year cells of the DatePicker.
+    /// The name of the time-picker's decrease-minute button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
+    [Parameter] public string? TimePickerDecreaseMinuteIconName { get; set; }
 
     /// <summary>
-    /// The title of the year picker's toggle (tooltip).
+    /// The icon to display inside the time-picker's increase-hour button.
+    /// Takes precedence over <see cref="TimePickerIncreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
+    [Parameter] public BitIconInfo? TimePickerIncreaseHourIcon { get; set; }
 
     /// <summary>
-    /// The title of the year range picker's toggle (tooltip).
+    /// The name of the time-picker's increase-hour button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
+    [Parameter] public string? TimePickerIncreaseHourIconName { get; set; }
 
     /// <summary>
-    /// Show month picker on top of date picker when visible.
+    /// The icon to display inside the time-picker's increase-minute button.
+    /// Takes precedence over <see cref="TimePickerIncreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? TimePickerIncreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// The name of the time-picker's increase-minute button icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? TimePickerIncreaseMinuteIconName { get; set; }
+
+    /// <summary>
+    /// TimeZone for the DatePicker.
     /// </summary>
     [Parameter]
     [CallOnSet(nameof(OnSetParameters))]
-    public bool ShowTimePickerAsOverlay { get; set; }
+    public TimeZoneInfo? TimeZone { get; set; }
 
     /// <summary>
-    /// Whether the clear button should be shown or not when the BitDatePicker has a value.
+    /// Whether or not the text field of the DatePicker is underlined.
     /// </summary>
-    [Parameter] public bool ShowClearButton { get; set; }
+    [Parameter, ResetClassBuilder]
+    public bool Underlined { get; set; }
 
     /// <summary>
-    /// Determines increment/decrement steps for date-picker's hour.
+    /// The title of the week number (tooltip).
     /// </summary>
-    [Parameter] public int HourStep { get; set; } = 1;
+    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
 
     /// <summary>
-    /// Determines increment/decrement steps for date-picker's minute.
+    /// Custom template to render the year cells of the DatePicker.
     /// </summary>
-    [Parameter] public int MinuteStep { get; set; } = 1;
+    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
 
     /// <summary>
-    /// Specifies the date and time of the date-picker when it is opened without any selected value.
+    /// The title of the year picker's toggle (tooltip).
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public DateTimeOffset? StartingValue { get; set; }
+    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
 
     /// <summary>
-    /// Whether the date-picker is rendered standalone or with the input component and callout.
+    /// The title of the year range picker's toggle (tooltip).
     /// </summary>
-    [Parameter, ResetClassBuilder]
-    [CallOnSet(nameof(OnSetParameters))]
-    public bool Standalone { get; set; }
+    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
 
 
 
@@ -1338,46 +1513,18 @@ private void ResetCts()
 
     private async Task ChangeHour(bool isNext)
     {
-        if (isNext)
-        {
-            _hour += HourStep;
-        }
-        else
-        {
-            _hour -= HourStep;
-        }
+        var hourStep = Math.Clamp(Math.Abs(HourStep), 1, 23);
 
-        if (_hour > 23)
-        {
-            _hour -= 24;
-        }
-        else if (_hour < 0)
-        {
-            _hour += 24;
-        }
+        _hour = (_hour + (isNext ? hourStep : -hourStep) + 24) % 24;
 
         await UpdateCurrentValue();
     }
 
     private async Task ChangeMinute(bool isNext)
     {
-        if (isNext)
-        {
-            _minute += MinuteStep;
-        }
-        else
-        {
-            _minute -= MinuteStep;
-        }
+        var minuteStep = Math.Clamp(Math.Abs(MinuteStep), 1, 59);
 
-        if (_minute > 59)
-        {
-            _minute -= 60;
-        }
-        else if (_minute < 0)
-        {
-            _minute += 60;
-        }
+        _minute = (_minute + (isNext ? minuteStep : -minuteStep) + 60) % 60;
 
         await UpdateCurrentValue();
     }
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scss
index cd98fd27b1..26049d10d2 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DatePicker/BitDatePicker.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 @import "../../../Styles/media-queries.scss";
 
 .bit-dtp {
@@ -396,7 +396,7 @@
         pointer-events: none;
         background-color: transparent;
 
-        .bit-dtp-gti,
+        .bit-dtp-cic,
         .bit-icon {
             color: $clr-fg-dis;
         }
@@ -443,7 +443,7 @@
         pointer-events: none;
         background-color: transparent;
 
-        .bit-dtp-gti,
+        .bit-dtp-cic,
         .bit-icon {
             color: $clr-fg-dis;
         }
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
index d7585a6b16..9576d0a0f1 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor
@@ -334,6 +334,43 @@
             <BitDatePicker Label="BitIconInfo.Css" Icon="@BitIconInfo.Css("bi bi-calendar3-event")" />
             <br />
             <BitDatePicker Label="BitIconInfo.Bi" Icon="@BitIconInfo.Bi("calendar3")" />
+
+            <br /><br /><br />
+
+            <div>Navigation &amp; TimePicker Icons (FontAwesome):</div>
+            <br />
+            <BitDatePicker Label="Custom nav icons (FA)"
+                           PrevMonthNavIcon="@BitIconInfo.Fa("solid chevron-left")"
+                           NextMonthNavIcon="@BitIconInfo.Fa("solid chevron-right")"
+                           PrevYearNavIcon="@BitIconInfo.Fa("solid angles-left")"
+                           NextYearNavIcon="@BitIconInfo.Fa("solid angles-right")"
+                           PrevYearRangeNavIcon="@BitIconInfo.Fa("solid angles-left")"
+                           NextYearRangeNavIcon="@BitIconInfo.Fa("solid angles-right")"
+                           GoToTodayIcon="@BitIconInfo.Fa("solid calendar-day")" />
+            <br />
+            <BitDatePicker Label="TimePicker icons (FA)"
+                           ShowTimePicker
+                           ShowClearButton
+                           GoToNowIcon="@BitIconInfo.Fa("solid clock")"
+                           HideTimePickerIcon="@BitIconInfo.Fa("solid calendar")"
+                           TimePickerIncreaseHourIcon="@BitIconInfo.Fa("solid chevron-up")"
+                           TimePickerDecreaseHourIcon="@BitIconInfo.Fa("solid chevron-down")"
+                           TimePickerIncreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-up")"
+                           TimePickerDecreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-down")"
+                           ClearButtonIcon="@BitIconInfo.Fa("solid xmark")" />
+
+            <br /><br /><br />
+
+            <div>Navigation Icons (Bootstrap):</div>
+            <br />
+            <BitDatePicker Label="Custom nav icons (Bootstrap)"
+                           PrevMonthNavIcon="@BitIconInfo.Bi("chevron-left")"
+                           NextMonthNavIcon="@BitIconInfo.Bi("chevron-right")"
+                           PrevYearNavIcon="@BitIconInfo.Bi("chevron-double-left")"
+                           NextYearNavIcon="@BitIconInfo.Bi("chevron-double-right")"
+                           PrevYearRangeNavIcon="@BitIconInfo.Bi("chevron-double-left")"
+                           NextYearRangeNavIcon="@BitIconInfo.Bi("chevron-double-right")"
+                           GoToTodayIcon="@BitIconInfo.Bi("calendar-event")" />
         </div>
     </DemoExample>
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
index adc6a26116..12c1087cef 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.cs
@@ -42,6 +42,45 @@ public partial class BitDatePickerDemo
             LinkType = LinkType.Link
         },
         new()
+        {
+            Name = "ClearButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the clear button. Takes precedence over ClearButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ClearButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the clear button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "CloseButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the close button. Takes precedence over CloseButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "CloseButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the close button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "CloseDatePickerTitle",
+            Type = "string",
+            DefaultValue = "Close date picker",
+            Description = "The title of the CloseDatePicker button (tooltip).",
+        },
+        new()
         {
             Name = "Culture",
             Type = "CultureInfo",
@@ -84,6 +123,29 @@ public partial class BitDatePickerDemo
             Description = "The title of the Go to next year button (tooltip)."
         },
         new()
+        {
+            Name = "GoToNowIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the GoToNow button. Takes precedence over GoToNowIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GoToNowIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the GoToNow button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "GoToNowTitle",
+            Type = "string",
+            DefaultValue = "Go to now",
+            Description = "The title of the GoToNow button (tooltip)."
+        },
+        new()
         {
             Name = "GoToPrevMonthTitle",
             Type = "string",
@@ -105,6 +167,22 @@ public partial class BitDatePickerDemo
             Description = "The title of the Go to previous year button (tooltip)."
         },
         new()
+        {
+            Name = "GoToTodayIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the GoToToday button. Takes precedence over GoToTodayIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GoToTodayIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the GoToToday button's icon from the built-in Fluent UI icon set."
+        },
+        new()
         {
             Name = "GoToTodayTitle",
             Type = "string",
@@ -119,6 +197,29 @@ public partial class BitDatePickerDemo
             Description = "Determines if the DatePicker has a border."
         },
         new()
+        {
+            Name = "HideTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the HideTimePicker button. Takes precedence over HideTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "HideTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the HideTimePicker button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "HideTimePickerTitle",
+            Type = "string",
+            DefaultValue = "Hide time picker",
+            Description = "The title of the HideTimePicker button (tooltip)."
+        },
+        new()
         {
             Name = "HighlightCurrentMonth",
             Type = "bool",
@@ -134,10 +235,19 @@ public partial class BitDatePickerDemo
         },
         new()
         {
-            Name = "IconTemplate",
-            Type = "RenderFragment?",
+            Name = "HourStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for date-picker's hour.",
+        },
+        new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
             DefaultValue = "null",
-            Description = "Custom template for the DatePicker's icon."
+            Description = "The icon to display in the DatePicker input using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
         },
         new()
         {
@@ -150,19 +260,17 @@ public partial class BitDatePickerDemo
         },
         new()
         {
-            Name = "Icon",
-            Type = "BitIconInfo?",
+            Name = "IconName",
+            Type = "string?",
             DefaultValue = "null",
-            Description = "The icon to display in the DatePicker input using custom CSS classes for external icon libraries. Takes precedence over IconName when both are set.",
-            LinkType = LinkType.Link,
-            Href = "#bit-icon-info",
+            Description = "The name of the DatePicker's icon from the built-in Fluent UI icon set. For external icon libraries, use Icon instead."
         },
         new()
         {
-            Name = "IconName",
-            Type = "string?",
-            DefaultValue = "CalendarMirrored",
-            Description = "The name of the DatePicker's icon from the built-in Fluent UI icon set. For external icon libraries, use Icon instead."
+            Name = "IconTemplate",
+            Type = "RenderFragment?",
+            DefaultValue = "null",
+            Description = "Custom template for the DatePicker's icon."
         },
         new()
         {
@@ -214,6 +322,13 @@ public partial class BitDatePickerDemo
             Description = "The minimum date allowed for the DatePicker."
         },
         new()
+        {
+            Name = "MinuteStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for date-picker's minute.",
+        },
+        new()
         {
             Name = "Mode",
             Type = "BitDatePickerMode",
@@ -237,6 +352,54 @@ public partial class BitDatePickerDemo
             Description = "The title of the month picker's toggle (tooltip)."
         },
         new()
+        {
+            Name = "NextMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-month navigation button. Takes precedence over NextMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-month navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "NextYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-year navigation button. Takes precedence over NextYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-year navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-year-range navigation button. Takes precedence over NextYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-year-range navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
         {
             Name = "OnClick",
             Type = "EventCallback",
@@ -268,6 +431,54 @@ public partial class BitDatePickerDemo
             Description = "The placeholder text of the DatePicker's input."
         },
         new()
+        {
+            Name = "PrevMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-month navigation button. Takes precedence over PrevMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-month navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "PrevYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-year navigation button. Takes precedence over PrevYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-year navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-year-range navigation button. Takes precedence over PrevYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-year-range navigation button's icon from the built-in Fluent UI icon set."
+        },
+        new()
         {
             Name = "Responsive",
             Type = "bool",
@@ -296,6 +507,13 @@ public partial class BitDatePickerDemo
             Description = "Whether the DatePicker's close button should be shown or not."
         },
         new()
+        {
+            Name = "ShowGoToNow",
+            Type = "bool",
+            DefaultValue = "true",
+            Description = "Whether the GoToNow button should be shown or not."
+        },
+        new()
         {
             Name = "ShowGoToToday",
             Type = "bool",
@@ -317,6 +535,36 @@ public partial class BitDatePickerDemo
             Description = "Whether or not render the time-picker."
         },
         new()
+        {
+            Name = "ShowTimePickerAsOverlay",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Show the time picker as an overlay on top of the date picker when visible."
+        },
+        new()
+        {
+            Name = "ShowTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the ShowTimePicker button. Takes precedence over ShowTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ShowTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the ShowTimePicker button's icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "ShowTimePickerTitle",
+            Type = "string",
+            DefaultValue = "Show time picker",
+            Description = "The title of the ShowTimePicker button (tooltip)."
+        },
+        new()
         {
             Name = "ShowWeekNumbers",
             Type = "bool",
@@ -324,6 +572,13 @@ public partial class BitDatePickerDemo
             Description = "Whether the week number (weeks 1 to 53) should be shown before each week row."
         },
         new()
+        {
+            Name = "Standalone",
+            Type = "bool",
+            DefaultValue = "false",
+            Description = "Whether the date-picker is rendered standalone or with the input component and callout.",
+        },
+        new()
         {
             Name = "StartingValue",
             Type = "DateTimeOffset?",
@@ -340,13 +595,6 @@ public partial class BitDatePickerDemo
             LinkType = LinkType.Link
         },
         new()
-        {
-            Name = "Standalone",
-            Type = "bool",
-            DefaultValue = "false",
-            Description = "Whether the date-picker is rendered standalone or with the input component and callout.",
-        },
-        new()
         {
             Name = "TimeFormat",
             Type = "BitTimeFormat",
@@ -356,6 +604,70 @@ public partial class BitDatePickerDemo
             Href = "#time-format-enum"
         },
         new()
+        {
+            Name = "TimePickerDecreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the time-picker's decrease-hour button. Takes precedence over TimePickerDecreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the time-picker's decrease-hour button icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the time-picker's decrease-minute button. Takes precedence over TimePickerDecreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "TimePickerDecreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the time-picker's decrease-minute button icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the time-picker's increase-hour button. Takes precedence over TimePickerIncreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the time-picker's increase-hour button icon from the built-in Fluent UI icon set."
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the time-picker's increase-minute button. Takes precedence over TimePickerIncreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "TimePickerIncreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the time-picker's increase-minute button icon from the built-in Fluent UI icon set."
+        },
+        new()
         {
             Name = "TimeZone",
             Type = "TimeZoneInfo?",
@@ -396,20 +708,6 @@ public partial class BitDatePickerDemo
             Type = "string",
             DefaultValue = "{0} - {1}, change month",
             Description = "The title of the year range picker's toggle (tooltip)."
-        },
-        new()
-        {
-            Name = "HourStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for date-picker's hour.",
-        },
-        new()
-        {
-            Name = "MinuteStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for date-picker's minute.",
         }
     ];
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
index 9530332d7e..a1cdaf0824 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DatePicker/BitDatePickerDemo.razor.samples.cs
@@ -246,7 +246,37 @@ private void HandleValidSubmit() { }
 
 <BitDatePicker Label=""BitIconInfo.Css"" Icon=""@BitIconInfo.Css(""bi bi-calendar3-event"")"" />
 
-<BitDatePicker Label=""BitIconInfo.Bi"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />";
+<BitDatePicker Label=""BitIconInfo.Bi"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />
+
+
+<BitDatePicker Label=""Custom nav icons (FA)""
+               PrevMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-left"")""
+               NextMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-right"")""
+               PrevYearNavIcon=""@BitIconInfo.Fa(""solid angles-left"")""
+               NextYearNavIcon=""@BitIconInfo.Fa(""solid angles-right"")""
+               PrevYearRangeNavIcon=""@BitIconInfo.Fa(""solid angles-left"")""
+               NextYearRangeNavIcon=""@BitIconInfo.Fa(""solid angles-right"")""
+               GoToTodayIcon=""@BitIconInfo.Fa(""solid calendar-day"")"" />
+
+<BitDatePicker Label=""TimePicker icons (FA)""
+               ShowTimePicker
+               ShowClearButton
+               GoToNowIcon=""@BitIconInfo.Fa(""solid clock"")""
+               HideTimePickerIcon=""@BitIconInfo.Fa(""solid calendar"")""
+               TimePickerIncreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+               TimePickerDecreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-down"")""
+               TimePickerIncreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+               TimePickerDecreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-down"")""
+               ClearButtonIcon=""@BitIconInfo.Fa(""solid xmark"")"" />
+
+<BitDatePicker Label=""Custom nav icons (Bootstrap)""
+               PrevMonthNavIcon=""@BitIconInfo.Bi(""chevron-left"")""
+               NextMonthNavIcon=""@BitIconInfo.Bi(""chevron-right"")""
+               PrevYearNavIcon=""@BitIconInfo.Bi(""chevron-double-left"")""
+               NextYearNavIcon=""@BitIconInfo.Bi(""chevron-double-right"")""
+               PrevYearRangeNavIcon=""@BitIconInfo.Bi(""chevron-double-left"")""
+               NextYearRangeNavIcon=""@BitIconInfo.Bi(""chevron-double-right"")""
+               GoToTodayIcon=""@BitIconInfo.Bi(""calendar-event"")"" />";
 
     private readonly string example16RazorCode = @"
 <style>
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DatePicker/BitDatePickerTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DatePicker/BitDatePickerTests.cs
index eb5a1f34b9..7c4bddbd2d 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DatePicker/BitDatePickerTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DatePicker/BitDatePickerTests.cs
@@ -1,7 +1,8 @@
 using System;
 using System.Collections.Generic;
-using Microsoft.VisualStudio.TestTools.UnitTesting;
+using System.Linq;
 using Bunit;
+using Microsoft.VisualStudio.TestTools.UnitTesting;
 
 namespace Bit.BlazorUI.Tests.Components.Inputs.DatePicker;
 
@@ -40,6 +41,7 @@ public void BitDatePickerShouldRenderLabelTemplate(string labelTemplate)
         });
 
         var bitDatePickerLabelChild = component.Find(".bit-dtp > label").ChildNodes;
+
         bitDatePickerLabelChild.MarkupMatches(labelTemplate);
     }
 
@@ -64,7 +66,9 @@ public void BitDatePickerShouldGiveValueToGoToToday(string goToToday)
     public void BitDatePickerShouldHandleOnClickEvent(bool isEnabled, int count)
     {
         int clickedValue = 0;
+
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Add(p => p.IsEnabled, isEnabled);
@@ -72,6 +76,7 @@ public void BitDatePickerShouldHandleOnClickEvent(bool isEnabled, int count)
         });
 
         var bitDatePickerInput = component.Find(".bit-dtp-wrp");
+
         bitDatePickerInput.Click();
 
         Assert.AreEqual(count, clickedValue);
@@ -83,9 +88,11 @@ public void BitDatePickerShouldHandleOnClickEvent(bool isEnabled, int count)
     ]
     public void BitDatePickerCalendarItemsShouldRespectIsEnabled(bool isEnabled, int count)
     {
-        var changedDateValue = 0;
         var isOpen = true;
+        var changedDateValue = 0;
+
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Bind(p => p.IsOpen, isOpen, v => isOpen = v);
@@ -97,15 +104,19 @@ public void BitDatePickerCalendarItemsShouldRespectIsEnabled(bool isEnabled, int
 
         Random random = new();
         int randomNumber = random.Next(0, dateItems.Count - 1);
+
         dateItems[randomNumber].Click();
+
         Assert.AreEqual(count, changedDateValue);
     }
 
     [TestMethod]
     public void BitDatePickerCalendarSelectTodayDate()
     {
-        Context.JSInterop.Mode = JSRuntimeMode.Loose;
         var isOpen = true;
+
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Bind(p => p.IsOpen, isOpen, v => isOpen = v);
@@ -115,6 +126,7 @@ public void BitDatePickerCalendarSelectTodayDate()
         Assert.IsNull(component.Instance.Value);
 
         var today = component.Find(".bit-dtp-dtd");
+
         today.Click();
 
         Assert.IsNotNull(component.Instance.Value);
@@ -126,6 +138,7 @@ public void BitDatePickerCalendarSelectTodayDate()
     public void BitDatePickerValidationFormTest()
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePickerValidationTest>(parameters =>
         {
             parameters.Add(p => p.IsEnabled, true);
@@ -133,6 +146,7 @@ public void BitDatePickerValidationFormTest()
         });
 
         var form = component.Find("form");
+
         form.Submit();
 
         Assert.AreEqual(0, component.Instance.ValidCount);
@@ -140,10 +154,12 @@ public void BitDatePickerValidationFormTest()
 
         //open date picker
         var datePicker = component.Find(".bit-dtp-wrp");
+
         datePicker.Click();
 
         //select today
         var today = component.Find(".bit-dtp-dtd");
+
         today.Click();
 
         form.Submit();
@@ -157,6 +173,7 @@ public void BitDatePickerValidationFormTest()
     public void BitDatePickerValidationInvalidHtmlAttributeTest()
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePickerValidationTest>(parameters =>
         {
             parameters.Add(p => p.IsEnabled, true);
@@ -164,9 +181,11 @@ public void BitDatePickerValidationInvalidHtmlAttributeTest()
         });
 
         var inputDate = component.Find("input[type='text']");
+
         Assert.IsFalse(inputDate.HasAttribute("aria-invalid"));
 
         var form = component.Find("form");
+
         form.Submit();
 
         Assert.IsTrue(inputDate.HasAttribute("aria-invalid"));
@@ -174,10 +193,12 @@ public void BitDatePickerValidationInvalidHtmlAttributeTest()
 
         //open date picker
         var datePicker = component.Find(".bit-dtp-wrp");
+
         datePicker.Click();
 
         //select today
         var today = component.Find(".bit-dtp-dtd");
+
         today.Click();
 
         form.Submit();
@@ -189,6 +210,7 @@ public void BitDatePickerValidationInvalidHtmlAttributeTest()
     public void BitDatePickerValidationInvalidCssClassTest()
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePickerValidationTest>(parameters =>
         {
             parameters.Add(p => p.IsEnabled, true);
@@ -200,16 +222,19 @@ public void BitDatePickerValidationInvalidCssClassTest()
         Assert.IsFalse(bitDatePicker.ClassList.Contains("bit-inv"));
 
         var form = component.Find("form");
+
         form.Submit();
 
         Assert.IsTrue(bitDatePicker.ClassList.Contains("bit-inv"));
 
         //open date picker
         var datePicker = component.Find(".bit-dtp-wrp");
+
         datePicker.Click();
 
         //select today
         var today = component.Find(".bit-dtp-dtd");
+
         today.Click();
 
         Assert.IsFalse(bitDatePicker.ClassList.Contains("bit-inv"));
@@ -219,6 +244,7 @@ public void BitDatePickerValidationInvalidCssClassTest()
     public void BitDatePickerAriaLabelTest(string pickerAriaLabel)
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Add(p => p.CalloutAriaLabel, pickerAriaLabel);
@@ -237,6 +263,7 @@ public void BitDatePickerAriaLabelTest(string pickerAriaLabel)
     public void BitDatePickerShowGoToTodayTest(bool showGoToToday)
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Add(p => p.ShowGoToToday, showGoToToday);
@@ -246,11 +273,11 @@ public void BitDatePickerShowGoToTodayTest(bool showGoToToday)
 
         if (showGoToToday)
         {
-            Assert.AreEqual(1, goToTodayBtnElms.Count);
+            Assert.HasCount(1, goToTodayBtnElms);
         }
         else
         {
-            Assert.AreEqual(0, goToTodayBtnElms.Count);
+            Assert.IsEmpty(goToTodayBtnElms);
         }
     }
 
@@ -285,6 +312,7 @@ public void BitDatePickerShowGoToTodayTest(bool showGoToToday)
     public void BitDatePickerHighlightCurrentMonthTest(bool highlightCurrentMonth)
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Add(p => p.HighlightCurrentMonth, highlightCurrentMonth);
@@ -294,11 +322,11 @@ public void BitDatePickerHighlightCurrentMonthTest(bool highlightCurrentMonth)
 
         if (highlightCurrentMonth)
         {
-            Assert.AreEqual(1, currentMonthCells.Count);
+            Assert.HasCount(1, currentMonthCells);
         }
         else
         {
-            Assert.AreEqual(0, currentMonthCells.Count);
+            Assert.IsEmpty(currentMonthCells);
         }
     }
 
@@ -309,6 +337,7 @@ public void BitDatePickerHighlightCurrentMonthTest(bool highlightCurrentMonth)
     public void BitDatePickerHighlightSelectedMonthTest(bool highlightSelectedMonth)
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var component = RenderComponent<BitDatePicker>(parameters =>
         {
             parameters.Add(p => p.HighlightSelectedMonth, highlightSelectedMonth);
@@ -319,11 +348,11 @@ public void BitDatePickerHighlightSelectedMonthTest(bool highlightSelectedMonth)
 
         if (highlightSelectedMonth)
         {
-            Assert.AreEqual(1, selectedMonthCells.Count);
+            Assert.HasCount(1, selectedMonthCells);
         }
         else
         {
-            Assert.AreEqual(0, selectedMonthCells.Count);
+            Assert.IsEmpty(selectedMonthCells);
         }
     }
 
@@ -331,6 +360,7 @@ public void BitDatePickerHighlightSelectedMonthTest(bool highlightSelectedMonth)
     public void BitDatePickerCalloutHtmlAttributesTest()
     {
         Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
         var calloutHtmlAttributes = new Dictionary<string, object>
         {
             {"style", "color: blue" }
@@ -346,4 +376,660 @@ public void BitDatePickerCalloutHtmlAttributesTest()
 
         Assert.AreEqual("color: blue", calloutStyle);
     }
+
+    [TestMethod,
+        DataRow("ChevronLeft", "bit-icon--ChevronLeft"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDatePickerPrevMonthNavIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevMonthNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-pkh .bit-dtp-nbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerPrevMonthNavIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-left"));
+        });
+
+        var icon = component.Find(".bit-dtp-pkh .bit-dtp-nbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-left"),
+            $"Expected 'fa-chevron-left' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDatePickerNextMonthNavIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.NextMonthNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-pkh .bit-dtp-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerNextMonthNavIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-right"));
+        });
+
+        var icon = component.Find(".bit-dtp-pkh .bit-dtp-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-right"),
+            $"Expected 'fa-chevron-right' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("CalendarDay", "bit-icon--CalendarDay"),
+        DataRow(null, "bit-icon--GotoToday")
+    ]
+    public void BitDatePickerGoToTodayIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowGoToToday, true);
+            parameters.Add(p => p.Classes, new BitDatePickerClassStyles { GoToTodayIcon = "gtt-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.GoToTodayIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".gtt-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerGoToTodayIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowGoToToday, true);
+            parameters.Add(p => p.GoToTodayIcon, BitIconInfo.Css("fa-solid fa-calendar-day"));
+            parameters.Add(p => p.Classes, new BitDatePickerClassStyles { GoToTodayIcon = "gtt-icon" });
+        });
+
+        var icon = component.Find(".gtt-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-calendar-day"),
+            $"Expected 'fa-calendar-day' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("X", "bit-icon--X"),
+        DataRow(null, "bit-icon--Cancel")
+    ]
+    public void BitDatePickerCloseButtonIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowCloseButton, true);
+            parameters.Add(p => p.Classes, new BitDatePickerClassStyles { CloseButtonIcon = "close-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.CloseButtonIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".close-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerCloseButtonIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowCloseButton, true);
+            parameters.Add(p => p.CloseButtonIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+            parameters.Add(p => p.Classes, new BitDatePickerClassStyles { CloseButtonIcon = "close-icon" });
+        });
+
+        var icon = component.Find(".close-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-xmark"),
+            $"Expected 'fa-xmark' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("XmarkCircle", "bit-icon--XmarkCircle"),
+        DataRow(null, "bit-icon--Cancel")
+    ]
+    public void BitDatePickerClearButtonIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowClearButton, true);
+            parameters.Add(p => p.Value, DateTimeOffset.Now);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ClearButtonIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-clr i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerClearButtonIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowClearButton, true);
+            parameters.Add(p => p.Value, DateTimeOffset.Now);
+            parameters.Add(p => p.ClearButtonIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+        });
+
+        var icon = component.Find(".bit-dtp-clr i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-xmark"),
+            $"Expected 'fa-xmark' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ClockRegular", "bit-icon--ClockRegular"),
+        DataRow(null, "bit-icon--Clock")
+    ]
+    public void BitDatePickerGoToNowIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowGoToNow, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.GoToNowIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-gtn i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on GoToNowIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerGoToNowIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowGoToNow, true);
+            parameters.Add(p => p.GoToNowIcon, BitIconInfo.Css("fa-solid fa-clock"));
+        });
+
+        var icon = component.Find(".bit-dtp-gtn i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on GoToNowIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-clock"),
+            $"Expected 'fa-clock' on GoToNowIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUpSmall", "bit-icon--ChevronUpSmall"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDatePickerTimePickerIncreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.TimePickerIncreaseHourIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-tbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on TimePickerIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerTimePickerIncreaseHourIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+        });
+
+        var icon = component.Find(".bit-dtp-tbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on TimePickerIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on TimePickerIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUpSmall", "bit-icon--ChevronUpSmall"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDatePickerTimePickerDecreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.TimePickerDecreaseHourIconName, iconName);
+            }
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[1].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on TimePickerDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerTimePickerDecreaseHourIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[1].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on TimePickerDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on TimePickerDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUpSmall", "bit-icon--ChevronUpSmall"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDatePickerTimePickerIncreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.TimePickerIncreaseMinuteIconName, iconName);
+            }
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[2].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on TimePickerIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerTimePickerIncreaseMinuteIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerIncreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[2].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on TimePickerIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on TimePickerIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUpSmall", "bit-icon--ChevronUpSmall"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDatePickerTimePickerDecreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.TimePickerDecreaseMinuteIconName, iconName);
+            }
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[3].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on TimePickerDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerTimePickerDecreaseMinuteIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.TimePickerDecreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+        });
+
+        var tbtButtons = component.FindAll(".bit-dtp-tbt");
+        var icon = tbtButtons[3].QuerySelector("i")!;
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on TimePickerDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on TimePickerDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronLeft", "bit-icon--ChevronLeft"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDatePickerPrevYearNavIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevYearNavIconName, iconName);
+            }
+        });
+
+        // PrevYearNavIcon is in the month-picker header (year-month-picker wrapper)
+        var icon = component.Find(".bit-dtp-mwp .bit-dtp-pkh .bit-dtp-nbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerPrevYearNavIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-left"));
+        });
+
+        var icon = component.Find(".bit-dtp-mwp .bit-dtp-pkh .bit-dtp-nbt:first-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-left"),
+            $"Expected 'fa-angles-left' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDatePickerNextYearNavIconNameTest(string? iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.NextYearNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".bit-dtp-mwp .bit-dtp-pkh .bit-dtp-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDatePickerNextYearNavIconTest()
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-right"));
+        });
+
+        var icon = component.Find(".bit-dtp-mwp .bit-dtp-pkh .bit-dtp-nbt:last-child i");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-right"),
+            $"Expected 'fa-angles-right' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [Ignore]
+    [TestMethod,
+         DataRow("ChevronLeft", "bit-icon--ChevronLeft")
+     ]
+    public void BitDatePickerPrevYearRangeNavIconNameTest(string iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevYearRangeNavIconName, iconName);
+        });
+        
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+        
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on PrevYearRangeNavIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDatePickerPrevYearRangeNavIconTest()
+    {
+        var expectedClass = "bit-icon--ChevronLeft";
+
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevYearRangeNavIcon, BitIconInfo.Bit("ChevronLeft"));
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+        
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on PrevYearRangeNavIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight")
+    ]
+    public void BitDatePickerNextYearRangeNavIconNameTest(string iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextYearRangeNavIconName, iconName);
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+        
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on NextYearRangeNavIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDatePickerNextYearRangeNavIconTest()
+    {
+        var expectedClass = "bit-icon--ChevronRight";
+
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextYearRangeNavIcon, BitIconInfo.Bit("ChevronRight"));
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+        
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on NextYearRangeNavIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("Clock", "bit-icon--Clock")
+    ]
+    public void BitDatePickerShowTimePickerIconNameTest(string iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePickerIconName, iconName);
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on ShowTimePickerIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDatePickerShowTimePickerIconTest()
+    {
+        var expectedClass = "bit-icon--Clock";
+
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePickerIcon, BitIconInfo.Bit("Clock"));
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on ShowTimePickerIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("Cancel", "bit-icon--Cancel")
+    ]
+    public void BitDatePickerHideTimePickerIconNameTest(string iconName, string expectedClass)
+    {
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowMonthPickerAsOverlay, true);
+            parameters.Add(p => p.HideTimePickerIconName, iconName);
+            parameters.Add(p => p.Classes, new BitDatePickerClassStyles { ShowTimePickerButton = "picker-button" });
+        });
+
+        var btn = component.Find(".picker-button");
+
+        btn.Click();
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on HideTimePickerIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDatePickerHideTimePickerIconTest()
+    {
+        var expectedClass = "bit-icon--Cancel";
+
+        var component = RenderComponent<BitDatePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.HideTimePickerIcon, BitIconInfo.Bit("Cancel"));
+        });
+
+        var icon = component.FindAll("i")
+                            .FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on HideTimePickerIcon but no matching icon element was found.");
+    }
 }

From 484d6f6bac324656733bdc31d1a6c3b209a76791 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Thu, 19 Mar 2026 17:58:53 +0330
Subject: [PATCH 58/66] feat(prerelease): v-10.4.3-pre-03 #12194 (#12196)

---
 src/Besql/Bit.Besql/wwwroot/bit-besql.js      |  2 +-
 src/Bit.Build.props                           |  2 +-
 .../buildTransitive/Bit.BlazorES2019.targets  |  8 +++----
 src/BlazorUI/Bit.BlazorUI/Info.cs             |  2 +-
 src/BlazorUI/Bit.BlazorUI/Scripts/general.ts  |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  6 ++---
 .../Bit.BlazorUI.Demo.Shared.csproj           |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |  6 ++---
 .../Bit.BlazorUI.Demo.Client.Web.csproj       |  6 ++---
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  6 ++---
 src/BlazorUI/Demo/Directory.Build.props       |  2 +-
 .../Bit.Bswup.Demo/wwwroot/service-worker.js  |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../wwwroot/service-worker.js                 |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.progress.ts   |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts   |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts      |  2 +-
 .../FullDemo/Client/wwwroot/service-worker.js |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 src/Butil/Bit.Butil/Scripts/butil.ts          |  2 +-
 .../BlazorEmpty.Client.csproj                 |  8 +++----
 .../BlazorEmpty/BlazorEmpty.csproj            |  8 +++----
 .../.docs/19- Project Miscellaneous Files.md  | 10 ++++-----
 .../Boilerplate/Bit.Boilerplate/README.md     |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../src/Directory.Packages.props              | 22 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Careers.Server.csproj        |  6 ++---
 .../Bit.Websites.Careers.Shared.csproj        |  4 ++--
 .../Careers/src/Directory.Build.props         |  2 +-
 .../Bit.Websites.Platform.Client.csproj       | 14 ++++++------
 .../Templates03GettingStartedPage.razor       |  2 +-
 .../Templates03GettingStartedPage.razor.cs    |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Platform.Server.csproj       |  6 ++---
 .../Bit.Websites.Platform.Shared.csproj       |  4 ++--
 .../Platform/src/Directory.Build.props        |  2 +-
 .../Bit.Websites.Sales.Client.csproj          | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Sales.Server.csproj          |  6 ++---
 .../Bit.Websites.Sales.Shared.csproj          |  4 ++--
 src/Websites/Sales/src/Directory.Build.props  |  2 +-
 47 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
index bdcf1ef48a..e46a118cca 100644
--- a/src/Besql/Bit.Besql/wwwroot/bit-besql.js
+++ b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
@@ -1,5 +1,5 @@
 var BitBesql = window.BitBesql || {};
-BitBesql.version = window['bit-besql version'] = '10.4.3-pre-02';
+BitBesql.version = window['bit-besql version'] = '10.4.3-pre-03';
 
 BitBesql.persist = async function besqlPersist(fileName) {
 
diff --git a/src/Bit.Build.props b/src/Bit.Build.props
index 82ba2ccd07..1cc292871c 100644
--- a/src/Bit.Build.props
+++ b/src/Bit.Build.props
@@ -27,7 +27,7 @@
         <PackageProjectUrl>https://github.com/bitfoundation/bitplatform</PackageProjectUrl>
 
         <!-- Version -->
-        <ReleaseVersion>10.4.3-pre-02</ReleaseVersion>
+        <ReleaseVersion>10.4.3-pre-03</ReleaseVersion>
           <PackageVersion>$(ReleaseVersion)</PackageVersion>
         <PackageReleaseNotes>https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion)</PackageReleaseNotes>
         <Version Condition=" '$(Configuration)' == 'Release' ">$([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.'))</Version>
diff --git a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
index 23058b3974..59e91dc1ed 100644
--- a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
+++ b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
@@ -1,13 +1,13 @@
 <Project>
     <ItemGroup>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
         </Content>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-02/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
diff --git a/src/BlazorUI/Bit.BlazorUI/Info.cs b/src/BlazorUI/Bit.BlazorUI/Info.cs
index 00486ee754..ef5d4ec794 100644
--- a/src/BlazorUI/Bit.BlazorUI/Info.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Info.cs
@@ -8,5 +8,5 @@ public static class Info
     /// <summary>
     /// The current version string of bit BlazorUI.
     /// </summary>
-    public static string Version { get; } = "10.4.3-pre-02";
+    public static string Version { get; } = "10.4.3-pre-03";
 }
diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
index e19210af91..5e410b3a32 100644
--- a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
+++ b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
@@ -1,4 +1,4 @@
-(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-02';
+(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-03';
 
 interface DotNetObject {
     invokeMethod<T>(methodIdentifier: string, ...args: any[]): T;
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index e87ddaf65c..56fb4c880a 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -10,12 +10,12 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index 51070ed05b..162203d410 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -5,11 +5,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 285fb5d5d6..26f855e77e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -16,11 +16,11 @@
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
 
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 8ac60138a1..3f17161ee0 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -98,13 +98,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
         <PackageReference Include="Microsoft.AppCenter.Crashes" Version="5.0.7" />
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
index bdc5110c7d..3e6fd95185 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
@@ -28,13 +28,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
index e8d2a3d751..57d91435cb 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index bbf401c576..e8ec96a011 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -29,12 +29,12 @@
         <Using Include="Bit.BlazorUI.Demo.Client.Core.Services" />
         <Using Include="Bit.BlazorUI.Demo.Shared" />
         <Watch Remove="*.scss" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Directory.Build.props b/src/BlazorUI/Demo/Directory.Build.props
index 21b09d8992..6627835a44 100644
--- a/src/BlazorUI/Demo/Directory.Build.props
+++ b/src/BlazorUI/Demo/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
index 38ba99be8d..5ac9a5663c 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
index a15af28079..474ab8338e 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
index 39c900c0a9..c14fb45377 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
index c52defb3d7..7ffdc8b8cd 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 self.assetsInclude = [];
 self.assetsExclude = [
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
index 01505b1cda..398ea4d4fe 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
@@ -1,4 +1,4 @@
-window['bit-bswup.progress version'] = '10.4.3-pre-02';
+window['bit-bswup.progress version'] = '10.4.3-pre-03';
 
 (function () {
     const _config: IBswupProgressConfigs = {};
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
index 93f56dfc34..649c44c76b 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-02';
+self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-03';
 
 self.addEventListener('install', e => e.waitUntil(removeBswup()));
 
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
index 0109245c75..d2889fcaa8 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw version'] = '10.4.3-pre-02';
+self['bit-bswup.sw version'] = '10.4.3-pre-03';
 
 interface Window {
     clients: any
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
index d65f71ea0d..cfa40a1d38 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
@@ -1,5 +1,5 @@
 var BitBswup = BitBswup || {};
-BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-02';
+BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-03';
 
 (function () {
     const bitBswupScript = document.currentScript;
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
index c2f8e14353..c47ec891da 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
index 0b7c2e37cd..4caa610bd5 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 
 self.assetsInclude = [];
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
diff --git a/src/Butil/Bit.Butil/Scripts/butil.ts b/src/Butil/Bit.Butil/Scripts/butil.ts
index 567241686c..fded6bf0bf 100644
--- a/src/Butil/Bit.Butil/Scripts/butil.ts
+++ b/src/Butil/Bit.Butil/Scripts/butil.ts
@@ -1,2 +1,2 @@
 var BitButil = BitButil || {};
-BitButil.version = window['bit-butil version'] = '10.4.3-pre-02';
\ No newline at end of file
+BitButil.version = window['bit-butil version'] = '10.4.3-pre-03';
\ No newline at end of file
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
index 836edb850e..34078e41d4 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-02 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-03 -->
 
 <Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
 
@@ -15,14 +15,14 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
index f82902ed2f..0e7b8228d0 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-02 -->
+<!-- Generated by bit-empty template v-10.4.3-pre-03 -->
 
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
@@ -18,14 +18,14 @@
   <!--#endif -->
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md
index 0d1d8baae6..18117c0c07 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
@@ -221,7 +221,7 @@ These namespaces are **automatically imported** in every C# file, eliminating th
 
 Instead of this in each `.csproj`:
 ```xml
-<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
 ```
 
 You write this in `.csproj`:
@@ -231,7 +231,7 @@ You write this in `.csproj`:
 
 And the version is defined centrally in `Directory.Packages.props`:
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
 ```
 
 **Benefits**:
@@ -242,8 +242,8 @@ And the version is defined centrally in `Directory.Packages.props`:
 **Example packages included**:
 
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
-<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-02" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-03" />
 <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.0" />
 <PackageVersion Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.0" />
 <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.21" />
@@ -608,7 +608,7 @@ When you open the project in VS Code, you'll be prompted to install these extens
 **Example**:
 
 ````markdown
-This project gets generated by bit-bp template v-10.4.3-pre-02 using the following command
+This project gets generated by bit-bp template v-10.4.3-pre-03 using the following command
 ```bash
 dotnet new bit-bp
     --name Boilerplate
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/README.md b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
index b2fa1743d7..7a14af1dd0 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/README.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
@@ -2,7 +2,7 @@
 
 Thank you for creating a new project with bit platform! We appreciate your trust in our platform and are excited to see what you'll build.
 
-This project generated by bit-bp template v-10.4.3-pre-02 using the following command:
+This project generated by bit-bp template v-10.4.3-pre-03 using the following command:
 
 ```bash
     dotnet new bit-bp
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
index bb864cc4d3..0148e77456 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
@@ -1,5 +1,5 @@
 //+:cnd:noEmit
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 //#if (notification == true)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 44a16e6839..37ea7a4e1d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -1,16 +1,16 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
 <Project>
     <ItemGroup>
         <!-- https://learn.microsoft.com/en-us/nuget/consume-packages/central-package-management -->
-        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02" />
-        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-02" />
+        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-03" />
         <PackageVersion Include="DistributedLock.FileSystem" Version="1.0.3" />
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
@@ -90,7 +90,7 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-02" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-03" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index 655580e543..d2b889afa6 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
index ce5f1e767b..572d85423b 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index 7b032f69be..df871f3ed6 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Careers.Shared\Bit.Websites.Careers.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Careers.Client\Bit.Websites.Careers.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index 92075e34ea..a7823441a9 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Directory.Build.props b/src/Websites/Careers/src/Directory.Build.props
index 81c2f48789..624f9a85ec 100644
--- a/src/Websites/Careers/src/Directory.Build.props
+++ b/src/Websites/Careers/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 6f888a82dc..4e970b94d2 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -32,16 +32,16 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 51b7d3f639..0cfdc6819a 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -153,7 +153,7 @@ rm $HOME/dotnet.tar.gz</CodeBox>
                         </li>
                         <li>
                             <div style="margin-bottom:8px">Install <a href="https://www.nuget.org/packages/Bit.Boilerplate" target="_blank">Bit Boilerplate</a> project template</div>
-                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-02</CodeBox>
+                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-03</CodeBox>
                         </li>
                         @if (showCrossPlatform && devOS is "Windows")
                         {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
index c5da533429..b7048c5eb6 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
@@ -43,7 +43,7 @@ public partial class Templates03GettingStartedPage
             command:"dotnet tool install -g Aspire.Cli"),
 
             (text:@"echo 'Install the Bit.Boilerplate project template https://www.nuget.org/packages/Boilerplate.Templates';",
-            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-02;")
+            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-03;")
         ];
 
         if (enableVirtualization)
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
index 00eb62e4f4..cb43227fa3 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index 3daeb9809c..f5bd9a306e 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -12,12 +12,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Platform.Shared\Bit.Websites.Platform.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Platform.Client\Bit.Websites.Platform.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index 92075e34ea..a7823441a9 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Directory.Build.props b/src/Websites/Platform/src/Directory.Build.props
index 033867b035..af83dcad0e 100644
--- a/src/Websites/Platform/src/Directory.Build.props
+++ b/src/Websites/Platform/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
 <Project>
     <PropertyGroup>
         <LangVersion>preview</LangVersion>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index cf17313303..ec3921c9a1 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
index cdb86cba9f..39521a90fb 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-02
+// bit version: 10.4.3-pre-03
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index 2efe92c66f..4d3a86f8be 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Sales.Shared\Bit.Websites.Sales.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Sales.Client\Bit.Websites.Sales.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-02" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index 92075e34ea..a7823441a9 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-02">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Directory.Build.props b/src/Websites/Sales/src/Directory.Build.props
index f765a3910a..52c53d2ceb 100644
--- a/src/Websites/Sales/src/Directory.Build.props
+++ b/src/Websites/Sales/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-02 -->
+<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>

From 9a73e7eac47bb6e886c346aaae8439f14ca2c6a8 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Fri, 20 Mar 2026 15:18:57 +0330
Subject: [PATCH 59/66] feat(blazorui): add missing new Icon parameters to
 BitDateRangePicker #12197 (#12198)

---
 .../DateRangePicker/BitDateRangePicker.razor  |  90 +-
 .../BitDateRangePicker.razor.cs               | 279 +++++-
 .../DateRangePicker/BitDateRangePicker.scss   |  58 +-
 .../BitDateRangePickerDemo.razor              |  46 +
 .../BitDateRangePickerDemo.razor.cs           | 372 +++++++-
 .../BitDateRangePickerDemo.razor.samples.cs   |  40 +-
 .../BitDateRangePickerTests.cs                | 872 ++++++++++++++++++
 7 files changed, 1634 insertions(+), 123 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
index 73d3eb54bb..876077bd6c 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor
@@ -1,6 +1,28 @@
 @namespace Bit.BlazorUI
 @inherits BitInputBase<BitDateRangePickerValue?>
 
+@{
+    var clearBtnIconCss = BitIconInfo.From(ClearButtonIcon, ClearButtonIconName ?? "Cancel")?.GetCssClasses();
+    var closeButtonIconCss = BitIconInfo.From(CloseButtonIcon, CloseButtonIconName ?? "Cancel")?.GetCssClasses();
+    var prevMonthNavIconCss = BitIconInfo.From(PrevMonthNavIcon, PrevMonthNavIconName ?? "Up")?.GetCssClasses();
+    var nextMonthNavIconCss = BitIconInfo.From(NextMonthNavIcon, NextMonthNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var goToTodayIconCss = BitIconInfo.From(GoToTodayIcon, GoToTodayIconName ?? "GotoToday")?.GetCssClasses();
+    var showTimePickerIconCss = BitIconInfo.From(ShowTimePickerIcon, ShowTimePickerIconName ?? "Clock")?.GetCssClasses();
+    var prevYearNavIconCss = BitIconInfo.From(PrevYearNavIcon, PrevYearNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearNavIconCss = BitIconInfo.From(NextYearNavIcon, NextYearNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var prevYearRangeNavIconCss = BitIconInfo.From(PrevYearRangeNavIcon, PrevYearRangeNavIconName ?? "Up")?.GetCssClasses();
+    var nextYearRangeNavIconCss = BitIconInfo.From(NextYearRangeNavIcon, NextYearRangeNavIconName ?? "Up bit-ico-r180")?.GetCssClasses();
+    var hideTimePickerIconCss = BitIconInfo.From(HideTimePickerIcon, HideTimePickerIconName ?? "CalendarMirrored")?.GetCssClasses();
+    var startIncreaseHourIconCss = BitIconInfo.From(StartTimeIncreaseHourIcon, StartTimeIncreaseHourIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var startDecreaseHourIconCss = BitIconInfo.From(StartTimeDecreaseHourIcon, StartTimeDecreaseHourIconName ?? "ChevronDownSmall")?.GetCssClasses();
+    var startIncreaseMinuteIconCss = BitIconInfo.From(StartTimeIncreaseMinuteIcon, StartTimeIncreaseMinuteIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var startDecreaseMinuteIconCss = BitIconInfo.From(StartTimeDecreaseMinuteIcon, StartTimeDecreaseMinuteIconName ?? "ChevronDownSmall")?.GetCssClasses();
+    var endIncreaseHourIconCss = BitIconInfo.From(EndTimeIncreaseHourIcon, EndTimeIncreaseHourIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var endDecreaseHourIconCss = BitIconInfo.From(EndTimeDecreaseHourIcon, EndTimeDecreaseHourIconName ?? "ChevronDownSmall")?.GetCssClasses();
+    var endIncreaseMinuteIconCss = BitIconInfo.From(EndTimeIncreaseMinuteIcon, EndTimeIncreaseMinuteIconName ?? "ChevronDownSmall bit-ico-r180")?.GetCssClasses();
+    var endDecreaseMinuteIconCss = BitIconInfo.From(EndTimeDecreaseMinuteIcon, EndTimeDecreaseMinuteIconName ?? "ChevronDownSmall")?.GetCssClasses();
+}
+
 <div @ref="RootElement" @attributes="HtmlAttributes"
      id="@_Id"
      style="@StyleBuilder.Value"
@@ -55,7 +77,9 @@
                             type="button"
                             aria-hidden="true"
                             aria-label="Clear date">
-                        <i style="@Styles?.ClearButtonIcon" class="bit-icon bit-icon--Cancel @Classes?.ClearButtonIcon" aria-hidden="true" />
+                        <i aria-hidden="true"
+                           style="@Styles?.ClearButtonIcon"
+                           class="bit-dtrp-cic @clearBtnIconCss @Classes?.ClearButtonIcon" />
                     </button>
                 }
 
@@ -66,7 +90,9 @@
                 else
                 {
                     var icon = BitIconInfo.From(Icon, IconName ?? "CalendarMirrored");
-                    <i style="@Styles?.Icon" class="bit-dtrp-ico @icon?.GetCssClasses() @Classes?.Icon" aria-hidden="true" />
+                    <i aria-hidden="true"
+                       style="@Styles?.Icon"
+                       class="bit-dtrp-ico @icon?.GetCssClasses() @Classes?.Icon" />
                 }
             </div>
         </div>
@@ -147,7 +173,7 @@
                                         class="bit-dtrp-nbt @Classes?.PrevMonthNavButton">
                                     <i aria-hidden="true"
                                        style="@Styles?.PrevMonthNavIcon"
-                                       class="bit-icon bit-icon--Up @Classes?.PrevMonthNavIcon" />
+                                       class="bit-dtrp-cic @prevMonthNavIconCss @Classes?.PrevMonthNavIcon" />
                                 </button>
                                 @if (ShowGoToToday && (_showMonthPickerAsOverlayInternal || (ShowTimePicker && _showTimePickerAsOverlayInternal is false)))
                                 {
@@ -162,7 +188,7 @@
                                             class="bit-dtrp-gtb @Classes?.GoToTodayButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.GoToTodayIcon"
-                                           class="bit-dtrp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                           class="bit-dtrp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                     </button>
                                 }
                                 <button @onclick="() => HandleMonthChange(true)"
@@ -174,7 +200,7 @@
                                         class="bit-dtrp-nbt @Classes?.NextMonthNavButton">
                                     <i aria-hidden="true"
                                        style="@Styles?.NextMonthNavIcon"
-                                       class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextMonthNavIcon" />
+                                       class="bit-dtrp-cic @nextMonthNavIconCss @Classes?.NextMonthNavIcon" />
                                 </button>
                                 @if (ShowCloseButton && Standalone is false)
                                 {
@@ -186,7 +212,7 @@
                                             aria-label="@CloseButtonTitle">
                                         <i aria-hidden="true"
                                            style="@Styles?.CloseButtonIcon"
-                                           class="bit-icon bit-icon--Cancel @Classes?.CloseButtonIcon" />
+                                           class="bit-dtrp-cic @closeButtonIconCss @Classes?.CloseButtonIcon" />
                                     </button>
                                 }
                                 @if (_showMonthPickerAsOverlayInternal && _showTimePickerAsOverlayInternal && ShowTimePicker)
@@ -204,7 +230,7 @@
                                             class="bit-dtrp-nbt @Classes?.ShowTimePickerButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.ShowTimePickerIcon"
-                                           class="bit-dtrp-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                           class="bit-dtrp-cic @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                                     </button>
                                 }
                             </div>
@@ -318,7 +344,7 @@
                                             class="bit-dtrp-nbt @Classes?.PrevYearNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.PrevYearNavIcon"
-                                           class="bit-icon bit-icon--Up @Classes?.PrevYearNavIcon" />
+                                           class="bit-dtrp-cic @prevYearNavIconCss @Classes?.PrevYearNavIcon" />
                                     </button>
                                     @if (ShowGoToToday)
                                     {
@@ -334,7 +360,7 @@
                                                 class="bit-dtrp-gtb @Classes?.GoToTodayButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.GoToTodayIcon"
-                                               class="bit-dtrp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                               class="bit-dtrp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                         </button>
                                     }
                                     <button @onclick="() => HandleYearChange(true)"
@@ -347,7 +373,7 @@
                                             class="bit-dtrp-nbt @Classes?.NextYearNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.NextYearNavIcon"
-                                           class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearNavIcon" />
+                                           class="bit-dtrp-cic @nextYearNavIconCss @Classes?.NextYearNavIcon" />
                                     </button>
                                     @if (_showTimePickerAsOverlayInternal && ShowTimePicker)
                                     {
@@ -364,7 +390,7 @@
                                                 class="bit-dtrp-nbt @Classes?.ShowTimePickerButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.ShowTimePickerIcon"
-                                               class="bit-dtrp-gti bit-icon bit-icon--Clock @Classes?.ShowTimePickerIcon" />
+                                               class="bit-dtrp-cic @showTimePickerIconCss @Classes?.ShowTimePickerIcon" />
                                         </button>
                                     }
                                 </div>
@@ -436,7 +462,7 @@
                                             class="bit-dtrp-nbt @Classes?.PrevYearRangeNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.PrevYearRangeNavIcon"
-                                           class="bit-icon bit-icon--Up @Classes?.PrevYearRangeNavIcon" />
+                                           class="bit-dtrp-cic @prevYearRangeNavIconCss @Classes?.PrevYearRangeNavIcon" />
                                     </button>
                                     @if (ShowGoToToday)
                                     {
@@ -452,7 +478,7 @@
                                                 class="bit-dtrp-gtb @Classes?.GoToTodayButton">
                                             <i aria-hidden="true"
                                                style="@Styles?.GoToTodayIcon"
-                                               class="bit-dtrp-gti bit-icon bit-icon--GotoToday @Classes?.GoToTodayIcon" />
+                                               class="bit-dtrp-cic @goToTodayIconCss @Classes?.GoToTodayIcon" />
                                         </button>
                                     }
                                     <button @onclick="() => HandleYearRangeChange(true)"
@@ -465,7 +491,7 @@
                                             class="bit-dtrp-nbt @Classes?.NextYearRangeNavButton">
                                         <i aria-hidden="true"
                                            style="@Styles?.NextYearRangeNavIcon"
-                                           class="bit-icon bit-icon--Up bit-ico-r180 @Classes?.NextYearRangeNavIcon" />
+                                           class="bit-dtrp-cic @nextYearRangeNavIconCss @Classes?.NextYearRangeNavIcon" />
                                     </button>
                                 </div>
                             </div>
@@ -534,7 +560,9 @@
                                             aria-disabled="@(IsEnabled is false)"
                                             style="@Styles?.HideTimePickerButton"
                                             class="bit-dtrp-nbt @Classes?.HideTimePickerButton">
-                                        <i style="@Styles?.HideTimePickerIcon" class="bit-icon bit-icon--CalendarMirrored @Classes?.HideTimePickerIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.HideTimePickerIcon"
+                                           class="bit-dtrp-cic @hideTimePickerIconCss @Classes?.HideTimePickerIcon" />
                                     </button>
                                 }
                             </div>
@@ -550,7 +578,9 @@
                                             class="bit-dtrp-tbt @Classes?.StartTimeIncreaseHourButton"
                                             disabled="@startTimeIncreaseHourDisabled"
                                             aria-disabled="@startTimeIncreaseHourDisabled">
-                                        <i style="@Styles?.StartTimeIncreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.StartTimeIncreaseHourIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.StartTimeIncreaseHourIcon"
+                                           class="bit-dtrp-cic @startIncreaseHourIconCss @Classes?.StartTimeIncreaseHourIcon" />
                                     </button>
                                     <input @ref="_startTimeHourInputRef"
                                            @bind="@_startTimeHourView"
@@ -574,7 +604,9 @@
                                             class="bit-dtrp-tbt @Classes?.StartTimeDecreaseHourButton"
                                             disabled="@startTimeDecreaseHourDisabled"
                                             aria-disabled="@startTimeDecreaseHourDisabled">
-                                        <i style="@Styles?.StartTimeDecreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.StartTimeDecreaseHourIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.StartTimeDecreaseHourIcon"
+                                           class="bit-dtrp-cic @startDecreaseHourIconCss @Classes?.StartTimeDecreaseHourIcon" />
                                     </button>
                                 </div>
                                 <div style="@Styles?.StartTimeHourMinuteSeparator" class="bit-dtrp-tpr bit-dtrp-tdv @Classes?.StartTimeHourMinuteSeparator">:</div>
@@ -587,7 +619,9 @@
                                             class="bit-dtrp-tbt @Classes?.StartTimeIncreaseMinuteButton"
                                             disabled="@startTimeIncreaseMinuteDisabled"
                                             aria-disabled="@startTimeIncreaseMinuteDisabled">
-                                        <i style="@Styles?.StartTimeIncreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.StartTimeIncreaseMinuteIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.StartTimeIncreaseMinuteIcon"
+                                           class="bit-dtrp-cic @startIncreaseMinuteIconCss @Classes?.StartTimeIncreaseMinuteIcon" />
                                     </button>
                                     <input @ref="_startTimeMinuteInputRef"
                                            @bind="@_startTimeMinuteView"
@@ -611,7 +645,9 @@
                                             class="bit-dtrp-tbt @Classes?.StartTimeDecreaseMinuteButton"
                                             disabled="@startTimeDecreaseMinuteDisabled"
                                             aria-disabled="@startTimeDecreaseMinuteDisabled">
-                                        <i style="@Styles?.StartTimeDecreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.StartTimeDecreaseMinuteIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.StartTimeDecreaseMinuteIcon"
+                                           class="bit-dtrp-cic @startDecreaseMinuteIconCss @Classes?.StartTimeDecreaseMinuteIcon" />
                                     </button>
                                 </div>
 
@@ -653,7 +689,9 @@
                                             class="bit-dtrp-tbt @Classes?.EndTimeIncreaseHourButton"
                                             disabled="@endTimeIncreaseHourDisabled"
                                             aria-disabled="@endTimeIncreaseHourDisabled">
-                                        <i style="@Styles?.EndTimeIncreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.EndTimeIncreaseHourIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.EndTimeIncreaseHourIcon"
+                                           class="bit-dtrp-cic @endIncreaseHourIconCss @Classes?.EndTimeIncreaseHourIcon" />
                                     </button>
                                     <input @ref="_endTimeHourInputRef"
                                            @bind="@_endTimeHourView"
@@ -677,7 +715,9 @@
                                             class="bit-dtrp-tbt @Classes?.EndTimeDecreaseHourButton"
                                             disabled="@endTimeDecreaseHourDisabled"
                                             aria-disabled="@endTimeDecreaseHourDisabled">
-                                        <i style="@Styles?.EndTimeDecreaseHourIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.EndTimeDecreaseHourIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.EndTimeDecreaseHourIcon"
+                                           class="bit-dtrp-cic @endDecreaseHourIconCss @Classes?.EndTimeDecreaseHourIcon" />
                                     </button>
                                 </div>
                                 <div style="@Styles?.EndTimeHourMinuteSeparator" class="bit-dtrp-tpr bit-dtrp-tdv @Classes?.EndTimeHourMinuteSeparator">:</div>
@@ -690,7 +730,9 @@
                                             class="bit-dtrp-tbt @Classes?.EndTimeIncreaseMinuteButton"
                                             disabled="@endTimeIncreaseMinuteDisabled"
                                             aria-disabled="@endTimeIncreaseMinuteDisabled">
-                                        <i style="@Styles?.EndTimeIncreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall bit-ico-r180 @Classes?.EndTimeIncreaseMinuteIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.EndTimeIncreaseMinuteIcon"
+                                           class="bit-dtrp-cic @endIncreaseMinuteIconCss @Classes?.EndTimeIncreaseMinuteIcon" />
                                     </button>
                                     <input @ref="_endTimeMinuteInputRef"
                                            @bind="@_endTimeMinuteView"
@@ -714,7 +756,9 @@
                                             class="bit-dtrp-tbt @Classes?.EndTimeDecreaseMinuteButton"
                                             disabled="@endTimeDecreaseMinuteDisabled"
                                             aria-disabled="@endTimeDecreaseMinuteDisabled">
-                                        <i style="@Styles?.EndTimeDecreaseMinuteIcon" class="bit-icon bit-icon--ChevronDownSmall @Classes?.EndTimeDecreaseMinuteIcon" aria-hidden="true" />
+                                        <i aria-hidden="true"
+                                           style="@Styles?.EndTimeDecreaseMinuteIcon"
+                                           class="bit-dtrp-cic @endDecreaseMinuteIconCss @Classes?.EndTimeDecreaseMinuteIcon" />
                                     </button>
                                 </div>
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
index e0b2870f4b..362cc455fc 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.razor.cs
@@ -1,4 +1,4 @@
-using System.Text;
+using System.Text;
 using System.Globalization;
 using System.Diagnostics.CodeAnalysis;
 
@@ -201,6 +201,28 @@ private int _endTimeMinuteView
     /// </summary>
     [Parameter] public BitDateRangePickerClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The icon to display inside the clear button.
+    /// Takes precedence over <see cref="ClearButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? ClearButtonIcon { get; set; }
+
+    /// <summary>
+    /// The name of the clear button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? ClearButtonIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the close button.
+    /// Takes precedence over <see cref="CloseButtonIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? CloseButtonIcon { get; set; }
+
+    /// <summary>
+    /// The name of the close button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? CloseButtonIconName { get; set; }
+
     /// <summary>
     /// The title of the close button (tooltip).
     /// </summary>
@@ -253,15 +275,32 @@ private int _endTimeMinuteView
     /// </summary>
     [Parameter] public string GoToPrevYearTitle { get; set; } = "Go to previous year {0}";
 
+    /// <summary>
+    /// The icon to display inside the GoToToday button.
+    /// Takes precedence over <see cref="GoToTodayIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? GoToTodayIcon { get; set; }
+
+    /// <summary>
+    /// The name of the GoToToday button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? GoToTodayIconName { get; set; }
+
     /// <summary>
     /// The title of the GoToToday button (tooltip).
     /// </summary>
     [Parameter] public string GoToTodayTitle { get; set; } = "Go to today";
 
     /// <summary>
-    /// The title of the ShowTimePicker button (tooltip).
+    /// The icon to display inside the HideTimePicker button.
+    /// Takes precedence over <see cref="HideTimePickerIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
+    [Parameter] public BitIconInfo? HideTimePickerIcon { get; set; }
+
+    /// <summary>
+    /// The name of the HideTimePicker button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? HideTimePickerIconName { get; set; }
 
     /// <summary>
     /// The title of the HideTimePicker button (tooltip).
@@ -373,6 +412,39 @@ private int _endTimeMinuteView
     /// </summary>
     [Parameter] public string MonthPickerToggleTitle { get; set; } = "{0}, change month";
 
+    /// <summary>
+    /// The icon to display inside the next-month navigation button.
+    /// Takes precedence over <see cref="NextMonthNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-month navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the next-year navigation button.
+    /// Takes precedence over <see cref="NextYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-year navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextYearNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the next-year-range navigation button.
+    /// Takes precedence over <see cref="NextYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? NextYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the next-year-range navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? NextYearRangeNavIconName { get; set; }
+
     /// <summary>
     /// The callback for clicking on the DateRangePicker's input.
     /// </summary>
@@ -398,6 +470,39 @@ private int _endTimeMinuteView
     /// </summary>
     [Parameter] public string Placeholder { get; set; } = string.Empty;
 
+    /// <summary>
+    /// The icon to display inside the previous-month navigation button.
+    /// Takes precedence over <see cref="PrevMonthNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevMonthNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-month navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevMonthNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the previous-year navigation button.
+    /// Takes precedence over <see cref="PrevYearNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-year navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevYearNavIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the previous-year-range navigation button.
+    /// Takes precedence over <see cref="PrevYearRangeNavIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? PrevYearRangeNavIcon { get; set; }
+
+    /// <summary>
+    /// The name of the previous-year-range navigation button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? PrevYearRangeNavIconName { get; set; }
+
     /// <summary>
     /// Enables the responsive mode in small screens.
     /// </summary>
@@ -427,65 +532,119 @@ private int _endTimeMinuteView
     [CallOnSet(nameof(OnSetParameters))]
     public bool ShowTimePicker { get; set; }
 
+    /// <summary>
+    /// The icon to display inside the ShowTimePicker button.
+    /// Takes precedence over <see cref="ShowTimePickerIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? ShowTimePickerIcon { get; set; }
+
+    /// <summary>
+    /// The name of the ShowTimePicker button's icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? ShowTimePickerIconName { get; set; }
+
+    /// <summary>
+    /// The title of the ShowTimePicker button (tooltip).
+    /// </summary>
+    [Parameter] public string ShowTimePickerTitle { get; set; } = "Show time picker";
+
     /// <summary>
     /// Whether the week number (weeks 1 to 53) should be shown before each week row.
     /// </summary>
     [Parameter] public bool ShowWeekNumbers { get; set; }
 
     /// <summary>
-    /// Custom CSS styles for different parts of the BitDateRangePicker component.
+    /// The icon to display inside the start time-picker's decrease-hour button.
+    /// Takes precedence over <see cref="StartTimeDecreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public BitDateRangePickerClassStyles? Styles { get; set; }
+    [Parameter] public BitIconInfo? StartTimeDecreaseHourIcon { get; set; }
 
     /// <summary>
-    /// Time format of the time-pickers, 24H or 12H.
+    /// The name of the start time-picker's decrease-hour button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public BitTimeFormat TimeFormat { get; set; }
+    [Parameter] public string? StartTimeDecreaseHourIconName { get; set; }
 
     /// <summary>
-    /// TimeZone for the DateRangePicker.
+    /// The icon to display inside the start time-picker's decrease-minute button.
+    /// Takes precedence over <see cref="StartTimeDecreaseMinuteIconName"/> when both are set.
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public TimeZoneInfo? TimeZone { get; set; }
+    [Parameter] public BitIconInfo? StartTimeDecreaseMinuteIcon { get; set; }
 
     /// <summary>
-    /// Whether or not the Text field of the DateRangePicker is underlined.
+    /// The name of the start time-picker's decrease-minute button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter, ResetClassBuilder]
-    public bool Underlined { get; set; }
+    [Parameter] public string? StartTimeDecreaseMinuteIconName { get; set; }
 
     /// <summary>
-    /// The string format used to show the DateRangePicker's value in its input.
+    /// The icon to display inside the start time-picker's increase-hour button.
+    /// Takes precedence over <see cref="StartTimeIncreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string ValueFormat { get; set; } = "Start: {0} - End: {1}";
+    [Parameter] public BitIconInfo? StartTimeIncreaseHourIcon { get; set; }
 
     /// <summary>
-    /// The title of the week number (tooltip).
+    /// The name of the start time-picker's increase-hour button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
+    [Parameter] public string? StartTimeIncreaseHourIconName { get; set; }
 
     /// <summary>
-    /// Custom template to render the year cells of the DateRangePicker.
+    /// The icon to display inside the start time-picker's increase-minute button.
+    /// Takes precedence over <see cref="StartTimeIncreaseMinuteIconName"/> when both are set.
     /// </summary>
-    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
+    [Parameter] public BitIconInfo? StartTimeIncreaseMinuteIcon { get; set; }
 
     /// <summary>
-    /// The title of the year picker's toggle (tooltip).
+    /// The name of the start time-picker's increase-minute button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
+    [Parameter] public string? StartTimeIncreaseMinuteIconName { get; set; }
 
     /// <summary>
-    /// The title of the year range picker's toggle (tooltip).
+    /// The icon to display inside the end time-picker's decrease-hour button.
+    /// Takes precedence over <see cref="EndTimeDecreaseHourIconName"/> when both are set.
     /// </summary>
-    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
+    [Parameter] public BitIconInfo? EndTimeDecreaseHourIcon { get; set; }
 
     /// <summary>
-    /// Show month picker on top of date range picker when visible.
+    /// The name of the end time-picker's decrease-hour button icon from the built-in Fluent UI icon set.
     /// </summary>
-    [Parameter]
-    [CallOnSet(nameof(OnSetParameters))]
-    public bool ShowTimePickerAsOverlay { get; set; }
+    [Parameter] public string? EndTimeDecreaseHourIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the end time-picker's decrease-minute button.
+    /// Takes precedence over <see cref="EndTimeDecreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? EndTimeDecreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// The name of the end time-picker's decrease-minute button icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? EndTimeDecreaseMinuteIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the end time-picker's increase-hour button.
+    /// Takes precedence over <see cref="EndTimeIncreaseHourIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? EndTimeIncreaseHourIcon { get; set; }
+
+    /// <summary>
+    /// The name of the end time-picker's increase-hour button icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? EndTimeIncreaseHourIconName { get; set; }
+
+    /// <summary>
+    /// The icon to display inside the end time-picker's increase-minute button.
+    /// Takes precedence over <see cref="EndTimeIncreaseMinuteIconName"/> when both are set.
+    /// </summary>
+    [Parameter] public BitIconInfo? EndTimeIncreaseMinuteIcon { get; set; }
+
+    /// <summary>
+    /// The name of the end time-picker's increase-minute button icon from the built-in Fluent UI icon set.
+    /// </summary>
+    [Parameter] public string? EndTimeIncreaseMinuteIconName { get; set; }
+
+    /// <summary>
+    /// Determines increment/decrement steps for DateRangePicker's hour.
+    /// </summary>
+    [Parameter] public int HourStep { get; set; } = 1;
 
     /// <summary>
     /// The maximum range of day and times allowed for selection in DateRangePicker.
@@ -498,14 +657,18 @@ private int _endTimeMinuteView
     [Parameter] public bool ShowClearButton { get; set; }
 
     /// <summary>
-    /// Determines increment/decrement steps for DateRangePicker's hour.
+    /// Show the time picker as an overlay on top of the date range picker when visible.
     /// </summary>
-    [Parameter] public int HourStep { get; set; } = 1;
+    [Parameter]
+    [CallOnSet(nameof(OnSetParameters))]
+    public bool ShowTimePickerAsOverlay { get; set; }
 
     /// <summary>
-    /// Determines increment/decrement steps for DateRangePicker's minute.
+    /// Whether the DateRangePicker is rendered standalone or with the input component and callout.
     /// </summary>
-    [Parameter] public int MinuteStep { get; set; } = 1;
+    [Parameter, ResetClassBuilder]
+    [CallOnSet(nameof(OnSetParameters))]
+    public bool Standalone { get; set; }
 
     /// <summary>
     /// Specifies the date and time of the date and time picker when it is opened without any selected value.
@@ -515,11 +678,57 @@ private int _endTimeMinuteView
     public BitDateRangePickerValue? StartingValue { get; set; }
 
     /// <summary>
-    /// Whether the DateRangePicker is rendered standalone or with the input component and callout.
+    /// Custom CSS styles for different parts of the BitDateRangePicker component.
     /// </summary>
-    [Parameter, ResetClassBuilder]
+    [Parameter] public BitDateRangePickerClassStyles? Styles { get; set; }
+
+    /// <summary>
+    /// Time format of the time-pickers, 24H or 12H.
+    /// </summary>
+    [Parameter] public BitTimeFormat TimeFormat { get; set; }
+
+    /// <summary>
+    /// TimeZone for the DateRangePicker.
+    /// </summary>
+    [Parameter]
     [CallOnSet(nameof(OnSetParameters))]
-    public bool Standalone { get; set; }
+    public TimeZoneInfo? TimeZone { get; set; }
+
+    /// <summary>
+    /// Whether or not the Text field of the DateRangePicker is underlined.
+    /// </summary>
+    [Parameter, ResetClassBuilder]
+    public bool Underlined { get; set; }
+
+    /// <summary>
+    /// The string format used to show the DateRangePicker's value in its input.
+    /// </summary>
+    [Parameter] public string ValueFormat { get; set; } = "Start: {0} - End: {1}";
+
+    /// <summary>
+    /// The title of the week number (tooltip).
+    /// </summary>
+    [Parameter] public string WeekNumberTitle { get; set; } = "Week number {0}";
+
+    /// <summary>
+    /// Custom template to render the year cells of the DateRangePicker.
+    /// </summary>
+    [Parameter] public RenderFragment<int>? YearCellTemplate { get; set; }
+
+    /// <summary>
+    /// The title of the year picker's toggle (tooltip).
+    /// </summary>
+    [Parameter] public string YearPickerToggleTitle { get; set; } = "{0}, change year";
+
+    /// <summary>
+    /// The title of the year range picker's toggle (tooltip).
+    /// </summary>
+    [Parameter] public string YearRangePickerToggleTitle { get; set; } = "{0} - {1}, change month";
+
+    /// <summary>
+    /// Determines increment/decrement steps for DateRangePicker's minute.
+    /// </summary>
+    [Parameter] public int MinuteStep { get; set; } = 1;
 
 
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss
index b86aef62ed..616c5d84dd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/DateRangePicker/BitDateRangePicker.scss
@@ -1,4 +1,4 @@
-@import "../../../Styles/functions.scss";
+@import "../../../Styles/functions.scss";
 @import "../../../Styles/media-queries.scss";
 
 .bit-dtrp {
@@ -18,8 +18,8 @@
 
         .bit-dtrp-icn {
             cursor: default;
-            pointer-events: none;
             color: $clr-fg-dis;
+            pointer-events: none;
             background: none $clr-bg-dis;
             border: $shp-border-width $shp-border-style $clr-brd-dis;
         }
@@ -88,8 +88,8 @@
     flex-flow: row nowrap;
     padding: 0 spacing(1);
     box-sizing: border-box;
-    border-radius: $shp-border-radius;
     background-color: $clr-bg-pri;
+    border-radius: $shp-border-radius;
     border: $shp-border-width $shp-border-style $clr-brd-pri;
 }
 
@@ -101,20 +101,20 @@
 
 .bit-dtrp-clr {
     display: flex;
+    cursor: pointer;
+    align-items: center;
     width: spacing(3.75);
     height: spacing(3.75);
     justify-content: center;
-    align-items: center;
     background-color: $clr-bg-sec;
-    cursor: pointer;
 
     i {
         speak: none;
         width: unset;
+        color: $clr-fg-sec;
         pointer-events: none;
         display: inline-block;
         font-size: spacing(1.5);
-        color: $clr-fg-sec;
     }
 
     @media (hover: hover) {
@@ -136,11 +136,11 @@
     box-shadow: none;
     font-weight: 400;
     border-radius: 0;
+    color: $clr-fg-pri;
     box-sizing: border-box;
     text-overflow: ellipsis;
     font-size: spacing(1.75);
     background: none transparent;
-    color: $clr-fg-pri;
     font-family: $tg-font-family;
 }
 
@@ -269,6 +269,7 @@
     display: flex;
     cursor: pointer;
     overflow: visible;
+    color: $clr-fg-pri;
     position: relative;
     width: spacing(3.5);
     align-items: center;
@@ -280,7 +281,6 @@
     line-height: spacing(3);
     justify-content: center;
     background-color: transparent;
-    color: $clr-fg-pri;
     border-radius: $shp-border-radius;
 
     @media (hover: hover) {
@@ -294,9 +294,9 @@
     }
 
     &:disabled {
+        color: $clr-fg-dis;
         pointer-events: none;
         background-color: transparent;
-        color: $clr-fg-dis;
     }
 }
 
@@ -324,9 +324,9 @@
 
 .bit-dtrp-dss {
     color: $clr-pri-text;
-    background-color: $clr-pri;
     border-end-end-radius: 0;
     border-start-end-radius: 0;
+    background-color: $clr-pri;
     border-end-start-radius: spacing(1);
     border-start-start-radius: spacing(1);
 
@@ -340,10 +340,10 @@
 .bit-dtrp-dse {
     color: $clr-pri-text;
     background-color: $clr-pri;
-    border-end-end-radius: spacing(1);
-    border-start-end-radius: spacing(1);
     border-end-start-radius: 0;
     border-start-start-radius: 0;
+    border-end-end-radius: spacing(1);
+    border-start-end-radius: spacing(1);
 
     @media (hover: hover) {
         &:hover {
@@ -371,6 +371,7 @@
 .bit-dtrp-wnm {
     display: flex;
     font-weight: 400;
+    color: $clr-fg-sec;
     width: spacing(3.5);
     align-items: center;
     height: spacing(3.5);
@@ -378,7 +379,6 @@
     font-size: spacing(1.5);
     justify-content: center;
     padding: spacing(0.375) 0 0 0;
-    color: $clr-fg-sec;
     background-color: $clr-bg-sec;
     border-inline-end: $shp-border-width $shp-border-style $clr-brd-sec;
 }
@@ -433,7 +433,7 @@
         pointer-events: none;
         background-color: transparent;
 
-        .bit-dtrp-gti,
+        .bit-dtrp-cic,
         .bit-icon {
             color: $clr-fg-dis;
         }
@@ -453,6 +453,7 @@
     display: block;
     cursor: pointer;
     overflow: visible;
+    color: $clr-fg-pri;
     position: relative;
     text-align: center;
     width: spacing(3.5);
@@ -463,7 +464,6 @@
     min-height: spacing(3.5);
     line-height: spacing(3.5);
     background-color: transparent;
-    color: $clr-fg-pri;
     border-radius: $shp-border-radius;
 
     @media (hover: hover) {
@@ -476,7 +476,7 @@
         pointer-events: none;
         background-color: transparent;
 
-        .bit-dtrp-gti,
+        .bit-dtrp-cic,
         .bit-icon {
             color: $clr-fg-dis;
         }
@@ -487,17 +487,17 @@
     padding: 0;
     border: none;
     cursor: pointer;
+    aspect-ratio: 1;
     overflow: visible;
+    color: $clr-fg-pri;
     position: relative;
     text-align: center;
     width: spacing(3.75);
     outline: transparent;
-    line-height: spacing(3.75);
     font-size: spacing(1.5);
+    line-height: spacing(3.75);
     background-color: transparent;
-    color: $clr-fg-pri;
     border-radius: $shp-border-radius;
-    aspect-ratio: 1;
 
     @media (hover: hover) {
         &:hover {
@@ -519,9 +519,9 @@
     }
 
     &:disabled {
+        color: $clr-fg-dis;
         pointer-events: none;
         background-color: transparent;
-        color: $clr-fg-dis;
 
         i {
             color: $clr-fg-dis;
@@ -567,6 +567,7 @@
     cursor: pointer;
     overflow: hidden;
     width: spacing(6);
+    color: $clr-fg-pri;
     position: relative;
     white-space: nowrap;
     outline: transparent;
@@ -575,7 +576,6 @@
     line-height: spacing(5);
     text-overflow: ellipsis;
     background-color: transparent;
-    color: $clr-fg-pri;
     border-radius: $shp-border-radius;
 
     @media (hover: hover) {
@@ -585,9 +585,9 @@
     }
 
     &:disabled {
+        color: $clr-fg-dis;
         pointer-events: none;
         background-color: transparent;
-        color: $clr-fg-dis;
     }
 }
 
@@ -666,28 +666,28 @@
     padding: 0;
     border: none;
     cursor: pointer;
+    aspect-ratio: 1;
+    overflow: hidden;
     text-align: center;
     align-items: center;
     width: spacing(3.75);
     box-sizing: border-box;
     justify-content: center;
-    -moz-appearance: textfield; // Firefox
-    background-color: $clr-bg-pri;
     font-size: spacing(2.28);
+    -moz-appearance: textfield; // Firefox
     font-weight: $tg-font-weight;
-    overflow: hidden;
-    aspect-ratio: 1;
+    background-color: $clr-bg-pri;
 
     &::-webkit-inner-spin-button, // Chrome, Safari, Edge, Opera
     &::-webkit-outer-spin-button {
-        -webkit-appearance: none;
         margin: 0;
+        -webkit-appearance: none;
     }
 
     &:focus {
         border: none;
-        border-bottom: $shp-border-width $shp-border-style $clr-brd-pri-active;
         outline: none;
+        border-bottom: $shp-border-width $shp-border-style $clr-brd-pri-active;
     }
 
     &:disabled {
@@ -778,9 +778,9 @@
 }
 
 .bit-dtrp-sta {
-    width: fit-content;
     display: flex;
     flex-flow: column;
+    width: fit-content;
     align-items: flex-start;
 
     .bit-dtrp-cal {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
index b9e6b5cff6..c8f125e391 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor
@@ -281,6 +281,52 @@
             <br />
             <BitDateRangePicker Label="Bootstrap (Bi)" Icon="@BitIconInfo.Bi("calendar3")" />
         </div>
+
+        <br /><br /><br />
+
+        <div>Navigation &amp; ClearButton Icons (FontAwesome):</div>
+        <br />
+        <div class="example-content">
+            <BitDateRangePicker Label="Custom nav icons (FA)"
+                                PrevMonthNavIcon="@BitIconInfo.Fa("solid chevron-left")"
+                                NextMonthNavIcon="@BitIconInfo.Fa("solid chevron-right")"
+                                PrevYearNavIcon="@BitIconInfo.Fa("solid angles-left")"
+                                NextYearNavIcon="@BitIconInfo.Fa("solid angles-right")"
+                                PrevYearRangeNavIcon="@BitIconInfo.Fa("solid angles-left")"
+                                NextYearRangeNavIcon="@BitIconInfo.Fa("solid angles-right")"
+                                GoToTodayIcon="@BitIconInfo.Fa("solid calendar-day")" />
+            <br />
+            <BitDateRangePicker Label="TimePicker icons (FA)"
+                                ShowTimePicker
+                                ShowClearButton
+                                ShowTimePickerAsOverlay
+                                HideTimePickerIcon="@BitIconInfo.Fa("solid calendar")"
+                                ShowTimePickerIcon="@BitIconInfo.Fa("solid clock")"
+                                ClearButtonIcon="@BitIconInfo.Fa("solid xmark")"
+                                StartTimeIncreaseHourIcon="@BitIconInfo.Fa("solid chevron-up")"
+                                StartTimeDecreaseHourIcon="@BitIconInfo.Fa("solid chevron-down")"
+                                StartTimeIncreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-up")"
+                                StartTimeDecreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-down")"
+                                EndTimeIncreaseHourIcon="@BitIconInfo.Fa("solid chevron-up")"
+                                EndTimeDecreaseHourIcon="@BitIconInfo.Fa("solid chevron-down")"
+                                EndTimeIncreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-up")"
+                                EndTimeDecreaseMinuteIcon="@BitIconInfo.Fa("solid chevron-down")" />
+        </div>
+
+        <br /><br /><br />
+
+        <div>Navigation Icons (Bootstrap):</div>
+        <br />
+        <div class="example-content">
+            <BitDateRangePicker Label="Custom nav icons (Bootstrap)"
+                                PrevMonthNavIcon="@BitIconInfo.Bi("chevron-left")"
+                                NextMonthNavIcon="@BitIconInfo.Bi("chevron-right")"
+                                PrevYearNavIcon="@BitIconInfo.Bi("chevron-double-left")"
+                                NextYearNavIcon="@BitIconInfo.Bi("chevron-double-right")"
+                                PrevYearRangeNavIcon="@BitIconInfo.Bi("chevron-double-left")"
+                                NextYearRangeNavIcon="@BitIconInfo.Bi("chevron-double-right")"
+                                GoToTodayIcon="@BitIconInfo.Bi("calendar-event")" />
+        </div>
     </DemoExample>
 
     <DemoExample Title="Style & Class" RazorCode="@example13RazorCode" CsharpCode="@example13CsharpCode" Id="example13">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
index 6590f80daa..bea5299eac 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.cs
@@ -35,13 +35,45 @@ public partial class BitDateRangePickerDemo
         new()
         {
             Name = "Classes",
-            Type = "BitDateRangePickerClassStyles",
+            Type = "BitDateRangePickerClassStyles?",
             DefaultValue = "null",
             Description = "Custom CSS classes for different parts of the BitDateRangePicker.",
             Href = "#daterangepicker-class-styles",
             LinkType = LinkType.Link
         },
         new()
+        {
+            Name = "ClearButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the clear button. Takes precedence over ClearButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ClearButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the clear button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "CloseButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the close button. Takes precedence over CloseButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "CloseButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the close button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "CloseButtonTitle",
             Type = "string",
@@ -70,6 +102,70 @@ public partial class BitDateRangePickerDemo
             Description = "Custom template to render the day cells of the DateRangePicker."
         },
         new()
+        {
+            Name = "EndTimeDecreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the end time-picker's decrease-hour button. Takes precedence over EndTimeDecreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "EndTimeDecreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the end time-picker's decrease-hour button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "EndTimeDecreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the end time-picker's decrease-minute button. Takes precedence over EndTimeDecreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "EndTimeDecreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the end time-picker's decrease-minute button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "EndTimeIncreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the end time-picker's increase-hour button. Takes precedence over EndTimeIncreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "EndTimeIncreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the end time-picker's increase-hour button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "EndTimeIncreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the end time-picker's increase-minute button. Takes precedence over EndTimeIncreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "EndTimeIncreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the end time-picker's increase-minute button icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "GoToNextMonthTitle",
             Type = "string",
@@ -112,6 +208,22 @@ public partial class BitDateRangePickerDemo
             Description = "The title of the Go to previous year button (tooltip).",
         },
         new()
+        {
+            Name = "GoToTodayIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the GoToToday button. Takes precedence over GoToTodayIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "GoToTodayIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the GoToToday button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "GoToTodayTitle",
             Type = "string",
@@ -140,6 +252,22 @@ public partial class BitDateRangePickerDemo
             Description = "Whether the month picker should highlight the selected month."
         },
         new()
+        {
+            Name = "HideTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the HideTimePicker button. Takes precedence over HideTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "HideTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the HideTimePicker button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "HideTimePickerTitle",
             Type = "string",
@@ -148,10 +276,19 @@ public partial class BitDateRangePickerDemo
         },
         new()
         {
-            Name = "IconTemplate",
-            Type = "RenderFragment?",
+            Name = "HourStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for DateRangePicker's hour.",
+        },
+        new()
+        {
+            Name = "Icon",
+            Type = "BitIconInfo?",
             DefaultValue = "null",
-            Description = "Custom template for the DateRangePicker's icon."
+            Description = "The icon to display. Takes precedence over IconName when both are set. Use for external libraries (e.g. BitIconInfo.Fa(\"solid calendar\"), BitIconInfo.Bi(\"calendar3\"), BitIconInfo.Css(\"my-class\")).",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
         },
         new()
         {
@@ -163,15 +300,6 @@ public partial class BitDateRangePickerDemo
             Href = "#icon-location-enum",
         },
         new()
-        {
-            Name = "Icon",
-            Type = "BitIconInfo?",
-            DefaultValue = "null",
-            Description = "The icon to display. Takes precedence over IconName when both are set. Use for external libraries (e.g. BitIconInfo.Fa(\"solid calendar\"), BitIconInfo.Bi(\"calendar3\"), BitIconInfo.Css(\"my-class\")).",
-            LinkType = LinkType.Link,
-            Href = "#bit-icon-info",
-        },
-        new()
         {
             Name = "IconName",
             Type = "string?",
@@ -179,6 +307,13 @@ public partial class BitDateRangePickerDemo
             Description = "The name of the icon from the built-in Fluent UI icon set. For external icon libraries, use Icon instead."
         },
         new()
+        {
+            Name = "IconTemplate",
+            Type = "RenderFragment?",
+            DefaultValue = "null",
+            Description = "Custom template for the DateRangePicker's icon."
+        },
+        new()
         {
             Name = "InvalidErrorMessage",
             Type = "string?",
@@ -215,17 +350,17 @@ public partial class BitDateRangePickerDemo
         },
         new()
         {
-            Name = "MaxRange",
-            Type = "TimeSpan?",
+            Name = "MaxDate",
+            Type = "DateTimeOffset?",
             DefaultValue = "null",
-            Description = "The maximum range of day and times allowed for selection in DateRangePicker.",
+            Description = "The maximum date allowed for the DateRangePicker.",
         },
         new()
         {
-            Name = "MaxDate",
-            Type = "DateTimeOffset?",
+            Name = "MaxRange",
+            Type = "TimeSpan?",
             DefaultValue = "null",
-            Description = "The maximum date allowed for the DateRangePicker.",
+            Description = "The maximum range of day and times allowed for selection in DateRangePicker.",
         },
         new()
         {
@@ -235,6 +370,13 @@ public partial class BitDateRangePickerDemo
             Description = "The minimum date allowed for the DateRangePicker.",
         },
         new()
+        {
+            Name = "MinuteStep",
+            Type = "int",
+            DefaultValue = "1",
+            Description = "Determines increment/decrement steps for DateRangePicker's minute.",
+        },
+        new()
         {
             Name = "MonthCellTemplate",
             Type = "RenderFragment<DateTimeOffset>?",
@@ -249,6 +391,54 @@ public partial class BitDateRangePickerDemo
             Description = "The title of the month picker's toggle (tooltip)."
         },
         new()
+        {
+            Name = "NextMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-month navigation button. Takes precedence over NextMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-month navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "NextYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-year navigation button. Takes precedence over NextYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-year navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the next-year-range navigation button. Takes precedence over NextYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "NextYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the next-year-range navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "OnClick",
             Type = "EventCallback",
@@ -280,6 +470,54 @@ public partial class BitDateRangePickerDemo
             Description = "The placeholder text of the DateRangePicker's input.",
         },
         new()
+        {
+            Name = "PrevMonthNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-month navigation button. Takes precedence over PrevMonthNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevMonthNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-month navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "PrevYearNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-year navigation button. Takes precedence over PrevYearNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevYearNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-year navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the previous-year-range navigation button. Takes precedence over PrevYearRangeNavIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "PrevYearRangeNavIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the previous-year-range navigation button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "Responsive",
             Type = "bool",
@@ -329,6 +567,22 @@ public partial class BitDateRangePickerDemo
             Description = "Show month picker on top of date range picker when visible.",
         },
         new()
+        {
+            Name = "ShowTimePickerIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the ShowTimePicker button. Takes precedence over ShowTimePickerIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ShowTimePickerIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the ShowTimePicker button's icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "ShowTimePickerTitle",
             Type = "string",
@@ -357,9 +611,73 @@ public partial class BitDateRangePickerDemo
             Description = "Specifies the date and time of the date and time picker when it is opened without any selected value.",
         },
         new()
+        {
+            Name = "StartTimeDecreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the start time-picker's decrease-hour button. Takes precedence over StartTimeDecreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "StartTimeDecreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the start time-picker's decrease-hour button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "StartTimeDecreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the start time-picker's decrease-minute button. Takes precedence over StartTimeDecreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "StartTimeDecreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the start time-picker's decrease-minute button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "StartTimeIncreaseHourIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the start time-picker's increase-hour button. Takes precedence over StartTimeIncreaseHourIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "StartTimeIncreaseHourIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the start time-picker's increase-hour button icon from the built-in Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "StartTimeIncreaseMinuteIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon to display inside the start time-picker's increase-minute button. Takes precedence over StartTimeIncreaseMinuteIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "StartTimeIncreaseMinuteIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The name of the start time-picker's increase-minute button icon from the built-in Fluent UI icon set.",
+        },
+        new()
         {
             Name = "Styles",
-            Type = "BitDateRangePickerClassStyles",
+            Type = "BitDateRangePickerClassStyles?",
             DefaultValue = "null",
             Description = "Custom CSS styles for different parts of the BitDateRangePicker.",
             Href = "#daterangepicker-class-styles",
@@ -423,20 +741,6 @@ public partial class BitDateRangePickerDemo
             DefaultValue = "{0} - {1}, change month",
             Description = "The title of the year range picker's toggle (tooltip).",
         },
-        new()
-        {
-            Name = "HourStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for DateRangePicker's hour.",
-        },
-        new()
-        {
-            Name = "MinuteStep",
-            Type = "int",
-            DefaultValue = "1",
-            Description = "Determines increment/decrement steps for DateRangePicker's minute.",
-        }
     ];
 
     private readonly List<ComponentSubClass> componentSubClasses =
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
index 8e0d09e714..41e163a548 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/DateRangePicker/BitDateRangePickerDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DateRangePicker;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.DateRangePicker;
 
 public partial class BitDateRangePickerDemo
 {
@@ -164,7 +164,43 @@ public partial class BitDateRangePickerDemo
 
 <BitDateRangePicker Label=""Bootstrap (Css)"" Icon=""@BitIconInfo.Css(""bi bi-calendar-range"")"" />
 
-<BitDateRangePicker Label=""Bootstrap (Bi)"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />";
+<BitDateRangePicker Label=""Bootstrap (Bi)"" Icon=""@BitIconInfo.Bi(""calendar3"")"" />
+
+
+<BitDateRangePicker Label=""Custom nav icons (FA)""
+                   PrevMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-left"")""
+                   NextMonthNavIcon=""@BitIconInfo.Fa(""solid chevron-right"")""
+                   PrevYearNavIcon=""@BitIconInfo.Fa(""solid angles-left"")""
+                   NextYearNavIcon=""@BitIconInfo.Fa(""solid angles-right"")""
+                   PrevYearRangeNavIcon=""@BitIconInfo.Fa(""solid angles-left"")""
+                   NextYearRangeNavIcon=""@BitIconInfo.Fa(""solid angles-right"")""
+                   GoToTodayIcon=""@BitIconInfo.Fa(""solid calendar-day"")"" />
+
+<BitDateRangePicker Label=""TimePicker icons (FA)""
+                   ShowTimePicker
+                   ShowClearButton
+                   ShowTimePickerAsOverlay
+                   HideTimePickerIcon=""@BitIconInfo.Fa(""solid calendar"")""
+                   ShowTimePickerIcon=""@BitIconInfo.Fa(""solid clock"")""
+                   ClearButtonIcon=""@BitIconInfo.Fa(""solid xmark"")""
+                   StartTimeIncreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+                   StartTimeDecreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-down"")""
+                   StartTimeIncreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+                   StartTimeDecreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-down"")""
+                   EndTimeIncreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+                   EndTimeDecreaseHourIcon=""@BitIconInfo.Fa(""solid chevron-down"")""
+                   EndTimeIncreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-up"")""
+                   EndTimeDecreaseMinuteIcon=""@BitIconInfo.Fa(""solid chevron-down"")"" />
+
+
+<BitDateRangePicker Label=""Custom nav icons (Bootstrap)""
+                   PrevMonthNavIcon=""@BitIconInfo.Bi(""chevron-left"")""
+                   NextMonthNavIcon=""@BitIconInfo.Bi(""chevron-right"")""
+                   PrevYearNavIcon=""@BitIconInfo.Bi(""chevron-double-left"")""
+                   NextYearNavIcon=""@BitIconInfo.Bi(""chevron-double-right"")""
+                   PrevYearRangeNavIcon=""@BitIconInfo.Bi(""chevron-double-left"")""
+                   NextYearRangeNavIcon=""@BitIconInfo.Bi(""chevron-double-right"")""
+                   GoToTodayIcon=""@BitIconInfo.Bi(""calendar-event"")"" />";
 
     private readonly string example13RazorCode = @"
 <style>
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DateRangePicker/BitDateRangePickerTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DateRangePicker/BitDateRangePickerTests.cs
index e1a8818b11..a323634dc1 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DateRangePicker/BitDateRangePickerTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/DateRangePicker/BitDateRangePickerTests.cs
@@ -1,5 +1,6 @@
 using System;
 using System.Collections.Generic;
+using System.Linq;
 using Microsoft.VisualStudio.TestTools.UnitTesting;
 using Bunit;
 
@@ -266,4 +267,875 @@ public void BitDateRangePickerCalloutHtmlAttributesTest()
 
         Assert.AreEqual("color: blue", calloutStyle);
     }
+
+    [TestMethod,
+        DataRow("ChevronLeft", "bit-icon--ChevronLeft"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerPrevMonthNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { PrevMonthNavIcon = "prev-month-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevMonthNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".prev-month-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerPrevMonthNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-left"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { PrevMonthNavIcon = "prev-month-icon" });
+        });
+
+        var icon = component.Find(".prev-month-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-left"),
+            $"Expected 'fa-chevron-left' on PrevMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerNextMonthNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { NextMonthNavIcon = "next-month-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.NextMonthNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".next-month-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerNextMonthNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextMonthNavIcon, BitIconInfo.Css("fa-solid fa-chevron-right"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { NextMonthNavIcon = "next-month-icon" });
+        });
+
+        var icon = component.Find(".next-month-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-right"),
+            $"Expected 'fa-chevron-right' on NextMonthNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("CalendarDay", "bit-icon--CalendarDay"),
+        DataRow(null, "bit-icon--GotoToday")
+    ]
+    public void BitDateRangePickerGoToTodayIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowGoToToday, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { GoToTodayIcon = "goto-today-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.GoToTodayIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".goto-today-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerGoToTodayIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowGoToToday, true);
+            parameters.Add(p => p.GoToTodayIcon, BitIconInfo.Css("fa-solid fa-calendar-day"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { GoToTodayIcon = "goto-today-icon" });
+        });
+
+        var icon = component.Find(".goto-today-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-calendar-day"),
+            $"Expected 'fa-calendar-day' on GoToTodayIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("X", "bit-icon--X"),
+        DataRow(null, "bit-icon--Cancel")
+    ]
+    public void BitDateRangePickerCloseButtonIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowCloseButton, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { CloseButtonIcon = "close-btn-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.CloseButtonIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".close-btn-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerCloseButtonIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowCloseButton, true);
+            parameters.Add(p => p.CloseButtonIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { CloseButtonIcon = "close-btn-icon" });
+        });
+
+        var icon = component.Find(".close-btn-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-xmark"),
+            $"Expected 'fa-xmark' on CloseButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("XmarkCircle", "bit-icon--XmarkCircle"),
+        DataRow(null, "bit-icon--Cancel")
+    ]
+    public void BitDateRangePickerClearButtonIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowClearButton, true);
+            parameters.Add(p => p.Value, new BitDateRangePickerValue { StartDate = DateTimeOffset.Now });
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { ClearButtonIcon = "clear-btn-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ClearButtonIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".clear-btn-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerClearButtonIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowClearButton, true);
+            parameters.Add(p => p.Value, new BitDateRangePickerValue { StartDate = DateTimeOffset.Now });
+            parameters.Add(p => p.ClearButtonIcon, BitIconInfo.Css("fa-solid fa-xmark"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { ClearButtonIcon = "clear-btn-icon" });
+        });
+
+        var icon = component.Find(".clear-btn-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-xmark"),
+            $"Expected 'fa-xmark' on ClearButtonIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("CalendarMirroredSolid", "bit-icon--CalendarMirroredSolid"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerPrevYearNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { PrevYearNavIcon = "prev-year-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevYearNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".prev-year-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerPrevYearNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-left"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { PrevYearNavIcon = "prev-year-icon" });
+        });
+
+        var icon = component.Find(".prev-year-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-left"),
+            $"Expected 'fa-angles-left' on PrevYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerNextYearNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { NextYearNavIcon = "next-year-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.NextYearNavIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".next-year-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerNextYearNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextYearNavIcon, BitIconInfo.Css("fa-solid fa-angles-right"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { NextYearNavIcon = "next-year-icon" });
+        });
+
+        var icon = component.Find(".next-year-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-right"),
+            $"Expected 'fa-angles-right' on NextYearNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronLeft", "bit-icon--ChevronLeft"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerPrevYearRangeNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles
+            {
+                YearPickerToggleButton = "year-picker-toggle",
+                PrevYearRangeNavIcon = "prev-year-range-icon"
+            });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.PrevYearRangeNavIconName, iconName);
+            }
+        });
+
+        // Click the year picker toggle to navigate from year view to year-range view
+        component.Find(".year-picker-toggle").Click();
+
+        var icon = component.Find(".prev-year-range-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on PrevYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerPrevYearRangeNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.PrevYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-angles-left"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles
+            {
+                YearPickerToggleButton = "year-picker-toggle",
+                PrevYearRangeNavIcon = "prev-year-range-icon"
+            });
+        });
+
+        // Click the year picker toggle to navigate from year view to year-range view
+        component.Find(".year-picker-toggle").Click();
+
+        var icon = component.Find(".prev-year-range-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on PrevYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-left"),
+            $"Expected 'fa-angles-left' on PrevYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronRight", "bit-icon--ChevronRight"),
+        DataRow(null, "bit-icon--Up")
+    ]
+    public void BitDateRangePickerNextYearRangeNavIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles
+            {
+                YearPickerToggleButton = "year-picker-toggle",
+                NextYearRangeNavIcon = "next-year-range-icon"
+            });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.NextYearRangeNavIconName, iconName);
+            }
+        });
+
+        // Click the year picker toggle to navigate from year view to year-range view
+        component.Find(".year-picker-toggle").Click();
+
+        var icon = component.Find(".next-year-range-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on NextYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerNextYearRangeNavIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.NextYearRangeNavIcon, BitIconInfo.Css("fa-solid fa-angles-right"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles
+            {
+                YearPickerToggleButton = "year-picker-toggle",
+                NextYearRangeNavIcon = "next-year-range-icon"
+            });
+        });
+
+        // Click the year picker toggle to navigate from year view to year-range view
+        component.Find(".year-picker-toggle").Click();
+
+        var icon = component.Find(".next-year-range-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on NextYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-angles-right"),
+            $"Expected 'fa-angles-right' on NextYearRangeNavIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("Clock", "bit-icon--Clock"),
+        DataRow(null, "bit-icon--Clock")
+    ]
+    public void BitDateRangePickerShowTimePickerIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ShowTimePickerIconName, iconName);
+            }
+        });
+
+        var icon = component.FindAll("i").FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on ShowTimePickerIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDateRangePickerShowTimePickerIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.ShowTimePickerIcon, BitIconInfo.Css("fa-solid fa-clock"));
+        });
+
+        var icon = component.FindAll("i").FirstOrDefault(i => i.ClassList.Contains("fa-clock"));
+
+        Assert.IsNotNull(icon,
+            $"Expected 'fa-clock' on ShowTimePickerIcon but no matching icon element was found.");
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on ShowTimePickerIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("CalendarSolid", "bit-icon--CalendarSolid"),
+        DataRow(null, "bit-icon--CalendarMirrored")
+    ]
+    public void BitDateRangePickerHideTimePickerIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.HideTimePickerIconName, iconName);
+            }
+        });
+
+        var icon = component.FindAll("i").FirstOrDefault(i => i.ClassList.Contains(expectedClass));
+
+        Assert.IsNotNull(icon,
+            $"Expected class '{expectedClass}' on HideTimePickerIcon but no matching icon element was found.");
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitDateRangePickerHideTimePickerIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.HideTimePickerIcon, BitIconInfo.Css("fa-solid fa-calendar"));
+        });
+
+        var icon = component.FindAll("i").FirstOrDefault(i => i.ClassList.Contains("fa-calendar"));
+
+        Assert.IsNotNull(icon,
+            $"Expected 'fa-calendar' on HideTimePickerIcon but no matching icon element was found.");
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on HideTimePickerIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUp", "bit-icon--ChevronUp"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerStartTimeIncreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeIncreaseHourIcon = "start-inc-hour-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.StartTimeIncreaseHourIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".start-inc-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on StartTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerStartTimeIncreaseHourIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.StartTimeIncreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeIncreaseHourIcon = "start-inc-hour-icon" });
+        });
+
+        var icon = component.Find(".start-inc-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on StartTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on StartTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronDown", "bit-icon--ChevronDown"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerStartTimeDecreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeDecreaseHourIcon = "start-dec-hour-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.StartTimeDecreaseHourIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".start-dec-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on StartTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerStartTimeDecreaseHourIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.StartTimeDecreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeDecreaseHourIcon = "start-dec-hour-icon" });
+        });
+
+        var icon = component.Find(".start-dec-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on StartTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on StartTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUp", "bit-icon--ChevronUp"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerStartTimeIncreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeIncreaseMinuteIcon = "start-inc-min-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.StartTimeIncreaseMinuteIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".start-inc-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on StartTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerStartTimeIncreaseMinuteIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.StartTimeIncreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeIncreaseMinuteIcon = "start-inc-min-icon" });
+        });
+
+        var icon = component.Find(".start-inc-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on StartTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on StartTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronDown", "bit-icon--ChevronDown"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerStartTimeDecreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeDecreaseMinuteIcon = "start-dec-min-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.StartTimeDecreaseMinuteIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".start-dec-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on StartTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerStartTimeDecreaseMinuteIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.StartTimeDecreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { StartTimeDecreaseMinuteIcon = "start-dec-min-icon" });
+        });
+
+        var icon = component.Find(".start-dec-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on StartTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on StartTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUp", "bit-icon--ChevronUp"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerEndTimeIncreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeIncreaseHourIcon = "end-inc-hour-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.EndTimeIncreaseHourIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".end-inc-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on EndTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerEndTimeIncreaseHourIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.EndTimeIncreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeIncreaseHourIcon = "end-inc-hour-icon" });
+        });
+
+        var icon = component.Find(".end-inc-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on EndTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on EndTimeIncreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronDown", "bit-icon--ChevronDown"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerEndTimeDecreaseHourIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeDecreaseHourIcon = "end-dec-hour-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.EndTimeDecreaseHourIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".end-dec-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on EndTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerEndTimeDecreaseHourIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.EndTimeDecreaseHourIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeDecreaseHourIcon = "end-dec-hour-icon" });
+        });
+
+        var icon = component.Find(".end-dec-hour-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on EndTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on EndTimeDecreaseHourIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronUp", "bit-icon--ChevronUp"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerEndTimeIncreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeIncreaseMinuteIcon = "end-inc-min-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.EndTimeIncreaseMinuteIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".end-inc-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on EndTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerEndTimeIncreaseMinuteIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.EndTimeIncreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-up"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeIncreaseMinuteIcon = "end-inc-min-icon" });
+        });
+
+        var icon = component.Find(".end-inc-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on EndTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-up"),
+            $"Expected 'fa-chevron-up' on EndTimeIncreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod,
+        DataRow("ChevronDown", "bit-icon--ChevronDown"),
+        DataRow(null, "bit-icon--ChevronDownSmall")
+    ]
+    public void BitDateRangePickerEndTimeDecreaseMinuteIconNameTest(string? iconName, string expectedClass)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeDecreaseMinuteIcon = "end-dec-min-icon" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.EndTimeDecreaseMinuteIconName, iconName);
+            }
+        });
+
+        var icon = component.Find(".end-dec-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains(expectedClass),
+            $"Expected class '{expectedClass}' on EndTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
+
+    [TestMethod]
+    public void BitDateRangePickerEndTimeDecreaseMinuteIconTest()
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+        var component = RenderComponent<BitDateRangePicker>(parameters =>
+        {
+            parameters.Add(p => p.IsOpen, true);
+            parameters.Add(p => p.ShowTimePicker, true);
+            parameters.Add(p => p.EndTimeDecreaseMinuteIcon, BitIconInfo.Css("fa-solid fa-chevron-down"));
+            parameters.Add(p => p.Classes, new BitDateRangePickerClassStyles { EndTimeDecreaseMinuteIcon = "end-dec-min-icon" });
+        });
+
+        var icon = component.Find(".end-dec-min-icon");
+
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"),
+            $"Expected 'fa-solid' on EndTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+        Assert.IsTrue(icon.ClassList.Contains("fa-chevron-down"),
+            $"Expected 'fa-chevron-down' on EndTimeDecreaseMinuteIcon but got: {string.Join(' ', icon.ClassList)}");
+    }
 }

From 5096df791562bfd570f5e1d61924f55d07842ec6 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 20 Mar 2026 15:23:09 +0100
Subject: [PATCH 60/66] feat(deps): update project dependencies #12199 (#12200)

---
 .github/workflows/admin-sample.cd.yml         |  2 +-
 .github/workflows/blazorui.demo.cd.yml        |  2 +-
 .github/workflows/todo-sample.cd.yml          |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  4 +--
 .../Bit.ResxTranslator.csproj                 |  4 +--
 .../Bit.SourceGenerators.csproj               |  2 +-
 .../.github/workflows/cd-template.yml         |  2 +-
 .../src/Directory.Packages.props              | 28 +++++++++----------
 .../Boilerplate.Server.AppHost.csproj         |  2 +-
 .../Bit.Websites.Platform.Server.csproj       |  4 +--
 10 files changed, 26 insertions(+), 26 deletions(-)

diff --git a/.github/workflows/admin-sample.cd.yml b/.github/workflows/admin-sample.cd.yml
index 70bfa478e4..b4e696aa3a 100644
--- a/.github/workflows/admin-sample.cd.yml
+++ b/.github/workflows/admin-sample.cd.yml
@@ -291,7 +291,7 @@ jobs:
       with:
         global-json-file: src/global.json
 
-    - uses: maxim-lobanov/setup-xcode@v1.6.0
+    - uses: maxim-lobanov/setup-xcode@v1.7.0
       with:
         xcode-version: '26.2'
 
diff --git a/.github/workflows/blazorui.demo.cd.yml b/.github/workflows/blazorui.demo.cd.yml
index 29e0a0414c..315dae8e55 100644
--- a/.github/workflows/blazorui.demo.cd.yml
+++ b/.github/workflows/blazorui.demo.cd.yml
@@ -162,7 +162,7 @@ jobs:
       with:
         global-json-file: src/global.json
 
-    - uses: maxim-lobanov/setup-xcode@v1.6.0
+    - uses: maxim-lobanov/setup-xcode@v1.7.0
       with:
         xcode-version: '26.2'
 
diff --git a/.github/workflows/todo-sample.cd.yml b/.github/workflows/todo-sample.cd.yml
index aa317b4a81..e4efec7f35 100644
--- a/.github/workflows/todo-sample.cd.yml
+++ b/.github/workflows/todo-sample.cd.yml
@@ -456,7 +456,7 @@ jobs:
       with:
         node-version: 24
 
-    - uses: maxim-lobanov/setup-xcode@v1.6.0
+    - uses: maxim-lobanov/setup-xcode@v1.7.0
       with:
         xcode-version: '26.2'
 
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 56fb4c880a..22c0394820 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -21,7 +21,7 @@
         </PackageReference>
         <PackageReference Include="Jint" Version="4.6.3" />
         <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageReference Include="MimeTypeMapOfficial" Version="1.0.17" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />
         <PackageReference Include="Swashbuckle.AspNetCore" Version="10.1.5" />
@@ -31,7 +31,7 @@
         <PackageReference Include="AspNetCore.HealthChecks.UI.InMemory.Storage" Version="9.0.0" />
         <PackageReference Include="Riok.Mapperly" Version="4.3.1" />
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.1" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
     </ItemGroup>
diff --git a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
index 1b7d4f067e..1617c81a7f 100644
--- a/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
+++ b/src/ResxTranslator/Bit.ResxTranslator/Bit.ResxTranslator.csproj
@@ -14,8 +14,8 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.1" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="Microsoft.Extensions.Hosting" Version="10.0.5" />
         <PackageReference Include="Microsoft.Extensions.Http" Version="10.0.5" />
diff --git a/src/SourceGenerators/Bit.SourceGenerators/Bit.SourceGenerators.csproj b/src/SourceGenerators/Bit.SourceGenerators/Bit.SourceGenerators.csproj
index ba92f114f5..145c673b73 100644
--- a/src/SourceGenerators/Bit.SourceGenerators/Bit.SourceGenerators.csproj
+++ b/src/SourceGenerators/Bit.SourceGenerators/Bit.SourceGenerators.csproj
@@ -13,7 +13,7 @@
 
     <ItemGroup>
         <PackageReference Include="DoLess.UriTemplates" Version="1.4.0" PrivateAssets="all" GeneratePathProperty="true" />
-        <PackageReference Include="IndexRange" Version="1.1.0" PrivateAssets="all" />
+        <PackageReference Include="IndexRange" Version="1.1.1" PrivateAssets="all" />
         <PackageReference Include="Microsoft.CodeAnalysis.Analyzers" Version="3.3.3" PrivateAssets="all" />
         <PackageReference Include="Microsoft.CodeAnalysis.CSharp.Workspaces" Version="4.3.1" PrivateAssets="all" />
         <None Include="$(OutputPath)\$(AssemblyName).dll" Pack="true" PackagePath="analyzers/dotnet/cs" Visible="false" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
index c756056781..36638ae22b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.github/workflows/cd-template.yml
@@ -217,7 +217,7 @@ jobs:
         with:
           global-json-file: global.json
 
-      - uses: maxim-lobanov/setup-xcode@v1.6.0
+      - uses: maxim-lobanov/setup-xcode@v1.7.0
         with:
           xcode-version: '26.2'
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 37ea7a4e1d..c4be60a486 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -50,7 +50,7 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.10" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.11" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.5" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.5" />
@@ -59,19 +59,19 @@
         <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.5" />
         <!--/+:msbuild-conditional:noEmit -->
         <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.1.0" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.2-preview.1.26125.13" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.2" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.3-preview.1.26166.8" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.3" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.2" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.2" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.3" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.3" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'Sqlite' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.Sqlite" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.2" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.3" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.SqlServer.Extensions" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.2" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.2" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.2" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.3" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.3" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.3" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'S3' OR '$(filesStorage)' == '') " Include="CommunityToolkit.Aspire.Hosting.Minio" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.2-preview.1.26125.13" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.3-preview.1.26166.8" />
         <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.4.0" />
         <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.4.0" />
         <PackageVersion Include="OpenTelemetry.Exporter.OpenTelemetryProtocol" Version="1.15.0" />
@@ -94,8 +94,8 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.4.0" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.4.1" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.73.0-preview" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.73.0" />
@@ -111,8 +111,8 @@
         <PackageVersion Condition=" '$(filesStorage)' == 'S3' OR '$(filesStorage)' == '' " Include="FluentStorage.AWS" Version="6.0.2" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.AspNetCore" Version="1.4.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta8" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.2" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.2" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.3" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.3" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.6.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
index 21ef7f2dcc..7097e1db73 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Aspire.AppHost.Sdk/13.1.2">
+<Project Sdk="Aspire.AppHost.Sdk/13.1.3">
 
     <PropertyGroup>
         <OutputType>Exe</OutputType>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index f5bd9a306e..0d155f3203 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -21,11 +21,11 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageReference Include="Microsoft.AspNetCore.Components.Web" Version="10.0.5" />
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="10.0.5" />
         <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.5" />
-        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.0" />
+        <PackageReference Include="Microsoft.Extensions.AI" Version="10.4.1" />
         <PackageReference Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
         <PackageReference Include="ModelContextProtocol" Version="1.1.0" />
         <PackageReference Include="NWebsec.AspNetCore.Middleware" Version="3.0.0" />

From 067044ab6e476e4993d811be578b271436f27dba Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Fri, 20 Mar 2026 19:48:13 +0100
Subject: [PATCH 61/66] feat(templates): prevent XSS attack in markdown viewers
 of Boilerplate #12188 (#12189)

---
 .../Components/Layout/AppAiChatPanel.razor    |   8 +-
 .../Components/Pages/SystemPromptsPage.razor  |   3 +-
 .../Boilerplate.Client.Core/Scripts/App.ts    |  10 +
 .../Boilerplate.Client.Core/package-lock.json | 235 ++++++++++--------
 .../Boilerplate.Client.Core/package.json      |   5 +-
 .../Boilerplate.Client.Core/tsconfig.json     |  14 +-
 6 files changed, 160 insertions(+), 115 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppAiChatPanel.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppAiChatPanel.razor
index d9dddd368b..23e8050e7d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppAiChatPanel.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Layout/AppAiChatPanel.razor
@@ -54,7 +54,13 @@
                             }
                             else
                             {
-                                <BitMarkdownViewer Markdown="@message.Content" />
+                                <BitMarkdownViewer Markdown="@message.Content" JsMiddlewareIdentifier="App.sanitizeHtml" />
+                                @*
+                                     Unlike RichTextEditor which sanitizes while storing content server-side,
+                                     Markdown sanitization is done client-side while rendering the content that is getting streamed from the server incrementally.
+                                     Even though AiChatbot content comes from the server and LLM, we sanitize to protect against
+                                     XSS attacks (e.g., LLM prompt injection generating malicious markup, etc).
+                                *@
                                 @if (message.Successful is false)
                                 {
                                     <BitTag Color="BitColor.Error" Size="BitSize.Small" Style="min-height:18px">
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor
index 653e81a37a..0595770b44 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Components/Pages/SystemPromptsPage.razor
@@ -28,7 +28,8 @@
                         <AuthorizeView Policy="@AppFeatures.Management.ManageAiPrompt">
                             <BitMarkdownEditor @bind-Value="systemPrompt.Markdown" Class="md-editor" />
                         </AuthorizeView>
-                        <BitMarkdownViewer Markdown="@systemPrompt.Markdown" Class="md-viewer" />
+                        <BitMarkdownViewer NoPrerender Markdown="@systemPrompt.Markdown" Class="md-viewer"
+                                           JsMiddlewareIdentifier="App.sanitizeHtml" />
                     </BitStack>
                 </BitPivotItem>
             }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/App.ts b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/App.ts
index c2e2db21d0..40a27c9c60 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/App.ts
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Scripts/App.ts
@@ -1,5 +1,9 @@
 //+:cnd:noEmit
 
+//#if (signalR == true)
+import DOMPurify from 'dompurify';
+//#endif
+
 export class App {
     // For additional details, see the JsBridge.cs file.
     private static jsBridgeObj: DotNetObject;
@@ -98,5 +102,11 @@ export class App {
             document.cookie.split(';').forEach(c => document.cookie = c.split('=')[0].trim() + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/')
         ]);
     }
+
+    //#if (signalR == true)
+    public static sanitizeHtml(html: string): string {
+        return DOMPurify.sanitize(html);
+    }
+    //#endif
 }
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
index 9d741dbff4..927c209705 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
@@ -4,16 +4,19 @@
     "requires": true,
     "packages": {
         "": {
+            "dependencies": {
+                "dompurify": "3.3.3"
+            },
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +31,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +48,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +65,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +82,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +99,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +116,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +133,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +150,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +167,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +184,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +201,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +218,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +235,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +252,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +269,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +286,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +303,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +320,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +337,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +354,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +371,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +388,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +405,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +422,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +439,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -739,6 +742,13 @@
                 "url": "https://opencollective.com/parcel"
             }
         },
+        "node_modules/@types/trusted-types": {
+            "version": "2.0.7",
+            "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
+            "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
+            "license": "MIT",
+            "optional": true
+        },
         "node_modules/braces": {
             "version": "3.0.3",
             "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
@@ -783,10 +793,19 @@
                 "node": ">=0.10"
             }
         },
+        "node_modules/dompurify": {
+            "version": "3.3.3",
+            "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.3.3.tgz",
+            "integrity": "sha512-Oj6pzI2+RqBfFG+qOaOLbFXLQ90ARpcGG6UePL82bJLtdsa6CYJD7nmiU8MW9nQNOtCHV3lZ/Bzq1X0QYbBZCA==",
+            "license": "(MPL-2.0 OR Apache-2.0)",
+            "optionalDependencies": {
+                "@types/trusted-types": "^2.0.7"
+            }
+        },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +816,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
index 7b9fa7d740..f14fa27b95 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
@@ -1,6 +1,9 @@
 {
+    "dependencies": {
+        "dompurify": "3.3.3"
+    },
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
index dc0d701e58..426784625a 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
@@ -3,9 +3,15 @@
     "compilerOptions": {
         "strict": true,
         "target": "ES2019",
-        "module": "es2015",
-        "noImplicitAny": true,
+        "module": "ESNext",
+        "moduleResolution": "bundler",
+        "verbatimModuleSyntax": true,
+        "resolveJsonModule": true,
         "lib": [ "DOM", "ESNext" ],
-        "moduleResolution": "node"
-    }
+        "esModuleInterop": true,
+        "skipLibCheck": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "include": [ "Scripts" ],
+    "exclude": [ "node_modules" ]
 }
\ No newline at end of file

From a692bfd243d470e0142812e4c3444717601881fa Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sat, 21 Mar 2026 13:03:58 +0330
Subject: [PATCH 62/66] feat(blazorui): add missing new Icon parameters to
 BitDropdown #12201 (#12202)

---
 .../Inputs/Dropdown/BitDropdown.razor         |  25 ++-
 .../Inputs/Dropdown/BitDropdown.razor.cs      |  92 +++++++++-
 .../Inputs/Dropdown/BitDropdownDemo.razor     |   3 +-
 .../Inputs/Dropdown/BitDropdownDemo.razor.cs  | 108 ++++++++++-
 .../Dropdown/_BitDropdownCustomDemo.razor     |  45 ++++-
 .../_BitDropdownCustomDemo.razor.samples.cs   |  25 ++-
 .../Dropdown/_BitDropdownItemDemo.razor       |  54 +++++-
 .../_BitDropdownItemDemo.razor.samples.cs     |  37 +++-
 .../Dropdown/_BitDropdownOptionDemo.razor     |  57 +++++-
 .../_BitDropdownOptionDemo.razor.samples.cs   |  39 +++-
 .../Inputs/Dropdown/BitDropdownTests.cs       | 169 ++++++++++++++++++
 11 files changed, 613 insertions(+), 41 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
index 132c266cd3..a15621e626 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor
@@ -3,6 +3,16 @@
 @typeparam TItem
 @typeparam TValue
 
+@{
+    var chipsRemoveIconCss = BitIconInfo.From(ChipsRemoveIcon, ChipsRemoveIconName ?? "Cancel")?.GetCssClasses();
+    var clearButtonIconCss = BitIconInfo.From(ClearButtonIcon, ClearButtonIconName ?? "Cancel")?.GetCssClasses();
+    var caretDownIconCss = BitIconInfo.From(CaretDownIcon, CaretDownIconName ?? "ChevronRight bit-ico-r90")?.GetCssClasses();
+    var responsiveCloseIconCss = BitIconInfo.From(ResponsiveCloseIcon, ResponsiveCloseIconName ?? "Cancel")?.GetCssClasses();
+    var searchBoxIconCss = BitIconInfo.From(SearchBoxIcon, SearchBoxIconName ?? "Search")?.GetCssClasses();
+    var searchBoxClearIconCss = BitIconInfo.From(SearchBoxClearIcon, SearchBoxClearIconName ?? "Cancel")?.GetCssClasses();
+    var comboBoxAddButtonIconCss = BitIconInfo.From(ComboBoxAddButtonIcon, ComboBoxAddButtonIconName ?? "Add")?.GetCssClasses();
+}
+
 @if ((Options ?? ChildContent) is not null)
 {
     <CascadingValue Value="this" IsFixed="true">
@@ -69,7 +79,7 @@
                 {
                     <span style="@Styles?.Chips" class="bit-drp-chp @Classes?.Chips">
                         @GetText(item)
-                        <i style="@Styles?.ChipsRemoveIcon" class="bit-icon bit-icon--Cancel @Classes?.ChipsRemoveIcon" @onclick="() => HandleOnClickUnselectItem(item)" @onclick:stopPropagation />
+                        <i style="@Styles?.ChipsRemoveIcon" class="@chipsRemoveIconCss @Classes?.ChipsRemoveIcon" @onclick="() => HandleOnClickUnselectItem(item)" @onclick:stopPropagation />
                     </span>
                 }
             }
@@ -119,7 +129,7 @@
                     type="button"
                     style="@Styles?.ClearButton"
                     class="bit-drp-icn bit-drp-clr @Classes?.ClearButton">
-                <i class="bit-icon bit-icon--Cancel" />
+                <i class="@clearButtonIconCss" />
             </button>
         }
 
@@ -130,10 +140,9 @@
             }
             else
             {
-                var icon = BitIconInfo.From(CaretDownIcon, CaretDownIconName ?? "ChevronRight bit-ico-r90");
                 <i aria-hidden="true"
                    style="@Styles?.CaretDownIcon"
-                   class="@icon?.GetCssClasses() @Classes?.CaretDownIcon" />
+                   class="@caretDownIconCss @Classes?.CaretDownIcon" />
             }
         </span>
 
@@ -188,7 +197,7 @@
                         class="bit-drp-cls @Classes?.ResponsiveCloseButton">
                     <span>
                         <i style="@Styles?.ResponsiveCloseIcon"
-                           class="bit-icon bit-icon--Cancel @Classes?.ResponsiveCloseIcon" />
+                           class="@responsiveCloseIconCss @Classes?.ResponsiveCloseIcon" />
                     </span>
                 </button>
             </div>
@@ -208,7 +217,7 @@
                      class="bit-drp-sic @Classes?.SearchBoxIconContainer">
                     <i aria-hidden="true"
                        style="@Styles?.SearchBoxIcon"
-                       class="bit-icon bit-icon--Search @Classes?.SearchBoxIcon" />
+                       class="@searchBoxIconCss @Classes?.SearchBoxIcon" />
                 </div>
                 <input @ref="_searchInputRef" @onfocusin="HandleSearchBoxFocusIn" @onfocusout="HandleSearchBoxFocusOut" @oninput="@HandleFilterChange"
                        type="text"
@@ -233,7 +242,7 @@
                             <span>
                                 <i aria-hidden="true"
                                    style="@Styles?.SearchBoxClearIcon"
-                                   class="bit-icon bit-icon--Cancel @Classes?.SearchBoxClearIcon" />
+                                   class="@searchBoxClearIconCss @Classes?.SearchBoxClearIcon" />
                             </span>
                         </button>
                     </div>
@@ -260,7 +269,7 @@
                         type="button"
                         style="@Styles?.ResponsiveComboAddButton"
                         class="bit-drp-icn bit-drp-cai @Classes?.ResponsiveComboAddButton">
-                    <i class="bit-icon bit-icon--Add" />
+                    <i class="@comboBoxAddButtonIconCss" />
                 </button>
             </div>
         }
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
index c2c245ee17..5940f035cd 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/Dropdown/BitDropdown.razor.cs
@@ -42,14 +42,14 @@ namespace Bit.BlazorUI;
     [Parameter] public bool AutoFocusSearchBox { get; set; }
 
     /// <summary>
-    /// Custom template to render as a header in the callout.
+    /// Custom template to render as a footer in the callout.
     /// </summary>
-    [Parameter] public RenderFragment? CalloutHeaderTemplate { get; set; }
+    [Parameter] public RenderFragment? CalloutFooterTemplate { get; set; }
 
     /// <summary>
-    /// Custom template to render as a footer in the callout.
+    /// Custom template to render as a header in the callout.
     /// </summary>
-    [Parameter] public RenderFragment? CalloutFooterTemplate { get; set; }
+    [Parameter] public RenderFragment? CalloutHeaderTemplate { get; set; }
 
     /// <summary>
     /// The icon of the chevron down element of the dropdown.
@@ -86,16 +86,58 @@ namespace Bit.BlazorUI;
     [Parameter, ResetClassBuilder]
     public bool Chips { get; set; }
 
+    /// <summary>
+    /// The icon of the remove button in the chips display.
+    /// Takes precedence over <see cref="ChipsRemoveIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ChipsRemoveIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? ChipsRemoveIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the remove button in the chips display from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="ChipsRemoveIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? ChipsRemoveIconName { get; set; }
+
     /// <summary>
     /// Custom CSS classes for different parts of the BitDropdown.
     /// </summary>
     [Parameter] public BitDropdownClassStyles? Classes { get; set; }
 
+    /// <summary>
+    /// The icon of the clear button of the dropdown.
+    /// Takes precedence over <see cref="ClearButtonIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ClearButtonIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? ClearButtonIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the clear button of the dropdown from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="ClearButtonIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? ClearButtonIconName { get; set; }
+
     /// <summary>
     /// Activates the ComboBox feature in BitDropDown component.
     /// </summary>
     [Parameter] public bool Combo { get; set; }
 
+    /// <summary>
+    /// The icon of the add button in the responsive ComboBox mode.
+    /// Takes precedence over <see cref="ComboBoxAddButtonIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ComboBoxAddButtonIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? ComboBoxAddButtonIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the add button in the responsive ComboBox mode from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="ComboBoxAddButtonIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? ComboBoxAddButtonIconName { get; set; }
+
     /// <summary>
     /// The default value that will be initially used to set selected item if the Value parameter is not set.
     /// </summary>
@@ -276,6 +318,48 @@ namespace Bit.BlazorUI;
     /// </summary>
     [Parameter] public bool Responsive { get; set; }
 
+    /// <summary>
+    /// The icon of the close button in the responsive mode callout.
+    /// Takes precedence over <see cref="ResponsiveCloseIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="ResponsiveCloseIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? ResponsiveCloseIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the close button in the responsive mode callout from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="ResponsiveCloseIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? ResponsiveCloseIconName { get; set; }
+
+    /// <summary>
+    /// The icon of the clear icon in the SearchBox.
+    /// Takes precedence over <see cref="SearchBoxClearIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="SearchBoxClearIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? SearchBoxClearIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the clear icon in the SearchBox from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="SearchBoxClearIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? SearchBoxClearIconName { get; set; }
+
+    /// <summary>
+    /// The icon of the search icon in the SearchBox.
+    /// Takes precedence over <see cref="SearchBoxIconName"/> when both are set.
+    /// Use this property to render icons from external libraries like FontAwesome, Material Icons, or Bootstrap Icons.
+    /// For built-in Fluent UI icons, use <see cref="SearchBoxIconName"/> instead.
+    /// </summary>
+    [Parameter] public BitIconInfo? SearchBoxIcon { get; set; }
+
+    /// <summary>
+    /// The icon name of the search icon in the SearchBox from the Fluent UI icon set.
+    /// For external icon libraries, use <see cref="SearchBoxIcon"/> instead.
+    /// </summary>
+    [Parameter] public string? SearchBoxIconName { get; set; }
+
     /// <summary>
     /// The placeholder text of the SearchBox input.
     /// </summary>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
index 6bf02237e7..118d9521a9 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor
@@ -15,8 +15,7 @@
               PublicMembers="componentPublicMembers"
               GitHubUrl="Inputs/Dropdown/BitDropdown.razor"
               GitHubDemoUrl="Inputs/Dropdown/BitDropdownDemo.razor"
-              >
-              @* IntroductionVideoUrl="https://videos.bitplatform.dev/bit%20Dropdown.mp4" *@
+              IntroductionVideoUrl="https://videos.bitplatform.dev/bit%20Dropdown.mp4">
         <NotesTemplate>
             <BitText>
                 The BitDropdown is a <BitTag Color="BitColor.SecondaryBackground">Multi-API</BitTag> component
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
index ae6e96e724..4ef93f9d8e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/BitDropdownDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class BitDropdownDemo
 {
@@ -13,17 +13,17 @@ public partial class BitDropdownDemo
         },
         new()
         {
-            Name = "CalloutHeaderTemplate",
+            Name = "CalloutFooterTemplate",
             Type = "RenderFragment?",
             DefaultValue = "null",
-            Description = "Custom template to render as a header in the callout.",
+            Description = "Custom template to render as a footer in the callout.",
         },
         new()
         {
-            Name = "CalloutFooterTemplate",
+            Name = "CalloutHeaderTemplate",
             Type = "RenderFragment?",
-            DefaultValue = "false",
-            Description = "Custom template to render as a footer in the callout.",
+            DefaultValue = "null",
+            Description = "Custom template to render as a header in the callout.",
         },
         new()
         {
@@ -63,6 +63,22 @@ public partial class BitDropdownDemo
             Description = "Shows the selected items like chips in the BitDropdown.",
         },
         new()
+        {
+            Name = "ChipsRemoveIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the remove button in the chips display. Takes precedence over ChipsRemoveIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ChipsRemoveIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the remove button in the chips display from the Fluent UI icon set.",
+        },
+        new()
         {
             Name = "Classes",
             Type = "BitDropdownClassStyles?",
@@ -72,6 +88,22 @@ public partial class BitDropdownDemo
             Href = "#class-styles"
         },
         new()
+        {
+            Name = "ClearButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the clear button of the dropdown. Takes precedence over ClearButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ClearButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the clear button of the dropdown from the Fluent UI icon set.",
+        },
+        new()
         {
             Name = "Combo",
             Type = "bool",
@@ -79,6 +111,22 @@ public partial class BitDropdownDemo
             Description = "Activates the ComboBox feature in BitDropDown component.",
         },
         new()
+        {
+            Name = "ComboBoxAddButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the add button in the responsive ComboBox mode. Takes precedence over ComboBoxAddButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ComboBoxAddButtonIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the add button in the responsive ComboBox mode from the Fluent UI icon set.",
+        },
+        new()
         {
             Name = "DefaultValue",
             Type = "string?",
@@ -321,6 +369,54 @@ public partial class BitDropdownDemo
             Description = "Enables the responsive mode of the component for small screens.",
         },
         new()
+        {
+            Name = "ResponsiveCloseIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the close button in the responsive mode callout. Takes precedence over ResponsiveCloseIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "ResponsiveCloseIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the close button in the responsive mode callout from the Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "SearchBoxClearIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the clear icon in the SearchBox. Takes precedence over SearchBoxClearIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "SearchBoxClearIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the clear icon in the SearchBox from the Fluent UI icon set.",
+        },
+        new()
+        {
+            Name = "SearchBoxIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "The icon of the search icon in the SearchBox. Takes precedence over SearchBoxIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "SearchBoxIconName",
+            Type = "string?",
+            DefaultValue = "null",
+            Description = "The icon name of the search icon in the SearchBox from the Fluent UI icon set.",
+        },
+        new()
         {
             Name = "SearchBoxPlaceholder",
             Type = "string?",
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
index 8a95a0dd08..7031899f81 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor
@@ -484,28 +484,71 @@
 </DemoExample>
 
 <DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
-    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> properties on your custom item type (e.g. <b>Product</b>) with <b>NameSelectors</b>.</div>
+    <div>
+        Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b>, 
+        <b>ClearButtonIcon</b>, <b>ChipsRemoveIcon</b>, <b>SearchBoxIcon</b>, <b>SearchBoxClearIcon</b>, and 
+        <b>ResponsiveCloseIcon</b> parameters on the dropdown and the <b>Icon</b> or <b>IconName</b> 
+        properties on your custom item type (e.g. <b>Product</b>) with <b>NameSelectors</b>.
+    </div>
+    
     <br />
     <br />
+
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
     <div class="example-content">
         <BitDropdown Label="Caret down icon (external)"
                      CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
                      Items="GetBasicCustoms()"
                      NameSelectors="nameSelectors"
                      Placeholder="Select an item" />
+        
+        <br /><br />
+        
+        <BitDropdown Label="Clear button icon (external)"
+                     ShowClearButton
+                     ClearButtonIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Items="GetBasicCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+        
+        <br /><br />
+        
+        <BitDropdown Label="Chips remove icon (external)"
+                     Chips
+                     MultiSelect
+                     ChipsRemoveIcon="@BitIconInfo.Css("bi bi-x-circle")"
+                     Items="GetBasicCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select items" />
+
         <br /><br />
+
+        <BitDropdown Label="Search box icons (external)"
+                     ShowSearchBox
+                     SearchBoxIcon="@BitIconInfo.Css("fa-solid fa-magnifying-glass")"
+                     SearchBoxClearIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Items="GetBasicCustoms()"
+                     NameSelectors="nameSelectors"
+                     Placeholder="Select an item" />
+
+        <br /><br />
+
         <BitDropdown Label="Item icons (IconName - Fluent UI)"
                      Items="GetExternalIconCustoms()"
                      NameSelectors="nameSelectors"
                      Placeholder="Select an item" />
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - FontAwesome)"
                      Items="GetExternalIconFaCustoms()"
                      NameSelectors="nameSelectors"
                      Placeholder="Select an item" />
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
                      Items="GetExternalIconBiCustoms()"
                      NameSelectors="nameSelectors"
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
index f1375907ae..e5c6357805 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownCustomDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownCustomDemo
 {
@@ -1205,6 +1205,29 @@ public class Product
              Items=""GetBasicCustoms()""
              NameSelectors=""nameSelectors""
              Placeholder=""Select an item"" />
+        
+<BitDropdown Label=""Clear button icon (external)""
+             ShowClearButton
+             ClearButtonIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Items=""GetBasicCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />
+        
+<BitDropdown Label=""Chips remove icon (external)""
+             Chips
+             MultiSelect
+             ChipsRemoveIcon=""@BitIconInfo.Css(""bi bi-x-circle"")""
+             Items=""GetBasicCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select items"" />
+        
+<BitDropdown Label=""Search box icons (external)""
+             ShowSearchBox
+             SearchBoxIcon=""@BitIconInfo.Css(""fa-solid fa-magnifying-glass"")""
+             SearchBoxClearIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Items=""GetBasicCustoms()""
+             NameSelectors=""nameSelectors""
+             Placeholder=""Select an item"" />
 
 <BitDropdown Label=""Item icons (IconName - Fluent UI)""
              Items=""GetExternalIconCustoms()""
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
index 21374ba3fa..76c2aa88f2 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor
@@ -471,36 +471,76 @@
 </DemoExample>
 
 <DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
-    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> parameters on <b>BitDropdownItem</b>.</div>
+    <div>
+        Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b>, 
+        <b>ClearButtonIcon</b>, <b>ChipsRemoveIcon</b>, <b>SearchBoxIcon</b>, <b>SearchBoxClearIcon</b>, and 
+        <b>ResponsiveCloseIcon</b> parameters on the dropdown and the <b>Icon</b> or <b>IconName</b> 
+        parameters on <b>BitDropdownItem</b>.
+    </div>
+    
     <br />
     <br />
+    
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
     <div class="example-content">
         <BitDropdown Label="Caret down icon (external)"
                      CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
                      Items="GetBasicItems()"
                      DefaultValue="@string.Empty"
-                     Placeholder="Select an item"
-                     TItem="BitDropdownItem<string>" TValue="string" />
+                     Placeholder="Select an item" />
+
+        <br /><br />
+
+        <BitDropdown Label="Clear button icon (external)"
+                     ShowClearButton
+                     ClearButtonIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Items="GetBasicItems()"
+                     DefaultValue="@("f-app")"
+                     Placeholder="Select an item" />
+
+        <br /><br />
+
+        <BitDropdown Label="Chips remove icon (external)"
+                     Chips
+                     MultiSelect
+                     ChipsRemoveIcon="@BitIconInfo.Css("bi bi-x-circle")"
+                     Items="GetBasicItems()"
+                     DefaultValues="@(["f-app", "f-ban"])"
+                     Placeholder="Select items" />
+
         <br /><br />
+
+        <BitDropdown Label="Search box icons (external)"
+                     ShowSearchBox
+                     SearchBoxIcon="@BitIconInfo.Css("fa-solid fa-magnifying-glass")"
+                     SearchBoxClearIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Items="GetBasicItems()"
+                     DefaultValue="@string.Empty"
+                     Placeholder="Select an item" />
+
+        <br /><br />
+
         <BitDropdown Label="Item icons (IconName - Fluent UI)"
                      Items="GetExternalIconItems()"
                      DefaultValue="@string.Empty"
                      Placeholder="Select an item"
                      TItem="BitDropdownItem<string>" TValue="string" />
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - FontAwesome)"
                      Items="GetExternalIconFaItems()"
                      DefaultValue="@string.Empty"
-                     Placeholder="Select an item"
-                     TItem="BitDropdownItem<string>" TValue="string" />
+                     Placeholder="Select an item" />
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
                      Items="GetExternalIconBiItems()"
                      DefaultValue="@string.Empty"
-                     Placeholder="Select an item"
-                     TItem="BitDropdownItem<string>" TValue="string" />
+                     Placeholder="Select an item" />
     </div>
 </DemoExample>
 
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
index 40728ad0fd..c831a21065 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownItemDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownItemDemo
 {
@@ -800,26 +800,45 @@ Combo Chips Dynamic
              CaretDownIcon=""@BitIconInfo.Css(""fa-solid fa-circle-chevron-down"")""
              Items=""GetBasicItems()""
              DefaultValue=""@string.Empty""
-             Placeholder=""Select an item""
-             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+             Placeholder=""Select an item"" />
+
+<BitDropdown Label=""Clear button icon (external)""
+             ShowClearButton
+             ClearButtonIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Items=""GetBasicItems()""
+             DefaultValue=""f-app""
+             Placeholder=""Select an item"" />
+
+<BitDropdown Label=""Chips remove icon (external)""
+             Chips
+             MultiSelect
+             ChipsRemoveIcon=""@BitIconInfo.Css(""bi bi-x-circle"")""
+             Items=""GetBasicItems()""
+             DefaultValues=""@([""f-app"", ""f-ban""])""
+             Placeholder=""Select items"" />
+
+<BitDropdown Label=""Search box icons (external)""
+             ShowSearchBox
+             SearchBoxIcon=""@BitIconInfo.Css(""fa-solid fa-magnifying-glass"")""
+             SearchBoxClearIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Items=""GetBasicItems()""
+             DefaultValue=""@string.Empty""
+             Placeholder=""Select an item"" />
 
 <BitDropdown Label=""Item icons (IconName - Fluent UI)""
              Items=""GetExternalIconItems()""
              DefaultValue=""@string.Empty""
-             Placeholder=""Select an item""
-             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+             Placeholder=""Select an item"" />
 
 <BitDropdown Label=""Item icons (Icon - FontAwesome)""
              Items=""GetExternalIconFaItems()""
              DefaultValue=""@string.Empty""
-             Placeholder=""Select an item""
-             TItem=""BitDropdownItem<string>"" TValue=""string"" />
+             Placeholder=""Select an item"" />
 
 <BitDropdown Label=""Item icons (Icon - Bootstrap Icons)""
              Items=""GetExternalIconBiItems()""
              DefaultValue=""@string.Empty""
-             Placeholder=""Select an item""
-             TItem=""BitDropdownItem<string>"" TValue=""string"" />";
+             Placeholder=""Select an item"" />";
     private readonly string example15CsharpCode = @"
 private List<BitDropdownItem<string>> GetBasicItems() => new()
 {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
index 162c3a8310..90699ca46e 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor
@@ -677,11 +677,19 @@
 </DemoExample>
 
 <DemoExample Title="External Icons" RazorCode="@example15RazorCode" CsharpCode="@example15CsharpCode" Id="example15">
-    <div>Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b> parameter on the dropdown and the <b>Icon</b> or <b>IconName</b> parameters on <b>BitDropdownOption</b>.</div>
+    <div>
+        Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>CaretDownIcon</b>, 
+        <b>ClearButtonIcon</b>, <b>ChipsRemoveIcon</b>, <b>SearchBoxIcon</b>, <b>SearchBoxClearIcon</b>, and 
+        <b>ResponsiveCloseIcon</b> parameters on the dropdown and the <b>Icon</b> or <b>IconName</b> 
+        parameters on <b>BitDropdownOption</b>.
+    </div>
+    
     <br />
     <br />
+    
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+    
     <div class="example-content">
         <BitDropdown Label="Caret down icon (external)"
                      CaretDownIcon="@BitIconInfo.Css("fa-solid fa-circle-chevron-down")"
@@ -692,7 +700,50 @@
                 <BitDropdownOption ItemType="item.ItemType" Text="@item.Text" Value="item.Value" IsEnabled="item.IsEnabled" />
             }
         </BitDropdown>
+
+        <br /><br />
+
+        <BitDropdown Label="Clear button icon (external)"
+                     ShowClearButton
+                     ClearButtonIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            @foreach (var item in basicItems)
+            {
+                <BitDropdownOption ItemType="item.ItemType" Text="@item.Text" Value="item.Value" IsEnabled="item.IsEnabled" />
+            }
+        </BitDropdown>
+
+        <br /><br />
+
+        <BitDropdown Label="Chips remove icon (external)"
+                     Chips
+                     MultiSelect
+                     ChipsRemoveIcon="@BitIconInfo.Css("bi bi-x-circle")"
+                     Placeholder="Select items"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            @foreach (var item in basicItems)
+            {
+                <BitDropdownOption ItemType="item.ItemType" Text="@item.Text" Value="item.Value" IsEnabled="item.IsEnabled" />
+            }
+        </BitDropdown>
+
+        <br /><br />
+
+        <BitDropdown Label="Search box icons (external)"
+                     ShowSearchBox
+                     SearchBoxIcon="@BitIconInfo.Css("fa-solid fa-magnifying-glass")"
+                     SearchBoxClearIcon="@BitIconInfo.Css("fa-solid fa-circle-xmark")"
+                     Placeholder="Select an item"
+                     TItem="BitDropdownOption<string>" TValue="string">
+            @foreach (var item in basicItems)
+            {
+                <BitDropdownOption ItemType="item.ItemType" Text="@item.Text" Value="item.Value" IsEnabled="item.IsEnabled" />
+            }
+        </BitDropdown>
+
         <br /><br />
+
         <BitDropdown Label="Item icons (IconName - Fluent UI)"
                      Placeholder="Select an item"
                      TItem="BitDropdownOption<string>" TValue="string">
@@ -707,7 +758,9 @@
             <BitDropdownOption Text="Carrot" Value="@("v-car")" IconName="@BitIconName.Add" />
             <BitDropdownOption Text="Lettuce" Value="@("v-let")" IconName="@BitIconName.ChevronDown" />
         </BitDropdown>
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - FontAwesome)"
                      Placeholder="Select an item"
                      TItem="BitDropdownOption<string>" TValue="string">
@@ -722,7 +775,9 @@
             <BitDropdownOption Text="Carrot" Value="@("v-car")" Icon="@BitIconInfo.Css("fa-solid fa-carrot")" />
             <BitDropdownOption Text="Lettuce" Value="@("v-let")" Icon="@BitIconInfo.Css("fa-solid fa-leaf")" />
         </BitDropdown>
+
         <br /><br />
+
         <BitDropdown Label="Item icons (Icon - Bootstrap Icons)"
                      Placeholder="Select an item"
                      TItem="BitDropdownOption<string>" TValue="string">
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
index 217a8350f2..6b386cf258 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/Dropdown/_BitDropdownOptionDemo.razor.samples.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.Dropdown;
 
 public partial class _BitDropdownOptionDemo
 {
@@ -702,7 +702,7 @@ private void HandleInvalidSubmit() { }
 </BitDropdown>
 <br />
 <div>Value: @comboBoxValueSample1</div>
-<br /><br />
+
 <BitDropdown @bind-Values=""comboBoxValues1""
              Combo 
              MultiSelect Responsive
@@ -862,6 +862,41 @@ private void HandleOnDynamicAdd(BitDropdownOption<string> item)
     }
 </BitDropdown>
 
+<BitDropdown Label=""Clear button icon (external)""
+             ShowClearButton
+             ClearButtonIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    @foreach (var item in basicItems)
+    {
+        <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
+    }
+</BitDropdown>
+
+<BitDropdown Label=""Chips remove icon (external)""
+             Chips
+             MultiSelect
+             ChipsRemoveIcon=""@BitIconInfo.Css(""bi bi-x-circle"")""
+             Placeholder=""Select items""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    @foreach (var item in basicItems)
+    {
+        <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
+    }
+</BitDropdown>
+
+<BitDropdown Label=""Search box icons (external)""
+             ShowSearchBox
+             SearchBoxIcon=""@BitIconInfo.Css(""fa-solid fa-magnifying-glass"")""
+             SearchBoxClearIcon=""@BitIconInfo.Css(""fa-solid fa-circle-xmark"")""
+             Placeholder=""Select an item""
+             TItem=""BitDropdownOption<string>"" TValue=""string"">
+    @foreach (var item in basicItems)
+    {
+        <BitDropdownOption ItemType=""item.ItemType"" Text=""@item.Text"" Value=""item.Value"" IsEnabled=""item.IsEnabled"" />
+    }
+</BitDropdown>
+
 <BitDropdown Label=""Item icons (IconName - Fluent UI)""
              Placeholder=""Select an item""
              TItem=""BitDropdownOption<string>"" TValue=""string"">
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Dropdown/BitDropdownTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Dropdown/BitDropdownTests.cs
index 7f3a002bed..0b067f5d12 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Dropdown/BitDropdownTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/Dropdown/BitDropdownTests.cs
@@ -1016,6 +1016,175 @@ public void BitDropdownCaretDownTemplateTest(string iconFragment)
         }
     }
 
+    [TestMethod,
+        DataRow("WindowsLogo"),
+        DataRow("ChevronUp"),
+        DataRow(null)
+    ]
+    public void BitDropdownChipsRemoveIconNameTest(string? iconName)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var items = BitDropdownTests.GetShortDropdownItems();
+        var component = RenderComponent<BitDropdown<BitDropdownItem<string>, string>>(parameters =>
+        {
+            parameters.Add(p => p.Chips, true);
+            parameters.Add(p => p.MultiSelect, true);
+            parameters.Add(p => p.Items, items);
+            parameters.Add(p => p.DefaultValues, new[] { "f-app" });
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ChipsRemoveIconName, iconName);
+            }
+        });
+
+        var chipIcon = component.Find(".bit-drp-chp > i");
+
+        if (iconName is not null)
+        {
+            Assert.IsTrue(chipIcon.ClassList.Contains($"bit-icon--{iconName}"));
+        }
+        else
+        {
+            Assert.IsTrue(chipIcon.ClassList.Contains("bit-icon--Cancel"));
+        }
+    }
+
+    [TestMethod,
+        DataRow("WindowsLogo"),
+        DataRow("ChevronUp"),
+        DataRow(null)
+    ]
+    public void BitDropdownClearButtonIconNameTest(string? iconName)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var items = BitDropdownTests.GetShortDropdownItems();
+        var component = RenderComponent<BitDropdown<BitDropdownItem<string>, string>>(parameters =>
+        {
+            parameters.Add(p => p.ShowClearButton, true);
+            parameters.Add(p => p.DefaultValue, "f-app");
+            parameters.Add(p => p.Items, items);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ClearButtonIconName, iconName);
+            }
+        });
+
+        var clearIcon = component.Find(".bit-drp-clr > i");
+
+        if (iconName is not null)
+        {
+            Assert.IsTrue(clearIcon.ClassList.Contains($"bit-icon--{iconName}"));
+        }
+        else
+        {
+            Assert.IsTrue(clearIcon.ClassList.Contains("bit-icon--Cancel"));
+        }
+    }
+
+    [TestMethod,
+        DataRow("WindowsLogo"),
+        DataRow("ChevronUp"),
+        DataRow(null)
+    ]
+    public void BitDropdownResponsiveCloseIconNameTest(string? iconName)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var component = RenderComponent<BitDropdown<BitDropdownItem<string>, string>>(parameters =>
+        {
+            parameters.Add(p => p.Responsive, true);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.ResponsiveCloseIconName, iconName);
+            }
+        });
+
+        var closeIcon = component.Find(".bit-drp-cls > span > i");
+
+        if (iconName is not null)
+        {
+            Assert.IsTrue(closeIcon.ClassList.Contains($"bit-icon--{iconName}"));
+        }
+        else
+        {
+            Assert.IsTrue(closeIcon.ClassList.Contains("bit-icon--Cancel"));
+        }
+    }
+
+    [TestMethod,
+        DataRow("WindowsLogo"),
+        DataRow("ChevronUp"),
+        DataRow(null)
+    ]
+    public void BitDropdownSearchBoxIconNameTest(string? iconName)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var items = BitDropdownTests.GetShortDropdownItems();
+        var component = RenderComponent<BitDropdown<BitDropdownItem<string>, string>>(parameters =>
+        {
+            parameters.Add(p => p.ShowSearchBox, true);
+            parameters.Add(p => p.Items, items);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.SearchBoxIconName, iconName);
+            }
+        });
+
+        var searchIcon = component.Find(".bit-drp-sic > i");
+
+        if (iconName is not null)
+        {
+            Assert.IsTrue(searchIcon.ClassList.Contains($"bit-icon--{iconName}"));
+        }
+        else
+        {
+            Assert.IsTrue(searchIcon.ClassList.Contains("bit-icon--Search"));
+        }
+    }
+
+    [TestMethod,
+        DataRow("WindowsLogo"),
+        DataRow("ChevronUp"),
+        DataRow(null)
+    ]
+    public void BitDropdownSearchBoxClearIconNameTest(string? iconName)
+    {
+        Context.JSInterop.Mode = JSRuntimeMode.Loose;
+
+        var items = BitDropdownTests.GetShortDropdownItems();
+        var component = RenderComponent<BitDropdown<BitDropdownItem<string>, string>>(parameters =>
+        {
+            parameters.Add(p => p.ShowSearchBox, true);
+            parameters.Add(p => p.Items, items);
+
+            if (iconName is not null)
+            {
+                parameters.Add(p => p.SearchBoxClearIconName, iconName);
+            }
+        });
+
+        component.Find(".bit-drp-wrp").Click();
+        component.Find(".bit-drp-sin").Input("app");
+
+        var clearIcon = component.Find(".bit-drp-sbc > span > i");
+
+        if (iconName is not null)
+        {
+            Assert.IsTrue(clearIcon.ClassList.Contains($"bit-icon--{iconName}"));
+        }
+        else
+        {
+            Assert.IsTrue(clearIcon.ClassList.Contains("bit-icon--Cancel"));
+        }
+    }
+
     [TestMethod,
         DataRow(BitDir.Rtl),
         DataRow(BitDir.Ltr)

From 994f6cf72d76ac33f8c83b7bde4732a1757c5c10 Mon Sep 17 00:00:00 2001
From: Saleh Yusefnejad <msynk@outlook.com>
Date: Sun, 22 Mar 2026 11:52:12 +0330
Subject: [PATCH 63/66] feat(blazorui): add missing new Icon parameter to
 BitFileInput #12205 (#12206)

---
 .../Inputs/FileInput/BitFileInput.razor       |   8 +-
 .../Inputs/FileInput/BitFileInput.razor.cs    |  21 ++-
 .../Inputs/FileInput/BitFileInput.scss        |  11 +-
 .../Inputs/FileInput/BitFileInputDemo.razor   |  43 ++++++
 .../FileInput/BitFileInputDemo.razor.cs       |  99 ++++++++++++--
 .../Inputs/FileInput/BitFileInputTests.cs     | 127 +++++++++++++++---
 6 files changed, 270 insertions(+), 39 deletions(-)

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor
index 827f25fe96..8d92063c89 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor
@@ -62,15 +62,17 @@
                                 </div>
                                 @if (file.IsValid is false)
                                 {
-                                    <div class="bit-fin-us">
+                                    <div class="bit-fin-msg">
                                         @file.Message
                                     </div>
                                 }
                             </div>
                             @if (ShowRemoveButton)
                             {
-                                <button class="bit-fin-usi" @onclick="() => RemoveFile(file)">
-                                    <i title="remove" class="bit-icon bit-icon--Delete" aria-hidden="true" />
+                                var removeIcon = BitIconInfo.From(RemoveButtonIcon, RemoveButtonIconName ?? "Delete");
+
+                                <button type="button" class="bit-fin-rbt" @onclick="() => RemoveFile(file)">
+                                    <i title="remove" class="@removeIcon?.GetCssClasses()" aria-hidden="true" />
                                 </button>
                             }
                         </div>
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor.cs
index 1b4e6db7a1..5f52e034ad 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.razor.cs
@@ -41,6 +41,12 @@ public partial class BitFileInput : BitComponentBase
     /// </summary>
     [Parameter] public bool AutoReset { get; set; }
 
+    /// <summary>
+    /// Custom Razor template for rendering individual file items in the file list.
+    /// Receives a <see cref="BitFileInputInfo"/> context for each file.
+    /// </summary>
+    [Parameter] public RenderFragment<BitFileInputInfo>? FileViewTemplate { get; set; }
+
     /// <summary>
     /// Whether to hide the file list that displays the selected files in the UI.
     /// </summary>
@@ -90,15 +96,20 @@ public partial class BitFileInput : BitComponentBase
     [Parameter] public EventCallback<BitFileInputInfo[]> OnChange { get; set; }
 
     /// <summary>
-    /// Whether to display a remove button next to each file in the file list, allowing individual file removal.
+    /// Gets or sets the remove button icon using custom CSS classes for external icon libraries.
+    /// Takes precedence over <see cref="RemoveButtonIconName"/> when both are set.
     /// </summary>
-    [Parameter] public bool ShowRemoveButton { get; set; }
+    [Parameter] public BitIconInfo? RemoveButtonIcon { get; set; }
 
     /// <summary>
-    /// Custom Razor template for rendering individual file items in the file list.
-    /// Receives a <see cref="BitFileInputInfo"/> context for each file.
+    /// Gets or sets the name of the remove button icon from the built-in Fluent UI icons.
     /// </summary>
-    [Parameter] public RenderFragment<BitFileInputInfo>? FileViewTemplate { get; set; }
+    [Parameter] public string? RemoveButtonIconName { get; set; }
+
+    /// <summary>
+    /// Whether to display a remove button next to each file in the file list, allowing individual file removal.
+    /// </summary>
+    [Parameter] public bool ShowRemoveButton { get; set; }
 
 
 
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.scss b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.scss
index 1950f7a867..b719b9bd04 100644
--- a/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.scss
+++ b/src/BlazorUI/Bit.BlazorUI/Components/Inputs/FileInput/BitFileInput.scss
@@ -82,7 +82,7 @@
         }
     }
 
-    .bit-fin-us {
+    .bit-fin-msg {
         width: 100%;
         overflow: hidden;
         white-space: nowrap;
@@ -95,7 +95,7 @@
 }
 
 .bit-fin-inv {
-    .bit-fin-us {
+    .bit-fin-msg {
         color: $clr-err;
     }
 }
@@ -137,7 +137,7 @@
     text-overflow: ellipsis;
 }
 
-.bit-fin-usi {
+.bit-fin-rbt {
     display: flex;
     cursor: pointer;
     color: $clr-fg-pri;
@@ -145,15 +145,16 @@
     align-items: center;
     height: spacing(4.5);
     justify-content: center;
+    background-color: $clr-bg-sec;
 
     @media (hover: hover) {
         &:hover {
-            background-color: $clr-bg-pri-hover;
+            background-color: $clr-bg-sec-hover;
         }
     }
 
     &:active {
-        background-color: $clr-bg-pri-active;
+        background-color: $clr-bg-sec-active;
     }
 
     i {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor
index 891cd52c62..a56c62f161 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor
@@ -178,4 +178,47 @@
         </div>
     </DemoExample>
 
+    <DemoExample Title="External Icons" RazorCode="@example11RazorCode" Id="example11">
+        <div>
+            Use icons from external libraries like FontAwesome and Bootstrap Icons with the <b>RemoveButtonIcon</b> parameter.
+        </div>
+
+        <br />
+        <br />
+
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
+
+        <div>FontAwesome:</div>
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@("fa-solid fa-trash-can")" />
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@BitIconInfo.Css("fa-solid fa-xmark")" />
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@BitIconInfo.Fa("solid trash")" />
+
+        <br /><br /><br /><br />
+
+        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" />
+
+        <div>Bootstrap:</div>
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@("bi bi-trash")" />
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@BitIconInfo.Css("bi bi-x-circle-fill")" />
+        <br />
+        <BitFileInput Label="Browse or drop a file"
+                      ShowRemoveButton
+                      RemoveButtonIcon="@BitIconInfo.Bi("trash3-fill")" />
+    </DemoExample>
+
 </DemoPage>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor.cs b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor.cs
index 9ad16ddc81..0be4d7838b 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor.cs
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Pages/Components/Inputs/FileInput/BitFileInputDemo.razor.cs
@@ -1,4 +1,4 @@
-namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.FileInput;
+namespace Bit.BlazorUI.Demo.Client.Core.Pages.Components.Inputs.FileInput;
 
 public partial class BitFileInputDemo
 {
@@ -33,6 +33,15 @@ public partial class BitFileInputDemo
             Description = "Whether the file input is automatically reset (cleared) before opening the file browser dialog, allowing the same file to be selected multiple times consecutively."
         },
         new()
+        {
+            Name = "FileViewTemplate",
+            Type = "RenderFragment<BitFileInputInfo>?",
+            DefaultValue = "null",
+            Description = "Custom Razor template for rendering individual file items in the file list. Receives a BitFileInputInfo context for each file.",
+            LinkType = LinkType.Link,
+            Href = "#file-input-info"
+        },
+        new()
         {
             Name = "HideFileList",
             Type = "bool",
@@ -97,21 +106,30 @@ public partial class BitFileInputDemo
             Href = "#file-input-info"
         },
         new()
+        {
+            Name = "RemoveButtonIcon",
+            Type = "BitIconInfo?",
+            DefaultValue = "null",
+            Description = "Gets or sets the remove button icon using custom CSS classes for external icon libraries. Takes precedence over RemoveButtonIconName when both are set.",
+            LinkType = LinkType.Link,
+            Href = "#bit-icon-info",
+        },
+        new()
+        {
+            Name = "RemoveButtonIconName",
+            Type = "string?",
+            DefaultValue = "Delete",
+            Description = "Gets or sets the name of the remove button icon from the built-in Fluent UI icons.",
+            LinkType = LinkType.Link,
+            Href = "https://blazorui.bitplatform.dev/iconography",
+        },
+        new()
         {
             Name = "ShowRemoveButton",
             Type = "bool",
             DefaultValue = "false",
             Description = "Whether to display a remove button next to each file in the file list, allowing individual file removal."
         },
-        new()
-        {
-            Name = "FileViewTemplate",
-            Type = "RenderFragment<BitFileInputInfo>?",
-            DefaultValue = "null",
-            Description = "Custom Razor template for rendering individual file items in the file list. Receives a BitFileInputInfo context for each file.",
-            LinkType = LinkType.Link,
-            Href = "#file-input-info"
-        }
     ];
 
     private readonly List<ComponentParameter> componentPublicMembers =
@@ -230,7 +248,36 @@ public partial class BitFileInputDemo
                    Description = "The file content as a byte array, populated by calling ReadContentAsync. This is null by default and only loaded on demand."
                }
             ]
-        }
+        },
+        new()
+        {
+            Id = "bit-icon-info",
+            Title = "BitIconInfo",
+            Parameters =
+            [
+               new()
+               {
+                   Name = "Name",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the name of the icon."
+               },
+               new()
+               {
+                   Name = "BaseClass",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the base CSS class for the icon. For built-in Fluent UI icons, this defaults to \"bit-icon\". For external icon libraries like FontAwesome, you might set this to \"fa\" or leave empty."
+               },
+               new()
+               {
+                   Name = "Prefix",
+                   Type = "string?",
+                   DefaultValue = "null",
+                   Description = "Gets or sets the CSS class prefix used before the icon name. For built-in Fluent UI icons, this defaults to \"bit-icon--\". For external icon libraries, you might set this to \"fa-\" or leave empty."
+               },
+            ]
+        },
     ];
 
 
@@ -490,4 +537,34 @@ Browse files
 <BitButton OnClick=""() => publicApiFileInput.Reset()"">Reset</BitButton>";
     private readonly string example10CsharpCode = @"
 private BitFileInput publicApiFileInput = default!;";
+
+    private readonly string example11RazorCode = @"
+<link rel=""stylesheet"" href=""https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@(""fa-solid fa-trash-can"")"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@BitIconInfo.Css(""fa-solid fa-xmark"")"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@BitIconInfo.Fa(""solid trash"")"" />
+
+
+<link rel=""stylesheet"" href=""https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@(""bi bi-trash"")"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@BitIconInfo.Css(""bi bi-x-circle-fill"")"" />
+
+<BitFileInput Label=""Browse or drop a file""
+              ShowRemoveButton
+              RemoveButtonIcon=""@BitIconInfo.Bi(""trash3-fill"")"" />";
 }
diff --git a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/FileInput/BitFileInputTests.cs b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/FileInput/BitFileInputTests.cs
index 7b27136baa..fe7e5b15e0 100644
--- a/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/FileInput/BitFileInputTests.cs
+++ b/src/BlazorUI/Tests/Bit.BlazorUI.Tests/Components/Inputs/FileInput/BitFileInputTests.cs
@@ -59,6 +59,7 @@ public void BitFileInputShouldSetMultipleAttribute(bool isMultiple)
         });
 
         var fileInput = component.Find(".bit-fin-fi");
+
         Assert.AreEqual(isMultiple, fileInput.HasAttribute("multiple"));
     }
 
@@ -76,6 +77,7 @@ public void BitFileInputShouldSetAcceptAttribute(string accept)
         });
 
         var fileInput = component.Find(".bit-fin-fi");
+
         Assert.AreEqual(accept, fileInput.GetAttribute("accept"));
     }
 
@@ -83,12 +85,14 @@ public void BitFileInputShouldSetAcceptAttribute(string accept)
     public void BitFileInputShouldUseAllowedExtensionsWhenAcceptIsNull()
     {
         var extensions = new[] { ".jpg", ".png", ".gif" };
+
         var component = RenderComponent<BitFileInput>(parameters =>
         {
             parameters.Add(p => p.AllowedExtensions, extensions);
         });
 
         var fileInput = component.Find(".bit-fin-fi");
+
         Assert.AreEqual(".jpg,.png,.gif", fileInput.GetAttribute("accept"));
     }
 
@@ -105,6 +109,7 @@ public void BitFileInputShouldDisplayLabel(string label)
         });
 
         var labelButton = component.Find(".bit-fin-lbl");
+
         Assert.AreEqual(label, labelButton.TextContent);
     }
 
@@ -114,6 +119,7 @@ public void BitFileInputShouldDisplayDefaultLabelWhenNotProvided()
         var component = RenderComponent<BitFileInput>();
 
         var labelButton = component.Find(".bit-fin-lbl");
+
         Assert.AreEqual("Browse", labelButton.TextContent);
     }
 
@@ -126,7 +132,8 @@ public void BitFileInputShouldHideLabelWhenHideLabelIsTrue()
         });
 
         var labels = component.FindAll(".bit-fin-lbl");
-        Assert.AreEqual(0, labels.Count);
+
+        Assert.IsEmpty(labels);
     }
 
     [TestMethod]
@@ -138,7 +145,7 @@ public void BitFileInputShouldSetAriaLabelledByWhenLabelIsVisible()
         var ariaLabelledBy = fileInput.GetAttribute("aria-labelledby");
         
         Assert.IsNotNull(ariaLabelledBy);
-        Assert.IsTrue(ariaLabelledBy.Contains("FileInput-"));
+        Assert.Contains("FileInput-", ariaLabelledBy);
     }
 
     [TestMethod]
@@ -163,7 +170,8 @@ public void BitFileInputShouldHideFileListWhenHideFileListIsTrue()
         });
 
         var fileList = component.FindAll(".bit-fin-fl");
-        Assert.AreEqual(0, fileList.Count);
+        
+        Assert.IsEmpty(fileList);
     }
 
     [TestMethod]
@@ -181,8 +189,8 @@ public void BitFileInputShouldGenerateUniqueInputId()
         Assert.IsNotNull(id1);
         Assert.IsNotNull(id2);
         Assert.AreNotEqual(id1, id2);
-        Assert.IsTrue(id1.StartsWith("FileInput-"));
-        Assert.IsTrue(id2.StartsWith("FileInput-"));
+        Assert.StartsWith("FileInput-", id1);
+        Assert.StartsWith("FileInput-", id2);
     }
 
     [TestMethod]
@@ -218,6 +226,7 @@ public void BitFileInputShouldRespectDir(BitDir dir)
     public void BitFileInputShouldApplyCustomClass()
     {
         var customClass = "custom-class";
+
         var component = RenderComponent<BitFileInput>(parameters =>
         {
             parameters.Add(p => p.Class, customClass);
@@ -232,6 +241,7 @@ public void BitFileInputShouldApplyCustomClass()
     public void BitFileInputShouldApplyCustomStyle()
     {
         var customStyle = "color: red;";
+
         var component = RenderComponent<BitFileInput>(parameters =>
         {
             parameters.Add(p => p.Style, customStyle);
@@ -246,6 +256,7 @@ public void BitFileInputShouldApplyCustomStyle()
     public void BitFileInputShouldApplyCustomId()
     {
         var customId = "custom-file-input";
+
         var component = RenderComponent<BitFileInput>(parameters =>
         {
             parameters.Add(p => p.Id, customId);
@@ -261,9 +272,91 @@ public void BitFileInputShouldNotShowRemoveButtonByDefault()
     {
         var component = RenderComponent<BitFileInput>();
 
-        var removeButtons = component.FindAll(".bit-fin-usi");
+        var removeButtons = component.FindAll(".bit-fin-rbt");
         
-        Assert.AreEqual(0, removeButtons.Count);
+        Assert.IsEmpty(removeButtons);
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitFileInputShouldUseDefaultDeleteIconForRemoveButton()
+    {
+        var component = RenderComponent<BitFileInput>(parameters =>
+        {
+            parameters.Add(p => p.ShowRemoveButton, true);
+        });
+
+        var removeButton = component.Find(".bit-fin-rbt");
+        var icon = removeButton.QuerySelector("i");
+
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon"));
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon--Delete"));
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitFileInputShouldRespectRemoveButtonIconWithBitIconInfo()
+    {
+        var iconInfo = new BitIconInfo("fa-solid fa-trash", baseClass: "", prefix: "");
+
+        var component = RenderComponent<BitFileInput>(parameters =>
+        {
+            parameters.Add(p => p.ShowRemoveButton, true);
+            parameters.Add(p => p.RemoveButtonIcon, iconInfo);
+        });
+
+        var removeButton = component.Find(".bit-fin-rbt");
+        var icon = removeButton.QuerySelector("i");
+
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-trash"));
+    }
+
+    [Ignore]
+    [TestMethod,
+        DataRow("Trash"),
+        DataRow("Delete"),
+        DataRow("Cancel")
+    ]
+    public void BitFileInputShouldRespectRemoveButtonIconName(string iconName)
+    {
+        var component = RenderComponent<BitFileInput>(parameters =>
+        {
+            parameters.Add(p => p.ShowRemoveButton, true);
+            parameters.Add(p => p.RemoveButtonIconName, iconName);
+        });
+
+        var removeButton = component.Find(".bit-fin-rbt");
+        var icon = removeButton.QuerySelector("i");
+
+        Assert.IsNotNull(icon);
+        Assert.IsTrue(icon.ClassList.Contains("bit-icon"));
+        Assert.IsTrue(icon.ClassList.Contains($"bit-icon--{iconName}"));
+    }
+
+    [Ignore]
+    [TestMethod]
+    public void BitFileInputRemoveButtonIconShouldTakePrecedenceOverIconName()
+    {
+        var iconInfo = new BitIconInfo("fa-solid fa-trash", baseClass: "", prefix: "");
+
+        var component = RenderComponent<BitFileInput>(parameters =>
+        {
+            parameters.Add(p => p.ShowRemoveButton, true);
+            parameters.Add(p => p.RemoveButtonIcon, iconInfo);
+            parameters.Add(p => p.RemoveButtonIconName, "Delete");
+        });
+
+        var removeButton = component.Find(".bit-fin-rbt");
+        var icon = removeButton.QuerySelector("i");
+
+        Assert.IsNotNull(icon);
+        // Icon (BitIconInfo) takes precedence over IconName
+        Assert.IsTrue(icon.ClassList.Contains("fa-solid"));
+        Assert.IsTrue(icon.ClassList.Contains("fa-trash"));
+        Assert.IsFalse(icon.ClassList.Contains("bit-icon--Delete"));
     }
 
     [TestMethod]
@@ -273,27 +366,29 @@ public void BitFileInputPublicPropertiesShouldBeAccessible()
         var instance = component.Instance;
 
         Assert.IsNotNull(instance.Files);
-        Assert.AreEqual(0, instance.Files.Count);
+        Assert.IsEmpty(instance.Files);
         Assert.IsNotNull(instance.InputId);
-        Assert.IsTrue(instance.InputId.StartsWith("FileInput-"));
+        Assert.StartsWith("FileInput-", instance.InputId);
     }
 
     [TestMethod]
     public void BitFileInputRemoveFileShouldClearAllFilesWhenNullProvided()
     {
         var component = RenderComponent<BitFileInput>();
+
         var instance = component.Instance;
 
         // RemoveFile with null should not throw
         instance.RemoveFile(null);
         
-        Assert.AreEqual(0, instance.Files.Count);
+        Assert.IsEmpty(instance.Files);
     }
 
     [TestMethod]
     public void BitFileInputShouldRenderLabelTemplateWhenProvided()
     {
         var templateText = "Custom Label Template";
+
         var component = RenderComponent<BitFileInput>(parameters =>
         {
             parameters.Add(p => p.LabelTemplate, builder =>
@@ -306,11 +401,13 @@ public void BitFileInputShouldRenderLabelTemplateWhenProvided()
         });
 
         var customLabel = component.Find(".custom-label");
+
         Assert.AreEqual(templateText, customLabel.TextContent);
         
         // Original label should not be rendered
         var originalLabels = component.FindAll(".bit-fin-lbl");
-        Assert.AreEqual(0, originalLabels.Count);
+
+        Assert.IsEmpty(originalLabels);
     }
 
     [TestMethod]
@@ -321,7 +418,7 @@ public void BitFileInputShouldRenderEmptyFileListWhenNoFilesSelected()
         var fileList = component.FindAll(".bit-fin-fl");
         
         // File list div should be rendered but empty when no files are selected
-        Assert.AreEqual(1, fileList.Count);
+        Assert.HasCount(1, fileList);
         Assert.AreEqual(0, fileList[0].ChildElementCount);
     }
 
@@ -380,12 +477,12 @@ public void BitFileInputShouldApplyVisibilityStyle(BitVisibility visibility, str
         
         if (string.IsNullOrEmpty(expectedStyle))
         {
-            Assert.IsFalse(style.Contains("visibility:hidden"));
-            Assert.IsFalse(style.Contains("display:none"));
+            Assert.DoesNotContain("visibility:hidden", style);
+            Assert.DoesNotContain("display:none", style);
         }
         else
         {
-            Assert.IsTrue(style.Contains(expectedStyle));
+            Assert.Contains(expectedStyle, style);
         }
     }
 }

From 32364c78992ad712f1db4443f7714ce2c44cff01 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Tue, 24 Mar 2026 04:33:56 -0700
Subject: [PATCH 64/66] feat(templates): refactor bit Boilerplate app.js build
 steps #12207 (#12208)

---
 ...ipt, Build Process & JavaScript Interop.md | 38 +++++++++++--------
 .../Boilerplate.Client.Core.csproj            |  4 +-
 .../Boilerplate.Client.Core/tsconfig.json     | 14 +++++--
 3 files changed, 36 insertions(+), 20 deletions(-)

diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/11- TypeScript, Build Process & JavaScript Interop.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/11- TypeScript, Build Process & JavaScript Interop.md
index 64c625f1b9..cdce35ee86 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/11- TypeScript, Build Process & JavaScript Interop.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/11- TypeScript, Build Process & JavaScript Interop.md	
@@ -4,7 +4,8 @@ Welcome to Stage 11! In this stage, you'll learn how the project integrates Type
 
 ## Overview
 
-This project uses **TypeScript** for type-safe JavaScript development, along with automated build processes that compile TypeScript to JavaScript and SCSS to CSS during the build pipeline. You'll also learn how to add new npm packages and call JavaScript functions from your C# Blazor components.
+This project uses a **split pipeline** for TypeScript: the TypeScript compiler (`tsc`) performs **type-checking only** (with `noEmit: true`), while **esbuild** handles bundling directly from `.ts` source files into a single `app.js`.
+SCSS is compiled to CSS during the same build pipeline. You'll also learn how to add new npm packages and call JavaScript functions from your C# Blazor components.
 
 ---
 
@@ -17,11 +18,16 @@ This project uses **TypeScript** for type-safe JavaScript development, along wit
 
 ```jsonc
 {
-    "compileOnSave": true,
+    /* Note for Developers:
+        This project uses a split pipeline. TypeScript performs validation without 
+        generating files (noEmit: true), while the actual app.js is bundled by esbuild as part 
+        of the MSBuild process defined in the Boilerplate.Client.Core.csproj file's `BuildJavaScript` target.
+    */
     "compilerOptions": {
         "strict": true,
         "target": "ES2019",
         "module": "es2015",
+        "noEmit": true,
         // ...
     }
 }
@@ -29,12 +35,12 @@ This project uses **TypeScript** for type-safe JavaScript development, along wit
 
 ### Key Settings Explained
 
+- **`noEmit: true`**: TypeScript only performs type-checking and does **not** generate any `.js` output files. The actual bundling is handled by esbuild.
 - **`strict: true`**: Enables all strict type-checking options for better code quality
-- **`target: "ES2019"`**: Compiles TypeScript to ES2019 JavaScript
+- **`target: "ES2019"`**: Sets the type-checking language level to ES2019
 - **`module: "es2015"`**: Uses ES2015 module system (import/export)
-- **`noImplicitAny: true`**: Requires explicit type annotations, preventing implicit `any` types
-- **`lib: ["DOM", "ESNext"]`**: Includes DOM and modern JavaScript API type definitions
-- **`moduleResolution: "node"`**: Uses Node.js-style module resolution
+- **`lib: ["DOM", "DOM.Iterable", "ES2019"]`**: Includes DOM, DOM Iterable, and ES2019 API type definitions
+- **`moduleResolution: "bundler"`**: Uses bundler-style module resolution (compatible with esbuild)
 
 ---
 
@@ -57,8 +63,8 @@ This project uses **TypeScript** for type-safe JavaScript development, along wit
 
 ### What Each Package Does
 
-- **`typescript`**: The TypeScript compiler (`tsc`) that transforms `.ts` files to `.js`
-- **`esbuild`**: Ultra-fast JavaScript bundler that combines all JavaScript modules into a single minified `app.js` file
+- **`typescript`**: The TypeScript compiler (`tsc`) used for **type-checking only** (`noEmit: true`); it does not produce `.js` output
+- **`esbuild`**: Ultra-fast JavaScript bundler/build tool that transpiles TypeScript and combines all `.ts` modules directly into a single `app.js` file; it does not perform type-checking (that is handled by `tsc`)
 - **`sass`**: SCSS/Sass compiler that transforms `.scss` files to `.css`
 
 ---
@@ -89,7 +95,7 @@ The `.csproj` file defines custom MSBuild targets that run automatically during
     ↓
 3. InstallNodejsDependencies
     ↓
-4. BuildJavaScript (TypeScript → JavaScript → Bundle)
+4. BuildJavaScript (TypeScript type-check → esbuild bundles .ts → app.js)
     ↓
 5. BuildCssFiles (SCSS → CSS)
 ```
@@ -113,19 +119,21 @@ The `.csproj` file defines custom MSBuild targets that run automatically during
 <Target Name="BuildJavaScript" Inputs="@(TypeScriptFiles);tsconfig.json;package.json" Outputs="wwwroot\scripts\app.js">
     <Exec Command="node_modules/.bin/tsc" StandardOutputImportance="high" StandardErrorImportance="high" />
     <Exec Condition=" '$(Environment)' == 'Development' " 
-          Command="node_modules/.bin/esbuild Scripts/index.js --bundle --outfile=wwwroot/scripts/app.js" 
+          Command="node_modules/.bin/esbuild Scripts/index.ts --bundle --target=safari15,firefox100,chrome95 --outfile=wwwroot/scripts/app.js" 
           StandardOutputImportance="high" StandardErrorImportance="high" />
     <Exec Condition=" '$(Environment)' != 'Development' " 
-          Command="node_modules/.bin/esbuild Scripts/index.js --bundle --outfile=wwwroot/scripts/app.js --minify" 
+          Command="node_modules/.bin/esbuild Scripts/index.ts --bundle --target=safari15,firefox100,chrome95 --outfile=wwwroot/scripts/app.js --minify" 
           StandardOutputImportance="high" StandardErrorImportance="high" />
 </Target>
 ```
 
 **What it does:**
-1. **TypeScript Compilation**: Runs `tsc` (TypeScript compiler) to convert all `.ts` files to `.js` files
-2. **Bundling (Development)**: Uses `esbuild` to bundle all JavaScript modules into a single `wwwroot/scripts/app.js` file
+1. **TypeScript Type-Checking**: Runs `tsc` to validate types only (`noEmit: true` in `tsconfig.json` means no `.js` files are generated)
+2. **Bundling (Development)**: Uses `esbuild` to compile and bundle all TypeScript modules **directly from `.ts` source files** into a single `wwwroot/scripts/app.js` file, targeting Safari 15, Firefox 100, and Chrome 95
 3. **Bundling + Minification (Production/Staging)**: Same as above, but with `--minify` flag for smaller file size
 
+> **Note:** The `--target` flag tells esbuild which browser versions to support, ensuring the output JavaScript is compatible with those environments.
+
 **Incremental Build Optimization:**
 - Only rebuilds when TypeScript files, `tsconfig.json`, or `package.json` change
 - Skips compilation if `app.js` is up-to-date
@@ -327,8 +335,8 @@ dotnet build
 
 The build process will:
 1. Install the new `uuid` package (via `npm install`)
-2. Compile `App.ts` to JavaScript (via `tsc`)
-3. Bundle all JavaScript including `uuid` into `app.js` (via `esbuild`)
+2. Type-check all TypeScript files (via `tsc` with `noEmit`)
+3. Bundle all TypeScript including `uuid` directly into `app.js` (via `esbuild` from `.ts` sources)
 
 ---
 
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Boilerplate.Client.Core.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Boilerplate.Client.Core.csproj
index 058b387fb8..6e52d16394 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Boilerplate.Client.Core.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/Boilerplate.Client.Core.csproj
@@ -68,8 +68,8 @@
 
     <Target Name="BuildJavaScript" Inputs="@(TypeScriptFiles);tsconfig.json;package.json" Outputs="wwwroot\scripts\app.js">
         <Exec Command="node_modules/.bin/tsc" StandardOutputImportance="high" StandardErrorImportance="high" />
-        <Exec Condition=" '$(Environment)' == 'Development' " Command="node_modules/.bin/esbuild Scripts/index.js --bundle --outfile=wwwroot/scripts/app.js" StandardOutputImportance="high" StandardErrorImportance="high" />
-        <Exec Condition=" '$(Environment)' != 'Development' " Command="node_modules/.bin/esbuild Scripts/index.js --bundle --outfile=wwwroot/scripts/app.js --minify" StandardOutputImportance="high" StandardErrorImportance="high" />
+        <Exec Condition=" '$(Environment)' == 'Development' " Command="node_modules/.bin/esbuild Scripts/index.ts --bundle --target=safari15,firefox100,chrome95 --outfile=wwwroot/scripts/app.js" StandardOutputImportance="high" StandardErrorImportance="high" />
+        <Exec Condition=" '$(Environment)' != 'Development' " Command="node_modules/.bin/esbuild Scripts/index.ts --bundle --target=safari15,firefox100,chrome95 --outfile=wwwroot/scripts/app.js --minify" StandardOutputImportance="high" StandardErrorImportance="high" />
     </Target>
 
     <Target Name="BuildCssFiles">
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
index 426784625a..713cbd8dcb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/tsconfig.json
@@ -1,16 +1,24 @@
 {
-    "compileOnSave": true,
+    /* Note for Developers:
+        This project uses a split pipeline. TypeScript performs validation without 
+        generating files (noEmit: true), while the actual app.js is bundled by esbuild as part 
+        of the MSBuild process defined in the Boilerplate.Client.Core.csproj file's `BuildJavaScript` target.
+        For more information, check out .docs/11- TypeScript, Build Process & JavaScript Interop.md
+    */
     "compilerOptions": {
         "strict": true,
         "target": "ES2019",
         "module": "ESNext",
         "moduleResolution": "bundler",
         "verbatimModuleSyntax": true,
+        "isolatedModules": true,
+        "useDefineForClassFields": true,
         "resolveJsonModule": true,
-        "lib": [ "DOM", "ESNext" ],
+        "lib": [ "DOM", "DOM.Iterable", "ES2019" ],
         "esModuleInterop": true,
         "skipLibCheck": true,
-        "forceConsistentCasingInFileNames": true
+        "forceConsistentCasingInFileNames": true,
+        "noEmit": true
     },
     "include": [ "Scripts" ],
     "exclude": [ "node_modules" ]

From 67c3e959ff2803138abcb29b40abeff24df1f9eb Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 25 Mar 2026 14:51:00 +0100
Subject: [PATCH 65/66] feat(deps): update project dependencies #12211 (#12212)

---
 .../Bit.BlazorUI.Extras.csproj                |   2 +-
 .../Bit.BlazorUI.Extras/package-lock.json     | 216 +++++++++---------
 src/BlazorUI/Bit.BlazorUI.Extras/package.json |   2 +-
 src/BlazorUI/Bit.BlazorUI/package-lock.json   | 216 +++++++++---------
 src/BlazorUI/Bit.BlazorUI/package.json        |   2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |   2 +-
 .../package-lock.json                         | 216 +++++++++---------
 .../package.json                              |   2 +-
 src/Bswup/Bit.Bswup/package-lock.json         | 216 +++++++++---------
 src/Bswup/Bit.Bswup/package.json              |   2 +-
 src/Butil/Bit.Butil/package-lock.json         | 216 +++++++++---------
 src/Butil/Bit.Butil/package.json              |   2 +-
 ...ndency Injection & Service Registration.md |   1 -
 .../Boilerplate.Client.Core/package-lock.json |   8 +-
 .../Boilerplate.Client.Core/package.json      |   2 +-
 .../Platforms/Android/MainActivity.cs         |   4 +-
 .../src/Directory.Packages.props              |  31 ++-
 .../Program.Services.cs                       |  13 +-
 .../Boilerplate.Server.Api/appsettings.json   |  37 +--
 .../Boilerplate.Server.AppHost.csproj         |   3 +-
 .../Boilerplate.Server.Web/appsettings.json   |   2 +-
 .../ISharedServiceCollectionExtensions.cs     |   2 +-
 .../Infrastructure/Services/AppMemoryCache.cs |  41 ++++
 .../src/Shared/appsettings.json               |   1 +
 .../package-lock.json                         | 214 ++++++++---------
 .../Bit.Websites.Careers.Client/package.json  |   2 +-
 .../package-lock.json                         | 216 +++++++++---------
 .../Bit.Websites.Platform.Client/package.json |   2 +-
 .../package-lock.json                         | 216 +++++++++---------
 .../Bit.Websites.Sales.Client/package.json    |   2 +-
 30 files changed, 975 insertions(+), 916 deletions(-)
 create mode 100644 src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppMemoryCache.cs

diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
index 2825ad2662..c61cb73f6b 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/Bit.BlazorUI.Extras.csproj
@@ -25,7 +25,7 @@
     <ItemGroup>
         <FrameworkReference Include="Microsoft.AspNetCore.App" PrivateAssets="all" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" PrivateAssets="all" />
-        <PackageReference Include="Jint" Version="4.6.3" PrivateAssets="all" />
+        <PackageReference Include="Jint" Version="4.6.4" PrivateAssets="all" />
     </ItemGroup>
 
     <ItemGroup>
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
index 09ec86de9c..fd006347ba 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -784,9 +784,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +797,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/BlazorUI/Bit.BlazorUI.Extras/package.json b/src/BlazorUI/Bit.BlazorUI.Extras/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/BlazorUI/Bit.BlazorUI.Extras/package.json
+++ b/src/BlazorUI/Bit.BlazorUI.Extras/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/BlazorUI/Bit.BlazorUI/package-lock.json b/src/BlazorUI/Bit.BlazorUI/package-lock.json
index 68ed7c5479..5a2ece2f13 100644
--- a/src/BlazorUI/Bit.BlazorUI/package-lock.json
+++ b/src/BlazorUI/Bit.BlazorUI/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -784,9 +784,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +797,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/BlazorUI/Bit.BlazorUI/package.json b/src/BlazorUI/Bit.BlazorUI/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/BlazorUI/Bit.BlazorUI/package.json
+++ b/src/BlazorUI/Bit.BlazorUI/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 22c0394820..931b81ce77 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -19,7 +19,7 @@
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Jint" Version="4.6.3" />
+        <PackageReference Include="Jint" Version="4.6.4" />
         <PackageReference Include="Microsoft.AspNetCore.OData" Version="9.4.1" />
         <PackageReference Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageReference Include="MimeTypeMapOfficial" Version="1.0.17" />
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
index e481752b48..d6a9661b8f 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -784,9 +784,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +797,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/Bswup/Bit.Bswup/package-lock.json b/src/Bswup/Bit.Bswup/package-lock.json
index 699a56805b..9222013ed1 100644
--- a/src/Bswup/Bit.Bswup/package-lock.json
+++ b/src/Bswup/Bit.Bswup/package-lock.json
@@ -5,14 +5,14 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -27,9 +27,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -44,9 +44,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -61,9 +61,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -78,9 +78,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -95,9 +95,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -112,9 +112,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -129,9 +129,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -146,9 +146,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -163,9 +163,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -180,9 +180,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -197,9 +197,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -214,9 +214,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -231,9 +231,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -248,9 +248,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -265,9 +265,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -282,9 +282,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -299,9 +299,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -316,9 +316,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -333,9 +333,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -350,9 +350,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -367,9 +367,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -384,9 +384,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -401,9 +401,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -418,9 +418,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -435,9 +435,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -452,9 +452,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -465,32 +465,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/typescript": {
diff --git a/src/Bswup/Bit.Bswup/package.json b/src/Bswup/Bit.Bswup/package.json
index fc772b858b..c0cd3c4220 100644
--- a/src/Bswup/Bit.Bswup/package.json
+++ b/src/Bswup/Bit.Bswup/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Butil/Bit.Butil/package-lock.json b/src/Butil/Bit.Butil/package-lock.json
index 61d51ddac0..5f579e3175 100644
--- a/src/Butil/Bit.Butil/package-lock.json
+++ b/src/Butil/Bit.Butil/package-lock.json
@@ -5,14 +5,14 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -27,9 +27,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -44,9 +44,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -61,9 +61,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -78,9 +78,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -95,9 +95,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -112,9 +112,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -129,9 +129,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -146,9 +146,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -163,9 +163,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -180,9 +180,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -197,9 +197,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -214,9 +214,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -231,9 +231,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -248,9 +248,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -265,9 +265,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -282,9 +282,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -299,9 +299,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -316,9 +316,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -333,9 +333,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -350,9 +350,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -367,9 +367,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -384,9 +384,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -401,9 +401,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -418,9 +418,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -435,9 +435,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -452,9 +452,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -465,32 +465,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/typescript": {
diff --git a/src/Butil/Bit.Butil/package.json b/src/Butil/Bit.Butil/package.json
index fc772b858b..c0cd3c4220 100644
--- a/src/Butil/Bit.Butil/package.json
+++ b/src/Butil/Bit.Butil/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "typescript": "5.9.3"
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/09- Dependency Injection & Service Registration.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/09- Dependency Injection & Service Registration.md
index 25b0a95428..df448cc42e 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/09- Dependency Injection & Service Registration.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/09- Dependency Injection & Service Registration.md	
@@ -28,7 +28,6 @@ Service registration is organized through `*ServiceCollectionExtensions.cs` and
    services.AddScoped<IDateTimeProvider, DateTimeProvider>();
    services.AddSingleton<SharedSettings>();
    services.AddLocalization();
-   services.AddMemoryCache();
    ```
 
 2. **`IClientCoreServiceCollectionExtensions.cs`** ([`src/Client/Boilerplate.Client.Core/Extensions/`](/src/Client/Boilerplate.Client.Core/Extensions/IClientCoreServiceCollectionExtensions.cs))
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
index 927c209705..d239ba6641 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package-lock.json
@@ -10,7 +10,7 @@
             "devDependencies": {
                 "esbuild": "0.27.4",
                 "sass": "1.98.0",
-                "typescript": "5.9.3"
+                "typescript": "6.0.2"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
@@ -997,9 +997,9 @@
             }
         },
         "node_modules/typescript": {
-            "version": "5.9.3",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
-            "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
+            "version": "6.0.2",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-6.0.2.tgz",
+            "integrity": "sha512-bGdAIrZ0wiGDo5l8c++HWtbaNCWTS4UTv7RaTH/ThVIgjkveJt83m74bBHMJkuCbslY8ixgLBVZJIOiQlQTjfQ==",
             "dev": true,
             "license": "Apache-2.0",
             "bin": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
index f14fa27b95..41becf60d8 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Core/package.json
@@ -5,6 +5,6 @@
     "devDependencies": {
         "esbuild": "0.27.4",
         "sass": "1.98.0",
-        "typescript": "5.9.3"
+        "typescript": "6.0.2"
     }
 }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Platforms/Android/MainActivity.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Platforms/Android/MainActivity.cs
index 76414fafa4..ede578ae74 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Platforms/Android/MainActivity.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Maui/Platforms/Android/MainActivity.cs
@@ -6,7 +6,7 @@
 using Android.Content.PM;
 //#if (notification == true)
 using Android.Gms.Tasks;
-using Plugin.LocalNotification;
+using Plugin.LocalNotification.Core.Models;
 //#endif
 using Boilerplate.Client.Core.Components;
 
@@ -82,7 +82,7 @@ private static void HandlePushNotificationTap(Intent? intent)
         if (intent is null)
             return;
 
-        var dataString = intent.GetStringExtra(LocalNotificationCenter.ReturnRequest);
+        var dataString = intent.GetStringExtra(RequestConstants.ReturnRequest);
         string? pageUrl = null;
         if (string.IsNullOrEmpty(dataString) is false)
         {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index c4be60a486..91ffda97ff 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -50,7 +50,7 @@
         <PackageVersion Include="OpenTelemetry.Resources.ProcessRuntime" Version="1.15.0-beta.1" />
         <PackageVersion Include="Oscore.Maui.AppStoreInfo" Version="1.3.1" />
         <PackageVersion Include="Plugin.Maui.AppRating" Version="1.2.3" />
-        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.11" />
+        <PackageVersion Include="Scalar.AspNetCore" Version="2.13.13" />
         <PackageVersion Include="Velopack" Version="0.0.1298" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Configuration" Version="10.0.5" />
         <PackageVersion Include="Microsoft.Extensions.Logging.Debug" Version="10.0.5" />
@@ -59,19 +59,18 @@
         <PackageVersion Include="Microsoft.Extensions.Logging.EventSource" Version="10.0.5" />
         <!--/+:msbuild-conditional:noEmit -->
         <PackageVersion Condition="'$(signalR)' == 'true' OR '$(signalR)' == ''" Include="ModelContextProtocol.AspNetCore" Version="1.1.0" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.1.3-preview.1.26166.8" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.1.3" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Maui" Version="13.2.0-preview.1.26170.3" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.Testing" Version="13.2.0" />
         <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="CommunityToolkit.Aspire.Hosting.MailPit" Version="13.1.1" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.1.3" />
-        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.AppHost" Version="13.1.3" />
+        <PackageVersion Condition=" '$(aspire)' == 'true' OR '$(aspire)' == '' " Include="Aspire.Hosting.DevTunnels" Version="13.2.0" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'Sqlite' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.Sqlite" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.1.3" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Aspire.Hosting.SqlServer" Version="13.2.0" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="CommunityToolkit.Aspire.Hosting.SqlServer.Extensions" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.1.3" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.1.3" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.1.3" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Aspire.Hosting.PostgreSQL" Version="13.2.0" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(database)' == 'MySql' OR '$(database)' == '') " Include="Aspire.Hosting.MySql" Version="13.2.0" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'AzureBlobStorage' OR '$(filesStorage)' == '') " Include="Aspire.Hosting.Azure.Storage" Version="13.2.0" />
         <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '') AND ('$(filesStorage)' == 'S3' OR '$(filesStorage)' == '') " Include="CommunityToolkit.Aspire.Hosting.Minio" Version="13.1.1" />
-        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.1.3-preview.1.26166.8" />
+        <PackageVersion Condition=" ('$(aspire)' == 'true' OR '$(aspire)' == '')" Include="Aspire.Hosting.Keycloak" Version="13.2.0-preview.1.26170.3" />
         <PackageVersion Include="Microsoft.Extensions.Http.Resilience" Version="10.4.0" />
         <PackageVersion Include="Microsoft.Extensions.ServiceDiscovery" Version="10.4.0" />
         <PackageVersion Include="OpenTelemetry.Exporter.OpenTelemetryProtocol" Version="1.15.0" />
@@ -85,7 +84,7 @@
         <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Extensions.Logging" Version="6.2.0" />
         <PackageVersion Condition=" '$(sentry)' == 'true' OR '$(sentry)' == '' " Include="Sentry.Maui" Version="6.2.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Xamarin.Firebase.Messaging" Version="125.0.1.2" />
-        <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Plugin.LocalNotification" Version="13.0.0" />
+        <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="Plugin.LocalNotification" Version="14.0.0" />
         <PackageVersion Condition=" '$(notification)' == 'true' OR '$(notification)' == ''" Include="AdsPush" Version="2.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
@@ -97,8 +96,8 @@
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI" Version="10.4.1" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.OpenAI" Version="10.4.1" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Extensions.AI.AzureAIInference" Version="10.0.0-preview.1.25559.3" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.73.0-preview" />
-        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.73.0" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Connectors.HuggingFace" Version="1.74.0-preview" />
+        <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.SemanticKernel.Core" Version="1.74.0" />
         <PackageVersion Condition=" ('$(signalR)' == 'true' OR '$(signalR)' == '') OR ('$(database)' == 'PostgreSQL' OR '$(database)' == '') OR ('$(database)' == 'SqlServer' OR '$(database)' == '') " Include="Microsoft.Agents.AI" Version="1.0.0-rc4" />
         <PackageVersion Condition=" ('$(database)' == 'PostgreSQL' OR '$(database)' == '') " Include="Pgvector.EntityFrameworkCore" Version="0.3.0" />
         <PackageVersion Condition="'$(module)' == 'Admin' OR '$(module)' == ''" Include="Newtonsoft.Json" Version="13.0.4" />
@@ -111,8 +110,8 @@
         <PackageVersion Condition=" '$(filesStorage)' == 'S3' OR '$(filesStorage)' == '' " Include="FluentStorage.AWS" Version="6.0.2" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.AspNetCore" Version="1.4.0" />
         <PackageVersion Condition=" '$(appInsights)' == 'true' OR '$(appInsights)' == '' " Include="Azure.Monitor.OpenTelemetry.Profiler" Version="1.0.0-beta8" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.1.3" />
-        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.1.3" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.Hosting.Redis" Version="13.2.0" />
+        <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Aspire.StackExchange.Redis" Version="13.2.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="ZiggyCreatures.FusionCache.Backplane.StackExchangeRedis" Version="2.6.0" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="DistributedLock.Redis" Version="1.1.1" />
         <PackageVersion Condition="'$(redis)' == 'true' OR '$(redis)' == ''" Include="Hangfire.Redis.StackExchange" Version="1.12.0" />
@@ -132,7 +131,7 @@
         <PackageVersion Include="Microsoft.EntityFrameworkCore.Sqlite" Version="10.0.5" />
         <PackageVersion Include="Microsoft.EntityFrameworkCore.Tools" Version="10.0.5" />
         <PackageVersion Include="Swashbuckle.AspNetCore" Version="10.0.0" />
-        <PackageVersion Include="Microsoft.Identity.Web" Version="4.5.0" />
+        <PackageVersion Include="Microsoft.Identity.Web" Version="4.6.0" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Google" Version="10.0.5" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Twitter" Version="10.0.5" />
         <PackageVersion Include="Microsoft.AspNetCore.Authentication.Facebook" Version="10.0.5" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
index 946fc4a0b2..d3c8e6705b 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/Program.Services.cs
@@ -139,13 +139,15 @@ public static void AddServerApiProjectServices(this WebApplicationBuilder builde
         //#endif
 
         //#if (notification == true)
-        services.AddSingleton(_ =>
+        services.AddHttpClient("APNS"); // Apple Push Notification Service
+        services.AddHttpClient("Vapid"); // Web Push
+        services.AddSingleton(sp =>
         {
             var adsPushSenderBuilder = new AdsPushSenderBuilder();
 
             if (string.IsNullOrEmpty(appSettings.AdsPushAPNS?.P8PrivateKey) is false)
             {
-                adsPushSenderBuilder = adsPushSenderBuilder.ConfigureApns(appSettings.AdsPushAPNS, null);
+                adsPushSenderBuilder = adsPushSenderBuilder.ConfigureApns(appSettings.AdsPushAPNS, sp.GetRequiredService<IHttpClientFactory>().CreateClient("APNS"));
             }
 
             if (string.IsNullOrEmpty(appSettings.AdsPushFirebase?.PrivateKey) is false)
@@ -157,7 +159,12 @@ public static void AddServerApiProjectServices(this WebApplicationBuilder builde
 
             if (string.IsNullOrEmpty(appSettings.AdsPushVapid?.PrivateKey) is false)
             {
-                adsPushSenderBuilder = adsPushSenderBuilder.ConfigureVapid(appSettings.AdsPushVapid, null);
+                if (string.IsNullOrEmpty(appSettings.AdsPushVapid.PublicKey))
+                    throw new InvalidOperationException("VAPID public key is required");
+                if (string.IsNullOrEmpty(appSettings.AdsPushVapid.Subject))
+                    throw new InvalidOperationException("VAPID subject is required"); // While it would work on Android, Windows, Linux, Apple requires subject, so we enforce it for all platforms to avoid confusion and potential issues.
+
+                adsPushSenderBuilder = adsPushSenderBuilder.ConfigureVapid(appSettings.AdsPushVapid, sp.GetRequiredService<IHttpClientFactory>().CreateClient("Vapid"));
             }
 
             return adsPushSenderBuilder
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
index f1cd2bb0f9..1d802d3d06 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Api/appsettings.json
@@ -1,7 +1,7 @@
 {
     "ConnectionStrings": {
         //#if (aspire == true)
-        "Aspire__Comment": "Running Boilerplate.Server.AppHost `overrides` the following connection strings at runtime.",
+        "Aspire_Comment": "Running Boilerplate.Server.AppHost `overrides` the following connection strings at runtime.",
         //#endif
         //#if (database == "SqlServer")
         "mssqldb": "Data Source=(localdb)\\mssqllocaldb; Initial Catalog=BoilerplateDb;Integrated Security=true;Application Name=Boilerplate;TrustServerCertificate=True;",
@@ -15,13 +15,14 @@
         //#endif
         //#if (filesStorage == "AzureBlobStorage")
         "azureblobstorage": "UseDevelopmentStorage=true",
+        "azureblobstorage_sample": "DefaultEndpointsProtocol=https;AccountName=accountName;AccountKey=accountKey;EndpointSuffix=core.windows.net",
         //#elif (filesStorage == "S3")
         "s3": "Endpoint=http://localhost:9000;AccessKey=minioadmin;SecretKey=minioadmin;",
-        "s3__MinIOSample": "Endpoint=http://localhost:9000;AccessKey=minioadmin;SecretKey=minioadmin;",
-        "s3__ContaboSample": "Endpoint=https://eu2.contabostorage.com;BucketName=files;Region=eu2;AccessKey=XXX;SecretKey=XXX;",
-        "s3__HetznerSample": "Endpoint=https://hel1.your-objectstorage.com;BucketName=files;Region=eu-central;AccessKey=XXX;SecretKey=XXX;",
-        "s3__DigitalOceanSample": "Endpoint=https://ams3.digitaloceanspaces.com;BucketName=myBucketName;Region=ams3;AccessKey=XXX;SecretKey=XXX;",
-        "s3__CloudflareR2Sample": "Not supported yet: https://github.com/robinrodricks/FluentStorage/issues/114",
+        "s3_MinIOSample": "Endpoint=http://localhost:9000;AccessKey=minioadmin;SecretKey=minioadmin;",
+        "s3_ContaboSample": "Endpoint=https://eu2.contabostorage.com;BucketName=files;Region=eu2;AccessKey=XXX;SecretKey=XXX;",
+        "s3_HetznerSample": "Endpoint=https://hel1.your-objectstorage.com;BucketName=files;Region=eu-central;AccessKey=XXX;SecretKey=XXX;",
+        "s3_DigitalOceanSample": "Endpoint=https://ams3.digitaloceanspaces.com;BucketName=myBucketName;Region=ams3;AccessKey=XXX;SecretKey=XXX;",
+        "s3_CloudflareR2Sample": "Not supported yet: https://github.com/robinrodricks/FluentStorage/issues/114",
         //#endif
         //#if (redis == true)
         "redis-cache": "localhost:6379",
@@ -71,7 +72,7 @@
         "HuggingFace": {
             "EmbeddingApiKey": null,
             "EmbeddingEndpoint": "http://localhost:7000",
-            "EmbeddingModel__Comment": "Run locally using `docker run -d --restart unless-stopped --name tei-embedding -p 7000:80 -v tei_data:/data ghcr.io/huggingface/text-embeddings-inference:cpu-1.8 --model-id BAAI/bge-small-en-v1.5`"
+            "EmbeddingModel_Comment": "Run locally using `docker run -d --restart unless-stopped --name tei-embedding -p 7000:80 -v tei_data:/data ghcr.io/huggingface/text-embeddings-inference:cpu-1.8 --model-id BAAI/bge-small-en-v1.5`"
         }
     },
     //#endif
@@ -102,7 +103,7 @@
     "Email": {
         "DefaultFromEmail": "DoNotReply@bitplatform.dev"
     },
-    "Email__Comment": "You can also use https://ethereal.email/create for testing purposes.",
+    "Email_Comment": "You can also use https://ethereal.email/create for testing purposes.",
     "Sms": {
         "FromPhoneNumber": null,
         "TwilioAccountSid": null,
@@ -130,9 +131,9 @@
     },
     "AdsPushAPNS": {
         "P8PrivateKey": null,
-        "P8PrivateKey_Comment": "p8 certificate string without -----BEGIN PRIVATE KEY----- and -----END PRIVATE KEY----- and replace new lines with space.",
+        "P8PrivateKey_Comment": "p8 certificate string without any space and start and end (-----BEGIN PRIVATE KEY----- and -----END PRIVATE KEY-----) tags.",
         "P8PrivateKeyId": null,
-        "P8PrivateKeyId_Comment": "10-digit p8 certificate id; often part of a downloadable certificate filename",
+        "P8PrivateKeyId_Comment": "10-digit p8 certificate id; often part of a downloaded certificate filename",
         "TeamId": null,
         "TeamId_Comment": "10-digit Apple team id shown on the Apple Developer Membership Page",
         "AppBundleIdentifier": null,
@@ -140,7 +141,7 @@
         "EnvironmentType_Comment": "Apns Env one of Development or Production"
     },
     "AdsPushFirebase": {
-        "AdsPushFirebase_Comment": "Filed names in service_account.json => project_id,private_key_id,private_key,client_email,client_id,client_x509_cert_url",
+        "AdsPushFirebase_Comment": "Field names in service_account.json => project_id,private_key_id,private_key,client_email,client_id,client_x509_cert_url",
         "Type": "service_account",
         "AuthUri": "https://accounts.google.com/o/oauth2/auth",
         "TokenUri": "https://oauth2.googleapis.com/token",
@@ -155,7 +156,7 @@
     //#endif
     "Hangfire": {
         "UseIsolatedStorage": false,
-        "UseIsolatedStorage__Comment": "Useful for testing or in production when managing multiple codebases with a single database."
+        "UseIsolatedStorage_Comment": "Useful for testing or in production when managing multiple codebases with a single database."
     },
     "Authentication": {
         "Google": {
@@ -171,14 +172,18 @@
         "Twitter": {
             "Comment": "https://learn.microsoft.com/en-us/aspnet/core/security/authentication/social/twitter-logins",
             "ConsumerKey": null,
-            "ConsumerSecret": null
+            "ConsumerKey_Comment": "Also known as API Key",
+            "ConsumerSecret": null,
+            "ConsumerSecret_Comment": "Also known as API Key Secret"
         },
         "Apple": {
             "Comment": "https://github.com/aspnet-contrib/AspNet.Security.OAuth.Providers/blob/dev/docs/sign-in-with-apple.md",
             "ClientId": null,
             "ClientId_Comment": "Your Service Id's Identifier such as com.adminpanel.bitplatform.dev",
             "KeyId": null,
-            "TeamId": null
+            "TeamId": null,
+            "TeamId_Comment": "10-digit Apple team id shown on the Apple Developer Membership Page",
+            "AppleAuthKey.p8_Comment": "Download .p8 file and save it with AppleAuthKey.p8 name in bin directory"
         },
         "Facebook": {
             "Comment": "https://learn.microsoft.com/en-us/aspnet/core/security/authentication/social/facebook-logins",
@@ -205,6 +210,7 @@
     "AllowedHosts": "*",
     "TrustedOrigins": [],
     "TrustedOrigins_Comment": "Lists the permitted origins for CORS requests, return URLs following external sign-in and email confirmation, etc., along with allowed origins for Web Auth.",
+    "TrustedOrigins_Sample": [ "https://adminpanel.bitplatform.dev", "https://adminpanel-api.bitplatform.dev" ],
     "ForwardedHeaders": {
         "ForwardedHeaders": "All",
         "ForwardedHeaders_Comment": "These values apply only if your backend is hosted behind a CDN (such as `Cloudflare`).",
@@ -219,7 +225,8 @@
         "ApiToken": null,
         "ZoneId": null,
         "AdditionalDomains": [],
-        "AdditionalDomains_Comment": "The ResponseCacheService clears the cache for the current domain by default. If multiple Cloudflare-hosted domains point to your backend, you will need to purge the cache for each of them individually."
+        "AdditionalDomains_Comment": "The ResponseCacheService clears the cache for the current domain by default. If multiple Cloudflare-hosted domains point to your backend, you will need to purge the cache for each of them individually.",
+        "AdditionalDomains_Sample": [ "https://sales.bitplatform.dev" ]
     },
     //#endif
     "ResponseCaching": {
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
index 7097e1db73..d62b475918 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.AppHost/Boilerplate.Server.AppHost.csproj
@@ -1,4 +1,4 @@
-<Project Sdk="Aspire.AppHost.Sdk/13.1.3">
+<Project Sdk="Aspire.AppHost.Sdk/13.2.0">
 
     <PropertyGroup>
         <OutputType>Exe</OutputType>
@@ -9,7 +9,6 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Aspire.Hosting.AppHost" />
         <PackageReference Include="Aspire.Hosting.DevTunnels" />
         <PackageReference Include="Aspire.Hosting.Keycloak" />
         <PackageReference Include="Aspire.Hosting.Maui" />
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
index 89ad72ef19..1ce0ac9feb 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Server/Boilerplate.Server.Web/appsettings.json
@@ -181,7 +181,7 @@
         "Issuer": "Boilerplate",
         "Audience": "Boilerplate"
     },
-    "Identity__Comment": "The Server.Api's Issuer and Audience are required in Server.Web as well in Standalone API mode, so Server.Web can securely validate JWT tokens during pre-rendering.",
+    "Identity_Comment": "The Server.Api's Issuer and Audience are required in Server.Web as well in Standalone API mode, so Server.Web can securely validate JWT tokens during pre-rendering.",
     //#if (IsInsideProjectTemplate)
     */
     //#endif
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
index 557a172b02..99d85611d7 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Extensions/ISharedServiceCollectionExtensions.cs
@@ -39,11 +39,11 @@ public static IServiceCollection AddSharedProjectServices(this IServiceCollectio
         services.ConfigureAuthorizationCore();
 
         services.AddLocalization();
+        services.AddSingleton<IMemoryCache, AppMemoryCache>(); // Extends services.AddMemoryCache()
         services.Configure<MemoryCacheOptions>(options =>
         {
             configuration.GetRequiredSection("MemoryCache").Bind(options);
         });
-        services.AddMemoryCache();
 
         return services;
     }
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppMemoryCache.cs b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppMemoryCache.cs
new file mode 100644
index 0000000000..994b6cd9b1
--- /dev/null
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/Infrastructure/Services/AppMemoryCache.cs
@@ -0,0 +1,41 @@
+using Microsoft.Extensions.Logging;
+using Microsoft.Extensions.Options;
+using Microsoft.Extensions.Caching.Memory;
+
+namespace Boilerplate.Shared.Infrastructure.Services;
+
+/// <summary>
+/// Total capacity of the in memory cache has been set in Shared/appsettings.json in the "MemoryCacheOptions" section. The SizeLimit property is set to 100000.
+/// Unit is arbitrary; we treat it as 1 unit per average cache entry
+/// This would prevent the cache from growing indefinitely and consuming too much memory, which could lead to performance degradation or out-of-memory exceptions.
+///
+/// Some 3rd party libraries may not set Size when adding entries to the cache, so we set it to 1 by default in CreateEntry method to prevent potential runtime errors.
+/// https://github.com/aspnet-contrib/AspNet.Security.OAuth.Providers/issues/1190
+/// </summary>
+public class AppMemoryCache(IOptions<MemoryCacheOptions> optionsAccessor, ILoggerFactory loggerFactory) : IMemoryCache
+{
+    private readonly MemoryCache implementation = new(optionsAccessor, loggerFactory);
+
+    public ICacheEntry CreateEntry(object key)
+    {
+        var entry = implementation.CreateEntry(key);
+        entry.Size ??= 1;
+        return entry;
+    }
+
+    public void Dispose()
+    {
+        implementation.Dispose();
+        GC.SuppressFinalize(this);
+    }
+
+    public void Remove(object key)
+    {
+        implementation.Remove(key);
+    }
+
+    public bool TryGetValue(object key, out object? value)
+    {
+        return implementation.TryGetValue(key, out value);
+    }
+}
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
index babe70f34c..464ca18db1 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Shared/appsettings.json
@@ -31,6 +31,7 @@
             "SendDefaultPii": true,
             "TracesSampleRate": 1.0,
             "EnableScopeSync": true,
+            "AutoSessionTracking": true,
             "LogLevel": {
                 "Default": "Warning",
                 "Microsoft.Hosting.Lifetime": "Information",
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
index 6da1c20e7a..fa0439086f 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,7 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -772,7 +774,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -783,32 +787,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
@@ -946,6 +950,8 @@
         },
         "node_modules/typescript": {
             "version": "5.9.3",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
+            "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
             "dev": true,
             "license": "Apache-2.0",
             "bin": {
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
index 357e338cf0..2486f2c399 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -784,9 +784,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +797,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
index 5f7934f912..614b57b332 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package-lock.json
@@ -5,15 +5,15 @@
     "packages": {
         "": {
             "devDependencies": {
-                "esbuild": "0.27.3",
+                "esbuild": "0.27.4",
                 "sass": "1.98.0",
                 "typescript": "5.9.3"
             }
         },
         "node_modules/@esbuild/aix-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-            "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+            "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
             "cpu": [
                 "ppc64"
             ],
@@ -28,9 +28,9 @@
             }
         },
         "node_modules/@esbuild/android-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-            "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+            "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
             "cpu": [
                 "arm"
             ],
@@ -45,9 +45,9 @@
             }
         },
         "node_modules/@esbuild/android-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-            "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+            "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
             "cpu": [
                 "arm64"
             ],
@@ -62,9 +62,9 @@
             }
         },
         "node_modules/@esbuild/android-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-            "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+            "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
             "cpu": [
                 "x64"
             ],
@@ -79,9 +79,9 @@
             }
         },
         "node_modules/@esbuild/darwin-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-            "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+            "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
             "cpu": [
                 "arm64"
             ],
@@ -96,9 +96,9 @@
             }
         },
         "node_modules/@esbuild/darwin-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-            "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+            "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
             "cpu": [
                 "x64"
             ],
@@ -113,9 +113,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
             "cpu": [
                 "arm64"
             ],
@@ -130,9 +130,9 @@
             }
         },
         "node_modules/@esbuild/freebsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-            "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+            "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
             "cpu": [
                 "x64"
             ],
@@ -147,9 +147,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-            "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+            "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
             "cpu": [
                 "arm"
             ],
@@ -164,9 +164,9 @@
             }
         },
         "node_modules/@esbuild/linux-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-            "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+            "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
             "cpu": [
                 "arm64"
             ],
@@ -181,9 +181,9 @@
             }
         },
         "node_modules/@esbuild/linux-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-            "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+            "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
             "cpu": [
                 "ia32"
             ],
@@ -198,9 +198,9 @@
             }
         },
         "node_modules/@esbuild/linux-loong64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-            "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+            "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
             "cpu": [
                 "loong64"
             ],
@@ -215,9 +215,9 @@
             }
         },
         "node_modules/@esbuild/linux-mips64el": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-            "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+            "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
             "cpu": [
                 "mips64el"
             ],
@@ -232,9 +232,9 @@
             }
         },
         "node_modules/@esbuild/linux-ppc64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-            "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+            "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
             "cpu": [
                 "ppc64"
             ],
@@ -249,9 +249,9 @@
             }
         },
         "node_modules/@esbuild/linux-riscv64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-            "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+            "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
             "cpu": [
                 "riscv64"
             ],
@@ -266,9 +266,9 @@
             }
         },
         "node_modules/@esbuild/linux-s390x": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-            "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+            "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
             "cpu": [
                 "s390x"
             ],
@@ -283,9 +283,9 @@
             }
         },
         "node_modules/@esbuild/linux-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-            "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+            "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
             "cpu": [
                 "x64"
             ],
@@ -300,9 +300,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
             "cpu": [
                 "arm64"
             ],
@@ -317,9 +317,9 @@
             }
         },
         "node_modules/@esbuild/netbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
             "cpu": [
                 "x64"
             ],
@@ -334,9 +334,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-            "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+            "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
             "cpu": [
                 "arm64"
             ],
@@ -351,9 +351,9 @@
             }
         },
         "node_modules/@esbuild/openbsd-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-            "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+            "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
             "cpu": [
                 "x64"
             ],
@@ -368,9 +368,9 @@
             }
         },
         "node_modules/@esbuild/openharmony-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-            "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+            "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
             "cpu": [
                 "arm64"
             ],
@@ -385,9 +385,9 @@
             }
         },
         "node_modules/@esbuild/sunos-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-            "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+            "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
             "cpu": [
                 "x64"
             ],
@@ -402,9 +402,9 @@
             }
         },
         "node_modules/@esbuild/win32-arm64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-            "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+            "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
             "cpu": [
                 "arm64"
             ],
@@ -419,9 +419,9 @@
             }
         },
         "node_modules/@esbuild/win32-ia32": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-            "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+            "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
             "cpu": [
                 "ia32"
             ],
@@ -436,9 +436,9 @@
             }
         },
         "node_modules/@esbuild/win32-x64": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-            "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+            "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
             "cpu": [
                 "x64"
             ],
@@ -784,9 +784,9 @@
             }
         },
         "node_modules/esbuild": {
-            "version": "0.27.3",
-            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-            "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+            "version": "0.27.4",
+            "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+            "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
             "dev": true,
             "hasInstallScript": true,
             "license": "MIT",
@@ -797,32 +797,32 @@
                 "node": ">=18"
             },
             "optionalDependencies": {
-                "@esbuild/aix-ppc64": "0.27.3",
-                "@esbuild/android-arm": "0.27.3",
-                "@esbuild/android-arm64": "0.27.3",
-                "@esbuild/android-x64": "0.27.3",
-                "@esbuild/darwin-arm64": "0.27.3",
-                "@esbuild/darwin-x64": "0.27.3",
-                "@esbuild/freebsd-arm64": "0.27.3",
-                "@esbuild/freebsd-x64": "0.27.3",
-                "@esbuild/linux-arm": "0.27.3",
-                "@esbuild/linux-arm64": "0.27.3",
-                "@esbuild/linux-ia32": "0.27.3",
-                "@esbuild/linux-loong64": "0.27.3",
-                "@esbuild/linux-mips64el": "0.27.3",
-                "@esbuild/linux-ppc64": "0.27.3",
-                "@esbuild/linux-riscv64": "0.27.3",
-                "@esbuild/linux-s390x": "0.27.3",
-                "@esbuild/linux-x64": "0.27.3",
-                "@esbuild/netbsd-arm64": "0.27.3",
-                "@esbuild/netbsd-x64": "0.27.3",
-                "@esbuild/openbsd-arm64": "0.27.3",
-                "@esbuild/openbsd-x64": "0.27.3",
-                "@esbuild/openharmony-arm64": "0.27.3",
-                "@esbuild/sunos-x64": "0.27.3",
-                "@esbuild/win32-arm64": "0.27.3",
-                "@esbuild/win32-ia32": "0.27.3",
-                "@esbuild/win32-x64": "0.27.3"
+                "@esbuild/aix-ppc64": "0.27.4",
+                "@esbuild/android-arm": "0.27.4",
+                "@esbuild/android-arm64": "0.27.4",
+                "@esbuild/android-x64": "0.27.4",
+                "@esbuild/darwin-arm64": "0.27.4",
+                "@esbuild/darwin-x64": "0.27.4",
+                "@esbuild/freebsd-arm64": "0.27.4",
+                "@esbuild/freebsd-x64": "0.27.4",
+                "@esbuild/linux-arm": "0.27.4",
+                "@esbuild/linux-arm64": "0.27.4",
+                "@esbuild/linux-ia32": "0.27.4",
+                "@esbuild/linux-loong64": "0.27.4",
+                "@esbuild/linux-mips64el": "0.27.4",
+                "@esbuild/linux-ppc64": "0.27.4",
+                "@esbuild/linux-riscv64": "0.27.4",
+                "@esbuild/linux-s390x": "0.27.4",
+                "@esbuild/linux-x64": "0.27.4",
+                "@esbuild/netbsd-arm64": "0.27.4",
+                "@esbuild/netbsd-x64": "0.27.4",
+                "@esbuild/openbsd-arm64": "0.27.4",
+                "@esbuild/openbsd-x64": "0.27.4",
+                "@esbuild/openharmony-arm64": "0.27.4",
+                "@esbuild/sunos-x64": "0.27.4",
+                "@esbuild/win32-arm64": "0.27.4",
+                "@esbuild/win32-ia32": "0.27.4",
+                "@esbuild/win32-x64": "0.27.4"
             }
         },
         "node_modules/fill-range": {
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
index 7b9fa7d740..3e161a8a41 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/package.json
@@ -1,6 +1,6 @@
 {
     "devDependencies": {
-        "esbuild": "0.27.3",
+        "esbuild": "0.27.4",
         "sass": "1.98.0",
         "typescript": "5.9.3"
     }

From be93d21aa99f5b642c54d3ba1d3016e198bc36a4 Mon Sep 17 00:00:00 2001
From: Yas Moradi <ysmoradi@outlook.com>
Date: Wed, 25 Mar 2026 15:03:31 +0100
Subject: [PATCH 66/66] feat(release): v-10.4.3 #12213 (#12203)

---
 src/Besql/Bit.Besql/wwwroot/bit-besql.js      |  2 +-
 src/Bit.Build.props                           |  2 +-
 .../buildTransitive/Bit.BlazorES2019.targets  |  8 +++----
 src/BlazorUI/Bit.BlazorUI/Info.cs             |  2 +-
 src/BlazorUI/Bit.BlazorUI/Scripts/general.ts  |  2 +-
 .../Bit.BlazorUI.Demo.Server.csproj           |  6 ++---
 .../Bit.BlazorUI.Demo.Shared.csproj           |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Core.csproj      |  4 ++--
 .../Bit.BlazorUI.Demo.Client.Maui.csproj      |  6 ++---
 .../Bit.BlazorUI.Demo.Client.Web.csproj       |  6 ++---
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.BlazorUI.Demo.Client.Windows.csproj   |  6 ++---
 src/BlazorUI/Demo/Directory.Build.props       |  2 +-
 .../Bit.Bswup.Demo/wwwroot/service-worker.js  |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../wwwroot/service-worker.js                 |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.progress.ts   |  2 +-
 .../Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts   |  2 +-
 src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts      |  2 +-
 .../FullDemo/Client/wwwroot/service-worker.js |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 src/Butil/Bit.Butil/Scripts/butil.ts          |  2 +-
 .../BlazorEmpty.Client.csproj                 |  8 +++----
 .../BlazorEmpty/BlazorEmpty.csproj            |  8 +++----
 .../.docs/19- Project Miscellaneous Files.md  | 10 ++++-----
 .../Boilerplate/Bit.Boilerplate/README.md     |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../src/Directory.Packages.props              | 22 +++++++++----------
 .../Bit.Websites.Careers.Client.csproj        | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Careers.Server.csproj        |  6 ++---
 .../Bit.Websites.Careers.Shared.csproj        |  4 ++--
 .../Careers/src/Directory.Build.props         |  2 +-
 .../Bit.Websites.Platform.Client.csproj       | 14 ++++++------
 .../Templates03GettingStartedPage.razor       |  2 +-
 .../Templates03GettingStartedPage.razor.cs    |  2 +-
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Platform.Server.csproj       |  6 ++---
 .../Bit.Websites.Platform.Shared.csproj       |  4 ++--
 .../Platform/src/Directory.Build.props        |  2 +-
 .../Bit.Websites.Sales.Client.csproj          | 12 +++++-----
 .../wwwroot/service-worker.published.js       |  2 +-
 .../Bit.Websites.Sales.Server.csproj          |  6 ++---
 .../Bit.Websites.Sales.Shared.csproj          |  4 ++--
 src/Websites/Sales/src/Directory.Build.props  |  2 +-
 47 files changed, 105 insertions(+), 105 deletions(-)

diff --git a/src/Besql/Bit.Besql/wwwroot/bit-besql.js b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
index e46a118cca..5209c41bac 100644
--- a/src/Besql/Bit.Besql/wwwroot/bit-besql.js
+++ b/src/Besql/Bit.Besql/wwwroot/bit-besql.js
@@ -1,5 +1,5 @@
 var BitBesql = window.BitBesql || {};
-BitBesql.version = window['bit-besql version'] = '10.4.3-pre-03';
+BitBesql.version = window['bit-besql version'] = '10.4.3';
 
 BitBesql.persist = async function besqlPersist(fileName) {
 
diff --git a/src/Bit.Build.props b/src/Bit.Build.props
index 1cc292871c..6c291d5ab1 100644
--- a/src/Bit.Build.props
+++ b/src/Bit.Build.props
@@ -27,7 +27,7 @@
         <PackageProjectUrl>https://github.com/bitfoundation/bitplatform</PackageProjectUrl>
 
         <!-- Version -->
-        <ReleaseVersion>10.4.3-pre-03</ReleaseVersion>
+        <ReleaseVersion>10.4.3</ReleaseVersion>
           <PackageVersion>$(ReleaseVersion)</PackageVersion>
         <PackageReleaseNotes>https://github.com/bitfoundation/bitplatform/releases/tag/v-$(ReleaseVersion)</PackageReleaseNotes>
         <Version Condition=" '$(Configuration)' == 'Release' ">$([System.String]::Copy($(ReleaseVersion)).Replace('-pre-', '.'))</Version>
diff --git a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
index 59e91dc1ed..583f0f413a 100644
--- a/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
+++ b/src/BlazorES2019/Bit.BlazorES2019/buildTransitive/Bit.BlazorES2019.targets
@@ -1,13 +1,13 @@
 <Project>
     <ItemGroup>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3/contentFiles/any/net9.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net9.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
         </Content>
-        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
-        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3-pre-03/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
+        <Content Remove="$(NuGetPackageRoot)/bit.blazores2019/10.4.3/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))" />
+        <Content Include="$(NuGetPackageRoot)/bit.blazores2019/10.4.3/contentFiles/any/net10.0/wwwroot/_framework/*.js" Condition="$(TargetFramework.Contains('net10.0'))">
             <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
             <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
             <Link>wwwroot\_framework\%(Filename)%(Extension)</Link>
diff --git a/src/BlazorUI/Bit.BlazorUI/Info.cs b/src/BlazorUI/Bit.BlazorUI/Info.cs
index ef5d4ec794..8a419d567e 100644
--- a/src/BlazorUI/Bit.BlazorUI/Info.cs
+++ b/src/BlazorUI/Bit.BlazorUI/Info.cs
@@ -8,5 +8,5 @@ public static class Info
     /// <summary>
     /// The current version string of bit BlazorUI.
     /// </summary>
-    public static string Version { get; } = "10.4.3-pre-03";
+    public static string Version { get; } = "10.4.3";
 }
diff --git a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
index 5e410b3a32..26e90edd97 100644
--- a/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
+++ b/src/BlazorUI/Bit.BlazorUI/Scripts/general.ts
@@ -1,4 +1,4 @@
-(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3-pre-03';
+(BitBlazorUI as any).version = (window as any)['bit-blazorui version'] = '10.4.3';
 
 interface DotNetObject {
     invokeMethod<T>(methodIdentifier: string, ...args: any[]): T;
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
index 931b81ce77..cb2a59f984 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Server/Bit.BlazorUI.Demo.Server.csproj
@@ -10,12 +10,12 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
index 162203d410..dbdc413e04 100644
--- a/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
+++ b/src/BlazorUI/Demo/Bit.BlazorUI.Demo.Shared/Bit.BlazorUI.Demo.Shared.csproj
@@ -5,11 +5,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
index 26f855e77e..b3ef7e48a2 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Core/Bit.BlazorUI.Demo.Client.Core.csproj
@@ -16,11 +16,11 @@
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
 
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
index 3f17161ee0..076058895a 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Maui/Bit.BlazorUI.Demo.Client.Maui.csproj
@@ -98,13 +98,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
         <PackageReference Include="Microsoft.AppCenter.Crashes" Version="5.0.7" />
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
index 3e6fd95185..d18a894ab9 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/Bit.BlazorUI.Demo.Client.Web.csproj
@@ -28,13 +28,13 @@
     </ItemGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
+        <PackageReference Include="Bit.Bswup" Version="10.4.3" />
         <PackageReference Include="Newtonsoft.Json" Version="13.0.4" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
index 57d91435cb..b53f225776 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Web/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
index e8ec96a011..9b8a186c09 100644
--- a/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
+++ b/src/BlazorUI/Demo/Client/Bit.BlazorUI.Demo.Client.Windows/Bit.BlazorUI.Demo.Client.Windows.csproj
@@ -29,12 +29,12 @@
         <Using Include="Bit.BlazorUI.Demo.Client.Core.Services" />
         <Using Include="Bit.BlazorUI.Demo.Shared" />
         <Watch Remove="*.scss" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/BlazorUI/Demo/Directory.Build.props b/src/BlazorUI/Demo/Directory.Build.props
index 6627835a44..911a6f106f 100644
--- a/src/BlazorUI/Demo/Directory.Build.props
+++ b/src/BlazorUI/Demo/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
+<!-- Generated by bit-bp template v-10.4.3 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
index 5ac9a5663c..36790ba1f1 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
index 474ab8338e..65991dadda 100644
--- a/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.Demo/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
 self.caseInsensitiveUrl = true;
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
index c14fb45377..ec07ca82ce 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
index 7ffdc8b8cd..3149698605 100644
--- a/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/Bit.Bswup.NewDemo/Bit.Bswup.NewDemo.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 self.assetsInclude = [];
 self.assetsExclude = [
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
index 398ea4d4fe..40a3cd7733 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.progress.ts
@@ -1,4 +1,4 @@
-window['bit-bswup.progress version'] = '10.4.3-pre-03';
+window['bit-bswup.progress version'] = '10.4.3';
 
 (function () {
     const _config: IBswupProgressConfigs = {};
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
index 649c44c76b..e690e1e29c 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw-cleanup.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw-cleanup version'] = '10.4.3-pre-03';
+self['bit-bswup.sw-cleanup version'] = '10.4.3';
 
 self.addEventListener('install', e => e.waitUntil(removeBswup()));
 
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
index d2889fcaa8..dd5a68539a 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.sw.ts
@@ -1,4 +1,4 @@
-self['bit-bswup.sw version'] = '10.4.3-pre-03';
+self['bit-bswup.sw version'] = '10.4.3';
 
 interface Window {
     clients: any
diff --git a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
index cfa40a1d38..4b290073d1 100644
--- a/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
+++ b/src/Bswup/Bit.Bswup/Scripts/bit-bswup.ts
@@ -1,5 +1,5 @@
 var BitBswup = BitBswup || {};
-BitBswup.version = window['bit-bswup version'] = '10.4.3-pre-03';
+BitBswup.version = window['bit-bswup version'] = '10.4.3';
 
 (function () {
     const bitBswupScript = document.currentScript;
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
index c47ec891da..de46cd0dff 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 // In development, always fetch from the network and do not enable offline support.
 // This is because caching would make development more difficult (changes would not
diff --git a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
index 4caa610bd5..c41baef0f6 100644
--- a/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
+++ b/src/Bswup/FullDemo/Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 
 self.assetsInclude = [];
 self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
diff --git a/src/Butil/Bit.Butil/Scripts/butil.ts b/src/Butil/Bit.Butil/Scripts/butil.ts
index fded6bf0bf..b2313ee3b4 100644
--- a/src/Butil/Bit.Butil/Scripts/butil.ts
+++ b/src/Butil/Bit.Butil/Scripts/butil.ts
@@ -1,2 +1,2 @@
 var BitButil = BitButil || {};
-BitButil.version = window['bit-butil version'] = '10.4.3-pre-03';
\ No newline at end of file
+BitButil.version = window['bit-butil version'] = '10.4.3';
\ No newline at end of file
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
index 34078e41d4..9422d5b46b 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty.Client/BlazorEmpty.Client.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-03 -->
+<!-- Generated by bit-empty template v-10.4.3 -->
 
 <Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
 
@@ -15,14 +15,14 @@
   </ItemGroup>
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
index 0e7b8228d0..6a8d475656 100644
--- a/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
+++ b/src/Templates/BlazorEmpty/Bit.BlazorEmpty/BlazorEmpty/BlazorEmpty.csproj
@@ -1,4 +1,4 @@
-<!-- Generated by bit-empty template v-10.4.3-pre-03 -->
+<!-- Generated by bit-empty template v-10.4.3 -->
 
 <Project Sdk="Microsoft.NET.Sdk.Web">
 
@@ -18,14 +18,14 @@
   <!--#endif -->
 
   <ItemGroup>
-    <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+    <PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
 
-    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+    <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
 
-    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+    <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
         <PrivateAssets>all</PrivateAssets>
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
     </PackageReference>
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md
index 18117c0c07..577be1036f 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/.docs/19- Project Miscellaneous Files.md	
@@ -221,7 +221,7 @@ These namespaces are **automatically imported** in every C# file, eliminating th
 
 Instead of this in each `.csproj`:
 ```xml
-<PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+<PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
 ```
 
 You write this in `.csproj`:
@@ -231,7 +231,7 @@ You write this in `.csproj`:
 
 And the version is defined centrally in `Directory.Packages.props`:
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3" />
 ```
 
 **Benefits**:
@@ -242,8 +242,8 @@ And the version is defined centrally in `Directory.Packages.props`:
 **Example packages included**:
 
 ```xml
-<PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
-<PackageVersion Include="Bit.Butil" Version="10.4.3-pre-03" />
+<PackageVersion Include="Bit.BlazorUI" Version="10.4.3" />
+<PackageVersion Include="Bit.Butil" Version="10.4.3" />
 <PackageVersion Include="Microsoft.AspNetCore.Components.WebAssembly" Version="10.0.0" />
 <PackageVersion Include="Microsoft.EntityFrameworkCore.SqlServer" Version="10.0.0" />
 <PackageVersion Include="Hangfire.AspNetCore" Version="1.8.21" />
@@ -608,7 +608,7 @@ When you open the project in VS Code, you'll be prompted to install these extens
 **Example**:
 
 ````markdown
-This project gets generated by bit-bp template v-10.4.3-pre-03 using the following command
+This project gets generated by bit-bp template v-10.4.3 using the following command
 ```bash
 dotnet new bit-bp
     --name Boilerplate
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/README.md b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
index 7a14af1dd0..54945734b1 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/README.md
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/README.md
@@ -2,7 +2,7 @@
 
 Thank you for creating a new project with bit platform! We appreciate your trust in our platform and are excited to see what you'll build.
 
-This project generated by bit-bp template v-10.4.3-pre-03 using the following command:
+This project generated by bit-bp template v-10.4.3 using the following command:
 
 ```bash
     dotnet new bit-bp
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
index 0148e77456..2f8a72a8f6 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Client/Boilerplate.Client.Web/wwwroot/service-worker.published.js
@@ -1,5 +1,5 @@
 //+:cnd:noEmit
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 //#if (notification == true)
diff --git a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
index 91ffda97ff..1925db3d5d 100644
--- a/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
+++ b/src/Templates/Boilerplate/Bit.Boilerplate/src/Directory.Packages.props
@@ -1,16 +1,16 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
+<!-- Generated by bit-bp template v-10.4.3 -->
 <Project>
     <ItemGroup>
         <!-- https://learn.microsoft.com/en-us/nuget/consume-packages/central-package-management -->
-        <PackageVersion Include="Bit.Butil" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.Bswup" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03" />
-        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3-pre-03" />
+        <PackageVersion Include="Bit.Butil" Version="10.4.3" />
+        <PackageVersion Include="Bit.BlazorUI" Version="10.4.3" />
+        <PackageVersion Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageVersion Include="Bit.BlazorUI.Icons" Version="10.4.3" />
+        <PackageVersion Include="Bit.BlazorUI.Assets" Version="10.4.3" />
+        <PackageVersion Include="Bit.BlazorUI.Extras" Version="10.4.3" />
+        <PackageVersion Include="Bit.Bswup" Version="10.4.3" />
+        <PackageVersion Include="Bit.CodeAnalyzers" Version="10.4.3" />
+        <PackageVersion Include="Bit.SourceGenerators" Version="10.4.3" />
         <PackageVersion Include="DistributedLock.FileSystem" Version="1.0.3" />
         <PackageVersion Include="Fido2.AspNet" Version="4.0.0" />
         <PackageVersion Include="Fido2.Models" Version="4.0.0" />
@@ -89,7 +89,7 @@
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.Abstractions" Version="10.0.0" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Server.EntityFrameworkCore" Version="10.0.0" />
-        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3-pre-03" />
+        <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="Bit.Besql" Version="10.4.3" />
         <PackageVersion Condition=" '$(offlineDb)' == 'true' OR '$(offlineDb)' == ''" Include="CommunityToolkit.Datasync.Client" Version="10.0.0" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.AspNetCore.SignalR.Client" Version="10.0.5" />
         <PackageVersion Condition=" '$(signalR)' == 'true' OR '$(signalR)' == ''" Include="Microsoft.Azure.SignalR" Version="1.33.0" />
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
index d2b889afa6..af0523984c 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/Bit.Websites.Careers.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
index 572d85423b..f487ca5acf 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
index df871f3ed6..014e25a75d 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Server/Bit.Websites.Careers.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Careers.Shared\Bit.Websites.Careers.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Careers.Client\Bit.Websites.Careers.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
index a7823441a9..eb9bb4cb93 100644
--- a/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
+++ b/src/Websites/Careers/src/Bit.Websites.Careers.Shared/Bit.Websites.Careers.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Careers/src/Directory.Build.props b/src/Websites/Careers/src/Directory.Build.props
index 624f9a85ec..8951853606 100644
--- a/src/Websites/Careers/src/Directory.Build.props
+++ b/src/Websites/Careers/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
+<!-- Generated by bit-bp template v-10.4.3 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
index 4e970b94d2..149d18568c 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Bit.Websites.Platform.Client.csproj
@@ -32,16 +32,16 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.Butil" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3" />
+        <PackageReference Include="Bit.Butil" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Extras" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
index 0cfdc6819a..193396cbd6 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor
@@ -153,7 +153,7 @@ rm $HOME/dotnet.tar.gz</CodeBox>
                         </li>
                         <li>
                             <div style="margin-bottom:8px">Install <a href="https://www.nuget.org/packages/Bit.Boilerplate" target="_blank">Bit Boilerplate</a> project template</div>
-                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3-pre-03</CodeBox>
+                            <CodeBox>dotnet new install Bit.Boilerplate::10.4.3</CodeBox>
                         </li>
                         @if (showCrossPlatform && devOS is "Windows")
                         {
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
index b7048c5eb6..ed0365a268 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/Pages/Templates/Templates03GettingStartedPage.razor.cs
@@ -43,7 +43,7 @@ public partial class Templates03GettingStartedPage
             command:"dotnet tool install -g Aspire.Cli"),
 
             (text:@"echo 'Install the Bit.Boilerplate project template https://www.nuget.org/packages/Boilerplate.Templates';",
-            command:"dotnet new install Bit.Boilerplate::10.4.3-pre-03;")
+            command:"dotnet new install Bit.Boilerplate::10.4.3;")
         ];
 
         if (enableVirtualization)
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
index cb43227fa3..1d93f9e577 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
index 0d155f3203..1185b9388d 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Server/Bit.Websites.Platform.Server.csproj
@@ -12,12 +12,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Platform.Shared\Bit.Websites.Platform.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Platform.Client\Bit.Websites.Platform.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
index a7823441a9..eb9bb4cb93 100644
--- a/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
+++ b/src/Websites/Platform/src/Bit.Websites.Platform.Shared/Bit.Websites.Platform.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Platform/src/Directory.Build.props b/src/Websites/Platform/src/Directory.Build.props
index af83dcad0e..538e1a5d37 100644
--- a/src/Websites/Platform/src/Directory.Build.props
+++ b/src/Websites/Platform/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
+<!-- Generated by bit-bp template v-10.4.3 -->
 <Project>
     <PropertyGroup>
         <LangVersion>preview</LangVersion>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
index ec3921c9a1..55758a18c9 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/Bit.Websites.Sales.Client.csproj
@@ -29,15 +29,15 @@
 
         <Content Remove="appsettings.json" />
         <EmbeddedResource Include="appsettings.json" />
-        <PackageReference Include="Bit.Bswup" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.Bswup" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Icons" Version="10.4.3" />
+        <PackageReference Include="Bit.BlazorUI.Assets" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
index 39521a90fb..2a2d43d6f7 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Client/wwwroot/service-worker.published.js
@@ -1,4 +1,4 @@
-// bit version: 10.4.3-pre-03
+// bit version: 10.4.3
 // https://github.com/bitfoundation/bitplatform/tree/develop/src/Bswup
 
 self.assetsInclude = [];
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
index 4d3a86f8be..bd234f2ada 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Server/Bit.Websites.Sales.Server.csproj
@@ -11,12 +11,12 @@
     <ItemGroup>
         <ProjectReference Include="..\Bit.Websites.Sales.Shared\Bit.Websites.Sales.Shared.csproj" />
         <ProjectReference Include="..\Bit.Websites.Sales.Client\Bit.Websites.Sales.Client.csproj" />
-        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3-pre-03" />
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.BlazorES2019" Version="10.4.3" />
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
index a7823441a9..eb9bb4cb93 100644
--- a/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
+++ b/src/Websites/Sales/src/Bit.Websites.Sales.Shared/Bit.Websites.Sales.Shared.csproj
@@ -6,11 +6,11 @@
     </PropertyGroup>
 
     <ItemGroup>
-        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.CodeAnalyzers" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
-        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3-pre-03">
+        <PackageReference Include="Bit.SourceGenerators" Version="10.4.3">
             <PrivateAssets>all</PrivateAssets>
             <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
         </PackageReference>
diff --git a/src/Websites/Sales/src/Directory.Build.props b/src/Websites/Sales/src/Directory.Build.props
index 52c53d2ceb..65e92936ae 100644
--- a/src/Websites/Sales/src/Directory.Build.props
+++ b/src/Websites/Sales/src/Directory.Build.props
@@ -1,4 +1,4 @@
-<!-- Generated by bit-bp template v-10.4.3-pre-03 -->
+<!-- Generated by bit-bp template v-10.4.3 -->
 <Project>
     <PropertyGroup>
         <LangVersion>14.0</LangVersion>