Merge tag 'AddBlazorModalSelectOpts' into develop

Aggiunta modalità selezione multipla 8ex LUX envir

EgwCoreLib.BlazorTest/Components/AddAppointmentPage.razor

@@ -0,0 +1,49 @@
+@inject DialogService DialogService
+
+<RadzenTemplateForm TItem="Appointment" Data="@model" Submit=@OnSubmit>
+    <RadzenStack Gap="1rem">
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Title" Style="width: 4rem;" />
+            <RadzenTextBox @bind-Value="@model.Text" Name="Text" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="Text" Text="Title is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Detail" Style="width: 4rem;" />
+            <RadzenTextBox @bind-Value="@model.Detail" Name="Detail" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="Detail" Text="Detail is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Start" Style="width: 4rem;" />
+            <RadzenDatePicker @bind-Value="@model.Start" Name="Start" ShowTime="true" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="Start" Text="Start is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="End" Style="width: 4rem;" />
+            <RadzenDatePicker Name="End" @bind-Value="@model.End" ShowTime="true" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="End" Text="End is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" JustifyContent="JustifyContent.End" >
+            <RadzenButton ButtonType="ButtonType.Submit" Text="Save" />
+        </RadzenStack>
+    </RadzenStack>
+</RadzenTemplateForm>
+@code {
+    [Parameter]
+    public DateTime Start { get; set; }
+
+    [Parameter]
+    public DateTime End { get; set; }
+
+    Appointment model = new Appointment();
+
+    protected override void OnParametersSet()
+    {
+        model.Start = Start;
+        model.End = End;
+    }
+
+    void OnSubmit(Appointment model)
+    {
+        DialogService.Close(model);
+    }
+}

EgwCoreLib.BlazorTest/Components/Appointment.cs

@@ -0,0 +1,11 @@
+namespace EgwCoreLib.BlazorTest.Components
+{
+    public class Appointment
+    {
+        public DateTime Start { get; set; }
+        public DateTime End { get; set; }
+
+        public string Text { get; set; } = "";
+        public string Detail { get; set; } = "";
+    }
+}

EgwCoreLib.BlazorTest/Components/EditAppointmentPage.razor

@@ -0,0 +1,45 @@
+@inject DialogService DialogService
+
+<RadzenTemplateForm TItem="Appointment" Data="@model" Submit=@OnSubmit>
+    <RadzenStack Gap="1rem">
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Title" Style="width: 6rem;" />
+            <RadzenTextBox @bind-Value="@model.Text" Name="Text" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="Text" Text="Title is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Detail" Style="width: 6rem;" />
+            <RadzenTextBox @bind-Value="@model.Detail" Name="Detail" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="Detail" Text="Detail is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="Start" Style="width: 6rem;" />
+            <RadzenDatePicker @bind-Value="@model.Start" Name="Start" ShowTime="true" Style="width: 12rem;" />
+        <RadzenRequiredValidator Component="Start" Text="Start is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Wrap="FlexWrap.Wrap">
+            <RadzenLabel Text="End" Style="width: 6rem;" />
+            <RadzenDatePicker Name="End" @bind-Value="@model.End" ShowTime="true" Style="width: 12rem;" />
+            <RadzenRequiredValidator Component="End" Text="End is required" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Horizontal" JustifyContent="JustifyContent.End" >
+            <RadzenButton ButtonType="ButtonType.Submit" Text="Save" />
+        </RadzenStack>
+    </RadzenStack>
+</RadzenTemplateForm>
+@code {
+    [Parameter]
+    public Appointment Appointment { get; set; }
+
+    Appointment model = new Appointment();
+
+    protected override void OnParametersSet()
+    {
+        model = Appointment;
+    }
+
+    void OnSubmit(Appointment model)
+    {
+        DialogService.Close(model);
+    }
+}

EgwCoreLib.BlazorTest/Components/EventConsole.razor

@@ -0,0 +1,76 @@
+@using Radzen
+@using System.Text.Json
+@inject IJSRuntime JSRuntime
+<RadzenCard Variant="Variant.Outlined" class="rz-mt-4">
+    <RadzenStack Orientation="Orientation.Vertical" Gap="0.5rem" @attributes=@Attributes>
+        <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" JustifyContent="JustifyContent.SpaceBetween">
+            <RadzenText TextStyle="TextStyle.Subtitle1" TagName="TagName.P" class="rz-m-0">Console log</RadzenText>
+            <RadzenButton Click=@OnClearClick Text="Clear console" ButtonStyle="ButtonStyle.Base" Variant="Variant.Flat" Size="ButtonSize.Small" />
+        </RadzenStack>
+        <RadzenStack Orientation="Orientation.Vertical" Gap="0" ID="event-console" class="rz-pt-1" Style="border-top: var(--rz-grid-cell-border); min-height: 2rem; max-height: 12rem; overflow: auto;">
+            @foreach (var message in messages)
+            {
+                <RadzenAlert ShowIcon="false" Variant="Variant.Flat" AlertStyle="message.AlertStyle" Size="AlertSize.ExtraSmall" Shade="Shade.Lighter" AllowClose="false" Style="font-size: 0.75rem">
+                    <span Style="opacity: 0.6;">@message.Date.ToString("HH:mm:ss.ff")</span> @message.Text
+                </RadzenAlert>
+            }
+        </RadzenStack>
+    </RadzenStack>
+</RadzenCard>
+
+@code {
+
+    /* ------------------------------------------------
+     * Radzen Blazor
+     * https://www.radzen.com/blazor-components/
+     * dettagli installazione:
+     * NET6: https://blazor.radzen.com/get-started/net6-server
+     * NET8: https://blazor.radzen.com/get-started/net8
+     *
+     * demo compo
+     * https://github.com/radzenhq/radzen-blazor/blob/master/RadzenBlazorDemos/Shared/EventConsole.razor
+     * ------------------------------------------------*/
+
+    class Message
+    {
+        public DateTime Date { get; set; }
+        public string Text { get; set; }
+        public AlertStyle AlertStyle { get; set; }
+    }
+
+    [Parameter(CaptureUnmatchedValues = true)]
+    public IDictionary<string, object> Attributes { get; set; }
+    IList<Message> messages = new List<Message>();
+
+    protected override async Task OnAfterRenderAsync(bool firstRender)
+    {
+        if (!firstRender)
+        {
+            await JSRuntime.InvokeVoidAsync("eval", $"document.getElementById('event-console').scrollTop = document.getElementById('event-console').scrollHeight");
+        }
+    }
+
+    void OnClearClick()
+    {
+        Clear();
+    }
+
+    public void Clear()
+    {
+        messages.Clear();
+
+        InvokeAsync(StateHasChanged);
+    }
+
+    public void Log(string message, AlertStyle alertStyle = AlertStyle.Info)
+    {
+        messages.Add(new Message { Date = DateTime.Now, Text = message, AlertStyle = alertStyle });
+
+        InvokeAsync(StateHasChanged);
+    }
+
+    public void Log(object value)
+    {
+        Log(JsonSerializer.Serialize(value));
+    }
+}

EgwCoreLib.BlazorTest/Data/TestData.cs

@@ -7,16 +7,21 @@ namespace EgwCoreLib.BlazorTest.Data
         public static Dictionary<string, string> MenuList { get; set; } = new()
         {
             {"TestPdfViewer", "Test PdfViewer"},
+            {"TestInput", "Test Input Ext"},
             {"TestQrDisplay", "Test QrDisplay"},
             {"TestGraphCompo", "Test Graph Compo"},
             {"TestBarcodeReader", "Test Barcode Read"},
             {"TestCalendario", "Test Calendario"},
             {"TestProgress", "Test Progress"},
+            {"TestParetoProgress", "Test Pareto ProgressBar"},
+            {"TestDialog", "Test Custom Dialog"},
             {"TestLoading", "Test Loading"},
             {"TestComponenti", "Test Componenti"},
             {"TestSvgDraw", "Test SVG draw"},
             {"TestGauges", "Test Gauges"},
             {"TestChart", "Test Chart.js"},
+            {"TestRadzenSched", "Test Radzen Scheduler" },
+            {"TestHwInfo", "Test HW Info" }
         };
     }
 }

EgwCoreLib.BlazorTest/EgwCoreLib.BlazorTest.csproj

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk.Web">
+<Project Sdk="Microsoft.NET.Sdk.Web">
 
   <PropertyGroup>
     <TargetFramework>net6.0</TargetFramework>
@@ -19,8 +19,64 @@
     <None Include="compilerconfig.json" />
   </ItemGroup>
 
+  <ItemGroup>
+    <PackageReference Include="DeviceId" Version="6.7.0" />
+    <PackageReference Include="DeviceId.Windows" Version="6.6.0" />
+    <PackageReference Include="DeviceId.Windows.Wmi" Version="6.6.0" />
+    <PackageReference Include="Radzen.Blazor" Version="6.2.6" />
+    <PackageReference Include="System.Linq.Dynamic.Core" Version="1.6.0.2" />
+  </ItemGroup>
+
   <ItemGroup>
     <ProjectReference Include="..\EgwCoreLib.Razor\EgwCoreLib.Razor.csproj" />
   </ItemGroup>
 
+  <ItemGroup>
+    <Content Update="wwwroot\font\lato-v17-latin-regular.eot">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\lato-v17-latin-regular.svg">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\lato-v17-latin-regular.ttf">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\lato-v17-latin-regular.woff">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\lato-v17-latin-regular.woff2">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-condensed-v19-latin-regular.eot">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-condensed-v19-latin-regular.svg">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-condensed-v19-latin-regular.ttf">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-condensed-v19-latin-regular.woff">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-condensed-v19-latin-regular.woff2">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-v27-latin-regular.eot">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-v27-latin-regular.svg">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-v27-latin-regular.ttf">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-v27-latin-regular.woff">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+    <Content Update="wwwroot\font\roboto-v27-latin-regular.woff2">
+      <CopyToOutputDirectory>Always</CopyToOutputDirectory>
+    </Content>
+  </ItemGroup>
+
 </Project>

EgwCoreLib.BlazorTest/Pages/TestBarcodeReader.razor

@@ -5,36 +5,43 @@
 <div class="card my-2">
     <div class="card-header"><h4>Test Barcode Reader</h4></div>
     <div class="card-body">
-        <BarcodeReader ScanResult="(e) => ScanDoneHandler(e)"
-                       ScanBtnTitle="Scan"
-                       ResetBtnTitle="Reset"
-                       CloseBtnTitle="Close"
-                       UseBuiltinDiv="false"
-                       @ref="barcodeReaderCustom"
-                       SelectDeviceBtnTitle="Select Device">
-        </BarcodeReader>
+        @if (ShowScanBarcode)
+        {
+            <BarcodeReader 
+            @ref="barcodeReaderCustom"
+            ScanResult="(e) => ScanDoneHandler(e)"
+            ScanBtnTitle="Scan"
+            ResetBtnTitle="Reset"
+            CloseBtnTitle="Close"
+            UseBuiltinDiv="false"
+            SelectDeviceBtnTitle="Select Device">
+            </BarcodeReader>
 
-        <div @ref="barcodeReaderCustom.Element" class="d-flex  justify-content-center">
-            @* <div style="width: 480px; max-width: 100%"> *@
-            <div class="col-12 col-md-8 col-lg-6">
-                <button class="btn btn-outline-success p-2 m-1 w-25" data-action="startButton">Scan</button>
-                <button class="btn btn-outline-success p-2 m-1 w-25" data-action="resetButton">Reset</button>
+            <div @ref="barcodeReaderCustom.Element" class="d-flex justify-content-center">
+                <div class="col-12 col-md-8 col-lg-6">
+                    <button class="btn btn-outline-success p-2 m-1 w-25" data-action="startButton">Scan</button>
+                    <button class="btn btn-outline-success p-2 m-1 w-25" data-action="resetButton">Reset</button>
+                    <button class="btn btn-outline-success p-2 m-1 w-25" @onclick="() => ToggleCodeScan()">Close</button>
 
-                <div data-action="sourceSelectPanel" style="display:none">
-                    <label for="sourceSelect">Source:</label>
-                    <select data-action="sourceSelect" style="max-width:100%" class="form-control">
-                    </select>
-                </div>
-                <div>
-                    <video id="video" playsinline="true" autoplay="true" class="w-100 h-100 border rounded shadow" muted="true"></video>
+                    <div data-action="sourceSelectPanel" style="display:none">
+                        <label for="sourceSelect">Source:</label>
+                        <select data-action="sourceSelect" style="max-width:100%" class="form-control">
+                        </select>
+                    </div>
+                    <div>
+                        <video id="video" playsinline="true" autoplay="true" class="w-100 h-100 border rounded shadow shadow-lg image-mirror" muted="true"></video>
+                    </div>
                 </div>
             </div>
-        </div>
+        }
+        else
+        {
+            <button class="btn btn-outline-success p-2 m-1 w-25" @onclick="() => ToggleCodeScan()">Open</button>
+        }
     </div>
 </div>
 
 @code {
-    private int currentCount = 0;
 
     protected BarcodeReader barcodeReaderCustom { get; set; } = null!;
     protected Random rnd = new Random();
@@ -42,36 +49,17 @@
     {
         await Task.Delay(1);
     }
-    private void IncrementCount()
-    {
-        currentCount++;
-    }
 
     protected override void OnInitialized()
     {
         base.OnInitialized();
-        listBord01 = new();
-        listBord01.Add("");
-        listBord01.Add("White");
-        listBord01.Add("");
-        listBord01.Add("");
-        listBord02 = new();
-        listBord02.Add("");
-        listBord02.Add("White");
-        listBord02.Add("");
-        listBord02.Add("White");
-        listBord03 = new();
-        listBord03.Add("");
-        listBord03.Add("White");
-        listBord03.Add("");
-        listBord03.Add("Blue");
-
     }
 
-
-    protected List<string> listBord01 { get; set; } = new();
-    protected List<string> listBord02 { get; set; } = new();
-    protected List<string> listBord03 { get; set; } = new();
-
     protected string qrCodeVal { get; set; } = "https://office.egalware.com/WDC/UI";
+
+    protected void ToggleCodeScan()
+    {
+        ShowScanBarcode = !ShowScanBarcode;
+    }
+    private bool ShowScanBarcode = true;
 }

EgwCoreLib.BlazorTest/Pages/TestBarcodeReader.razor.css

@@ -0,0 +1,7 @@
+.image-mirror {
+  transform: rotateY(180deg);
+  -webkit-transform: rotateY(180deg);
+  /* Safari and Chrome */
+  -moz-transform: rotateY(180deg);
+  /* Firefox */
+}

EgwCoreLib.BlazorTest/Pages/TestBarcodeReader.razor.less

@@ -0,0 +1,5 @@
+.image-mirror {
+    transform: rotateY(180deg);
+    -webkit-transform: rotateY(180deg); /* Safari and Chrome */
+    -moz-transform: rotateY(180deg); /* Firefox */
+}

EgwCoreLib.BlazorTest/Pages/TestBarcodeReader.razor.min.css

@@ -0,0 +1 @@
+.image-mirror{transform:rotateY(180deg);-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);}

EgwCoreLib.BlazorTest/Pages/TestCalendario.razor

@@ -6,40 +6,48 @@
     <div class="card-header">
         <h3>Test Calendario + Gauges</h3>
     </div>
-    <div class="card-body py-1">
-
-        <div class="row bg-dark">
-            <div class="col">
-                <CircleGauge maxVal="480" currVal="240" Titolo="4:00" Testo="Lavorate"></CircleGauge>
-            </div>
-            <div class="col">
-                <CircleGauge maxVal="480" currVal="360" Titolo="6:00" Testo="Lavorate"></CircleGauge>
-            </div>
-            <div class="col">
-                <CircleGauge maxVal="480" currVal="480" Titolo="8:00" Testo="Lavorate"></CircleGauge>
-            </div>
-            <div class="col">
-                <CircleGauge maxVal="480" currVal="600" Titolo="10:00" Testo="Lavorate"></CircleGauge>
-            </div>
-        </div>
+    <div class="card-body py-0">
 
         <div class="row bg-dark py-3">
-            <div class="col">
-                <CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek"></CalendarMonth>
+            <div class="col-12 col-md-6">
+                <CalendarWeek DateList="@ListDate" EventList="@EventListWeek" PercX="150" PercY="0" backToCalendar="ForceReloadWeek" EC_HeadDateSel="SetDayDetail"></CalendarWeek>
+            </div>
+            <div class="col-12 col-md-6">
+                <div class="row bg-dark">
+                    <div class="col">
+                        <CircleGauge maxVal="480" currVal="240" Titolo="4:00" Testo="Lavorate"></CircleGauge>
+                    </div>
+                    <div class="col">
+                        <CircleGauge maxVal="480" currVal="360" Titolo="6:00" Testo="Lavorate"></CircleGauge>
+                    </div>
+                    <div class="col">
+                        <CircleGauge maxVal="480" currVal="480" Titolo="8:00" Testo="Lavorate"></CircleGauge>
+                    </div>
+                    <div class="col">
+                        <CircleGauge maxVal="480" currVal="600" Titolo="10:00" Testo="Lavorate"></CircleGauge>
+                    </div>
+                </div>
+
+                <div class="row bg-dark py-3">
+                    <div class="col">
+                        <CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek"></CalendarMonth>
+                    </div>
+                </div>
+
+                <div class="d-flex justify-content-between">
+                    <div>
+                        <b>@($"{dtCurr:ddd dd.MM.yyyy}")</b>
+                    </div>
+                    <div>
+                        <button class="btn btn-primary" @onclick="() => resetCal()">Reset</button>
+                    </div>
+                    <div>
+                        single: <b>@singleWeek</b>
+                    </div>
+                </div>
             </div>
         </div>
 
-        <div class="d-flex justify-content-between">
-            <div>
-                <b>@($"{dtCurr:ddd dd.MM.yyyy}")</b>
-            </div>
-            <div>
-                <button class="btn btn-primary" @onclick="() => resetCal()">Reset</button>
-            </div>
-            <div>
-                single: <b>@singleWeek</b>
-            </div>
-        </div>
     </div>
 </div>
 

EgwCoreLib.BlazorTest/Pages/TestCalendario.razor.cs

@@ -1,3 +1,5 @@
+using EgwCoreLib.Razor.Data;
+
 namespace EgwCoreLib.BlazorTest.Pages
 {
     public partial class TestCalendario
@@ -8,15 +10,22 @@ namespace EgwCoreLib.BlazorTest.Pages
         {
             dtCurr = DateTime.Today;
             await Task.Delay(1);
+            setupMonthSim();
+
+            // preparo calendario settimanale...
+            setupWeekSim();
+        }
+
+        private void setupMonthSim()
+        {
             DateCheck = new Dictionary<DateTime, string>();
-            Random rnd = new Random();
             // random colorate...
             for (int i = 0; i < 10; i++)
             {
                 DateTime newDate = dtCurr.AddDays(rnd.Next(-5, 10)).Date;
                 if (!DateCheck.ContainsKey(newDate))
                 {
-                    DateCheck.Add(newDate, "bg-success text-light rounded-circle p-2");
+                    DateCheck.Add(newDate, "bg-danger text-light rounded-circle p-2");
                 }
                 else
                 {
@@ -25,6 +34,61 @@ namespace EgwCoreLib.BlazorTest.Pages
             }
         }
 
+        /// <summary>
+        /// Forza ricaricamento week
+        /// </summary>
+        protected void ForceReloadWeek()
+        {
+            // preparo calendario settimanale...
+            setupWeekSim();
+        }
+
+        protected void SetDayDetail(DateTime selDate)
+        {
+
+            var tmpDays = ListDate.Where(x => x.Equals(selDate)).ToList();
+            var tmpEv = EventListWeek.Where(x => x.Inizio.Date.Equals(selDate)).ToList();
+            // salvo valori simulati
+            ListDate = tmpDays;
+            EventListWeek = tmpEv;
+        }
+
+        protected Random rnd = new Random();
+        private void setupWeekSim()
+        {
+            DateTime oggi = DateTime.Today;
+            var tmpDays = new List<DateTime>();
+            var tmpEv = new List<CalendarEvent>();
+            for (int i = 0; i < 5; i++)
+            {
+                tmpDays.Add(oggi.AddDays(i));
+                // genero qualche evento da 0 a 6...
+                int numEv = rnd.Next(0, 8);
+                if (numEv > 0)
+                {
+                    for (int e = 0; e < numEv; e++)
+                    {
+                        int inizio = rnd.Next(8, 12);
+                        int fine = inizio + rnd.Next(2,8);
+                        CalendarEvent newEv = new CalendarEvent()
+                        {
+                            CssClass = "bg-success opacity-25",
+                            Description = $"Permesso #{e}, testo molto lungo per provare andata a capo con o senza un segnaposto",
+                            Type = "PERM",
+                            Inizio = oggi.AddDays(i).AddHours(inizio),
+                            Fine = oggi.AddDays(i).AddHours(fine),
+                            Title = "O.S.",
+                            ToolTip = $"O.S. {oggi.AddDays(i).AddHours(inizio)} - {oggi.AddDays(i).AddHours(fine)}"
+                        };
+                        tmpEv.Add(newEv);
+                    }
+                }
+            }
+            // salvo valori simulati
+            ListDate = tmpDays;
+            EventListWeek = tmpEv;
+        }
+
         #endregion Protected Methods
 
         #region Private Fields
@@ -37,6 +101,9 @@ namespace EgwCoreLib.BlazorTest.Pages
 
         private DateTime dtCurr { get; set; } = DateTime.Today;
 
+        private List<DateTime> ListDate { get; set; } = new List<DateTime>();
+        private List<CalendarEvent> EventListWeek { get; set; } = new List<CalendarEvent>();
+
         private bool singleWeek = false;
 
         #endregion Private Properties
@@ -46,7 +113,7 @@ namespace EgwCoreLib.BlazorTest.Pages
         private void DisplayDate(DateTime dtSel)
         {
             dtCurr = dtSel;
-            singleWeek= true;
+            singleWeek = true;
         }
 
         private async Task resetCal()

EgwCoreLib.BlazorTest/Pages/TestChart.razor

@@ -44,13 +44,13 @@
                 </div>
                 <div class="col-2 text-center">
                     <div>
-                        <Doughnut Id="00" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
+                        <Doughnut Id="00" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors" BordWidth="1"></Doughnut>
                     </div>
                     <small>display con animazione</small>
                 </div>
                 <div class="col-2 text-center">
                     <div>
-                        <Doughnut Id="03" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
+                        <Doughnut Id="03" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors" BordWidth="3"></Doughnut>
                     </div>
                     <small>display con animazione</small>
                 </div>

EgwCoreLib.BlazorTest/Pages/TestChart.razor.cs

@@ -101,15 +101,15 @@ namespace EgwCoreLib.BlazorTest.Pages
                 answ.Add(currColor);
                 if (currColor > 7)
                 {
-                    colors.Add(new DoughnutStyling("#28FF69", "ccc"));
+                    colors.Add(new DoughnutStyling("#28FF69", "#00AA00"));
                 }
                 else if (currColor > 3)
                 {
-                    colors.Add(new DoughnutStyling("orange", "ccc"));
+                    colors.Add(new DoughnutStyling("orange", "#99AA00"));
                 }
                 else
                 {
-                    colors.Add(new DoughnutStyling("red", "ccc"));
+                    colors.Add(new DoughnutStyling("red", "#FF6969"));
                 }
             }
             return answ.ToArray();

EgwCoreLib.BlazorTest/Pages/TestComponenti.razor

@@ -1,18 +1,20 @@
 @page "/TestComponenti"
+@using EgwCoreLib.Utils
+@using static EgwCoreLib.Razor.Sorter
 
 @inject NavigationManager NavMan
 @implements IDisposable
 
 <PageTitle>Test</PageTitle>
 
-<div class="card">
+<div class="card shadow">
     <div class="card-header">
         <h1>Test Componenti custom</h1>
     </div>
-    <div class="card-body py-1">
+    <div class="card-body py-4">
         <div class="row">
             <div class="col-3">
-                <div class="card">
+                <div class="card shadow">
                     <div class="card-header">
                         Test Image
                     </div>
@@ -22,7 +24,7 @@
                 </div>
             </div>
             <div class="col-3">
-                <div class="card">
+                <div class="card shadow">
                     <div class="card-header">
                         Input password
                     </div>
@@ -45,13 +47,16 @@
                 </div>
             </div>
             <div class="col-3">
-                <div class="card">
+                <div class="card shadow">
                     <div class="card-header">
                         Input Speciali
                     </div>
                     <div class="card-body py-1">
                         <small>Test copia clipboard, GUID (presudo)random</small>
                         <CopyToClipboard Text="@textToCopy"></CopyToClipboard>
+                        <br />
+                        <small>Test copia clipboard, valore hidden</small>
+                        <CopyToClipboard Text="@textToCopy" ShowText="false"></CopyToClipboard>
                         <hr />
                         <small>Input numerico con gestione cifre (es x double)</small>
                         <NumInput CssClass="form-control" @bind-Value="@valDecimale"></NumInput>
@@ -62,7 +67,7 @@
                 </div>
             </div>
             <div class="col-3">
-                <div class="card">
+                <div class="card shadow">
                     <div class="card-header">
                         QueryString
                     </div>
@@ -125,19 +130,137 @@
                     </div>
                 </div>
             </div>
+            <div class="col-3">
+                <div class="card">
+                    <div class="card-header"><h4>Test toggler</h4></div>
+                    <div class="card-body">
+                        <Toggler SelFilter="@TogFilter"></Toggler>
+                        <br />
+                        <NumInput Value="@numero"></NumInput>
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card">
+                    <div class="card-header"><h4>Test switch pager</h4></div>
+                    <div class="card-body">
+                        <span class="form-check form-switch">
+                            <label class="form-check-label">Small Pager</label>
+                            <input class="form-check-input" type="checkbox" @bind="@ShowSmallPager">
+                        </span>
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card">
+                    <div class="card-header"><h4>Test Sorter</h4></div>
+                    <div class="card-body">
+                        <table class="table table-sm table-striped table-responsive-lg">
+                            <thead>
+
+                                <tr>
+                                    <th>
+                                        Col A
+                                        <Sorter ParamName="ColA" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter>
+                                    </th>
+                                    <th>
+                                        ColB
+                                        <Sorter ParamName="ColB" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter>
+                                    </th>
+                                    <th>
+                                        Col C
+                                        <Sorter ParamName="ColC" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter>
+                                    </th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>Sort param</td>
+                                    <td>@sortField</td>
+                                    <td>@sortAsc</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card">
+                    <div class="card-header"><h4>Test RadioButtons</h4></div>
+                    <div class="card-body">
+                        <div>Multi</div>
+                        <MultiButton ListValues="@ListButtons" EC_ValueChanged="SaveRBLSel"></MultiButton>
+                        <div>Single</div>
+                        <MultiButton ListValues="@ListChecks" ClassSel="btn-warning" ClassDesel="btn-secondary opacity-50" EC_ValueChanged="SaveRBLSel" MultiSel="false"></MultiButton>
+                        <hr />
+                        <p>@valSel</p>
+                    </div>
+                </div>
+            </div>
+            <div class="col-4">
+                <div class="card">
+                    <div class="card-header"><h4>Test Periodo</h4></div>
+                    <div class="card-body  small">
+                        <h5>Default</h5>
+                        <PeriodoSel></PeriodoSel>
+                        <hr />
+                        <h5>Custom labels</h5>
+                        <PeriodoSel DictSelect="@CustomSelDict"></PeriodoSel>
+                        <hr />
+                        <hr />
+                        <h5>Condensed</h5>
+                        <div class="condensed">
+                            <PeriodoSel DictSelect="@CustomSelDict"></PeriodoSel>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
+    <div class="card-footer">
+        @if (ShowSmallPager)
+        {
+            <DataPager currPage="1" totalCount="@numero" NumPages="4" DisplSize="DataPager.ObjSize.small"></DataPager>
+        }
+        else
+        {
+            <DataPager currPage="1" totalCount="@numero"></DataPager>
+        }
+    </div>
 </div>
 
 
 
 @code {
 
+    protected void SaveRBLSel(MultiButton.ItemData newVal)
+    {
+        valSel = $"{newVal.Text}: sel: {newVal.Selected}";
+    }
+
+    Toggler.SelectGlobalToggle TogFilter { get; set; } = new Toggler.SelectGlobalToggle();
     protected string textToCopy = $"{Guid.NewGuid()}";
     protected decimal valDecimale = 12345;
 
     private string qsNome = "";
     private int qsIntero = -1;
+    private int numero = 0;
+
+    private bool sortAsc = false;
+    private string sortField = "";
+
+    protected void SortRequested(SortCallBack e)
+    {
+        if (sortField == e.ParamName)
+        {
+            sortAsc = e.IsAscending;
+        }
+        sortField = e.ParamName;
+    }
+
+    private bool ShowSmallPager { get; set; } = false;
+
+    protected Random rnd = new Random();
 
     protected override void OnInitialized()
     {
@@ -145,7 +268,66 @@
         qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
         qsIntero = NavMan.ExtractQueryStringByKey<int>("Intero");
         NavMan.LocationChanged += LocationChanged;
+        // toggler!
+        TogFilter = new()
+        {
+            isActive = true,
+            leftString = "opzione sx",
+            rightString = "opzione dx"
+        };
+
+        //test input
+        numero = rnd.Next(100, 300);
+
+        // preparo buttons
+        ListButtons = new List<MultiButton.ItemData>();
+        for (int i = 1; i <= 4; i++)
+        {
+            ListButtons.Add(new MultiButton.ItemData()
+            {
+                CodItem = $"B{i:00}",
+                Ordinal = i,
+                Selected = false,
+                Text = $"Btn_{i:00}",
+                Tooltip = $"Toggle Button {i:00}"
+            });
+        }
+
+        // preparo checks
+        ListChecks = new List<MultiButton.ItemData>();
+        for (int i = 1; i <= 4; i++)
+        {
+            ListChecks.Add(new MultiButton.ItemData()
+            {
+                CodItem = $"B{i:00}",
+                Ordinal = i,
+                Selected = false,
+                Text = $"Chk_{i:00}",
+                Tooltip = $"Switch {i:00}"
+            });
+        }
+
+        // preparo sel periodo custom (es traduzioni)...
+        CustomSelDict = Enum.GetValues(typeof(DtUtils.PeriodSet))
+                                   .Cast<DtUtils.PeriodSet>()
+                                   .ToDictionary(e => e, e => Traduci(e.ToString()));
     }
+
+    /// <summary>
+    /// Mockup traduzione termini
+    /// </summary>
+    /// <param name="lemma"></param>
+    /// <returns></returns>
+    private string Traduci(string lemma)
+    {
+        return $"IT | {lemma}";
+    }
+
+    /// <summary>
+    /// Periodo custom selezione valori
+    /// </summary>
+    private Dictionary<DtUtils.PeriodSet, string>? CustomSelDict = new();
+
     async void LocationChanged(object sender, LocationChangedEventArgs e)
     {
         qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
@@ -157,4 +339,10 @@
     {
         NavMan.LocationChanged -= LocationChanged;
     }
+
+
+    private List<MultiButton.ItemData>? ListButtons = null;
+    private string valSel = "";
+    private List<MultiButton.ItemData>? ListChecks = null;
+    private string checkSel = "";
 }

EgwCoreLib.BlazorTest/Pages/TestDialog.razor

@@ -0,0 +1,98 @@
+@page "/TestDialog"
+
+<div class="card">
+    <div class="card-header">
+        <h3>Pure Blazor Prompt Test</h3>
+    </div>
+    <div class="card-body">
+
+
+        <button class="btn btn-primary" @onclick="ShowMessage">Show Message</button>
+        <button class="btn btn-warning" @onclick="ShowConfirm">Show Confirm</button>
+        <button class="btn btn-success" @onclick="ShowPrompt">Show Prompt</button>
+        <button class="btn btn-info" @onclick="ShowMulti">Show Multi</button>
+
+        <hr />
+        <p>@resultMessage</p>
+    </div>
+</div>
+
+<BootstrapModal @ref="modal" Title=@cTitle Message=@cMessage Mode=@cMode Placeholder=@cPlaceholder UserInput=@cUserInput Size="BootstrapModal.ModalSize.Normal" UserOptions=@cOpt SelectOptions=@sOpt BigButtons=@cBigBtn TitleCss="bg-secondary bg-opacity-25 bg-gradient" />
+
+@code {
+    private BootstrapModal? modal;
+    private string resultMessage = "";
+
+    private string cTitle = "";
+    private string cMessage = "";
+    private string cPlaceholder = "";
+    private string cUserInput = "";
+    private bool cBigBtn = false;
+    private Dictionary<bool, string>? cOpt = null;
+    private Dictionary<string, string>? sOpt = null;
+    private BootstrapModal.ModalMode cMode = BootstrapModal.ModalMode.ND;
+
+
+    private async Task ShowMessage()
+    {
+        cTitle = "Information";
+        cMessage = "This is a standard message.";
+        cMode = BootstrapModal.ModalMode.Message;
+        cOpt = null;
+        sOpt = null;
+        cBigBtn = false;
+
+        await modal!.ShowAsync<bool>();
+        resultMessage = "Message closed.";
+    }
+
+    private async Task ShowConfirm()
+    {
+        cTitle = "Confirm Action";
+        cMessage = "Are you sure you want to continue?";
+        cMode = BootstrapModal.ModalMode.Confirm;
+        cOpt = new();
+        cOpt.Add(true, "Si");
+        cOpt.Add(false, "No");
+        sOpt = null;
+        cBigBtn = true;
+
+        bool confirmed = await modal!.ShowAsync<bool>();
+        resultMessage = confirmed ? "User confirmed." : "User cancelled.";
+    }
+
+    private async Task ShowPrompt()
+    {
+        cTitle = "Enter Name";
+        cMessage = "What is your name?";
+        cPlaceholder = "Type your name...";
+        cUserInput = "";
+        cMode = BootstrapModal.ModalMode.Prompt;
+        cOpt = null;
+        sOpt = null;
+        cBigBtn = false;
+
+        string? name = await modal!.ShowAsync<string?>();
+        resultMessage = name is null ? "User cancelled." : $"Hello, {name}!";
+    }
+
+    private async Task ShowMulti()
+    {
+        cTitle = "Environment";
+        cOpt = null;
+        sOpt = new();
+        sOpt.Add("Window", "Finestre");
+        sOpt.Add("Beam", "Travi");
+        sOpt.Add("Wall", "Pareti");
+
+        cMessage = "";
+        // cMessage = "Selezionare Envir desiderato (LUX)";
+        // cPlaceholder = "Type your name...";
+        // cUserInput = "";
+        cMode = BootstrapModal.ModalMode.Select;
+        cBigBtn = false;
+
+        string? name = await modal!.ShowAsync<string?>();
+        resultMessage = name == null ? "User Canceled" : $"Selection: {name}";
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestGraphCompo.razor

@@ -2,8 +2,8 @@
 
 <PageTitle>Test</PageTitle>
 
-<div class="card">
-    <div class="card-header"><h4>Test Componenti Arrow SVG</h4></div>
+<div class="card shadow ">
+    <div class="card-header"><h4>Test Grapth Compo: Arrow SVG</h4></div>
     <div class="card-body">
         <div class="row bg-secondary py-2">
             <div class="col">
@@ -22,8 +22,8 @@
     </div>
 </div>
 
-
 @code {
+
     private int currentCount = 0;
 
     protected Random rnd = new Random();
@@ -46,10 +46,8 @@
         listBord03.Add("White");
         listBord03.Add("");
         listBord03.Add("Blue");
-
     }
 
-
     protected List<string> listBord01 { get; set; } = new();
     protected List<string> listBord02 { get; set; } = new();
     protected List<string> listBord03 { get; set; } = new();

EgwCoreLib.BlazorTest/Pages/TestHwInfo.razor

@@ -0,0 +1,237 @@
+@page "/TestHwInfo"
+@using DeviceId
+@using EgwCoreLib.Utils
+
+@if (isLoading)
+{
+    <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
+}
+else
+{
+    <div class="row small" style="font-size: 0.8rem;">
+        <div class="col-6">
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    Device ID
+                </li>
+                @if (ListDevId != null && ListDevId.Count > 0)
+                {
+                    @foreach (var item in ListDevId)
+                    {
+                        <li class="list-group-item d-flex justify-content-between">
+                            <div class="px-1">@item.Key</div>
+                            <div class="px-1">@item.Value</div>
+                        </li>
+                    }
+                }
+            </ul>
+        </div>
+        <div class="col-6">
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    Sublicense
+                </li>
+                <li class="list-group-item d-flex justify-content-between">
+                    <div class="px-1">CodImpiego</div>
+                    <div class="px-1">@codImpiego</div>
+                </li>
+                <li class="list-group-item d-flex justify-content-between">
+                    <div class="px-1">Payload</div>
+                    <div class="px-1">@decVal</div>
+                </li>
+                <li class="list-group-item d-flex justify-content-between">
+                    <div class="px-1">AppKey</div>
+                    <div class="px-1">@appKey</div>
+                </li>
+                <li class="list-group-item d-flex justify-content-between">
+                    <button class="btn btn-info btn-sm w-100" @onclick="Regenerate">ReGen</button>
+                </li>
+            </ul>
+        </div>
+        <div class="col-4">
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    Machine Info
+                </li>
+                @if (ListAllMacInfo != null && ListAllMacInfo.Count > 0)
+                {
+                    @foreach (var item in ListAllMacInfo)
+                    {
+                        <li class="list-group-item d-flex justify-content-between">
+                            <div class="px-1">@item.Key</div>
+                            <div class="px-1">@item.Value</div>
+                        </li>
+                    }
+                }
+            </ul>
+        </div>
+        <div class="col-4">
+            @if (ListUserInfo != null && ListUserInfo.Count > 0)
+            {
+                <ul class="list-group">
+                    <li class="list-group-item active">
+                        UserInfo
+                    </li>
+                    @foreach (var item in ListUserInfo)
+                    {
+                        <li class="list-group-item d-flex justify-content-between">
+                            <div class="px-1">@item.Key</div>
+                            <div class="px-1">@item.Value</div>
+                        </li>
+                    }
+                </ul>
+            }
+            @if (ListNetInfo != null && ListNetInfo.Count > 0)
+            {
+                <br />
+                <ul class="list-group">
+                    <li class="list-group-item active">
+                        NetInfo
+                    </li>
+                    @foreach (var item in ListNetInfo)
+                    {
+                        <li class="list-group-item d-flex justify-content-between">
+                            <div class="px-1">@item.Key</div>
+                            <div class="px-1">@item.Value</div>
+                        </li>
+                    }
+                </ul>
+            }
+        </div>
+        <div class="col-4">
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    CpuInfo
+                </li>
+                @foreach (var item in ListOsInfo)
+                {
+                    <li class="list-group-item d-flex justify-content-between">
+                        <div class="px-1">@item.Key</div>
+                        <div class="px-1">@item.Value</div>
+                    </li>
+                }
+            </ul>
+            <br />
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    OsInfo
+                </li>
+                @foreach (var item in ListOsInfo)
+                {
+                    <li class="list-group-item d-flex justify-content-between">
+                        <div class="px-1">@item.Key</div>
+                        <div class="px-1">@item.Value</div>
+                    </li>
+                }
+            </ul>
+            <br />
+            <ul class="list-group">
+                <li class="list-group-item active">
+                    VolInfo
+                </li>
+                @foreach (var item in ListVolInfo)
+                {
+                    <li class="list-group-item d-flex justify-content-between">
+                        <div class="px-1">@item.Key</div>
+                        <div class="px-1">@item.Value</div>
+                    </li>
+                }
+            </ul>
+        </div>
+    </div>
+
+}
+
+@code {
+    protected Dictionary<string, string> ListAllMacInfo { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListCpuInfo { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListDevId { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListNetInfo { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListOsInfo { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListUserInfo { get; set; } = new Dictionary<string, string>();
+    protected Dictionary<string, string> ListVolInfo { get; set; } = new Dictionary<string, string>();
+
+    protected MachineDataValidator MDValidator { get; set; } = new MachineDataValidator();
+
+    protected SubLicManager SubLicManager { get; set; } = new SubLicManager();
+
+    protected string codImpiego = "";
+    protected string appKey = "";
+    protected string decVal = "";
+
+    private bool isLoading { get; set; } = true;
+
+    protected override async Task OnInitializedAsync()
+    {
+        isLoading = true;
+        await InvokeAsync(StateHasChanged);
+        await Task.Run(() =>
+        {
+            GetInfo();
+        });
+        Regenerate();
+        isLoading = false;
+        await InvokeAsync(StateHasChanged);
+    }
+
+    protected void GetInfo()
+    {
+        string deviceId = "";
+        deviceId = new DeviceIdBuilder()
+                            .OnWindows(windows => windows.AddWindowsDeviceId())
+                                .ToString();
+        ListDevId.Add("DevId_01", deviceId);
+
+        deviceId = new DeviceIdBuilder()
+                        .AddMachineName()
+                        .AddOsVersion()
+                        // .AddFileToken("machine.uid")
+                        .ToString();
+        ListDevId.Add("DevId_02", deviceId);
+
+        deviceId = new DeviceIdBuilder()
+                        .AddMachineName()
+                        .AddUserName()
+                        .AddOsVersion()
+                        .OnWindows(windows => windows
+                            .AddMacAddressFromWmi(excludeWireless: true, excludeNonPhysical: true)
+                            .AddProcessorId()
+                            .AddMotherboardSerialNumber()
+                            .AddSystemDriveSerialNumber())
+                        // .OnLinux(linux => linux
+                        //     .AddMotherboardSerialNumber()
+                        //     .AddSystemDriveSerialNumber())
+                        // .OnMac(mac => mac
+                        //     .AddSystemDriveSerialNumber()
+                        //     .AddPlatformSerialNumber())
+                        .ToString();
+        ListDevId.Add("DevId_03", deviceId);
+
+        ListNetInfo = new Dictionary<string, string>(MachineDataValidator.netInfo);
+        ListOsInfo = new Dictionary<string, string>(MachineDataValidator.osInfo);
+        ListUserInfo = new Dictionary<string, string>(MachineDataValidator.userInfo);
+        ListCpuInfo = new Dictionary<string, string>(MachineDataValidator.cpuInfo);
+        ListVolInfo = new Dictionary<string, string>(MachineDataValidator.volInfo);
+
+        ListAllMacInfo = new Dictionary<string, string>(MachineDataValidator.userInfo);
+        foreach (var item in MachineDataValidator.netInfo)
+        {
+            if (!ListAllMacInfo.ContainsKey(item.Key))
+            {
+                ListAllMacInfo.Add(item.Key, item.Value);
+            }
+        }
+
+    }
+
+    protected void Regenerate()
+    {
+        isLoading = true;
+        codImpiego = SubLicManager.CodImpiego();
+        appKey = SubLicManager.GenKey(passphrase, false);
+        decVal = SteamCrypto.DecryptString(appKey, passphrase);
+        isLoading = false;
+    }
+
+    private string passphrase = "SaltPass";
+}

EgwCoreLib.BlazorTest/Pages/TestInput.razor

@@ -0,0 +1,50 @@
+@page "/TestInput"
+
+<PageTitle>TestInput</PageTitle>
+
+
+<div class="card">
+    <div class="card-header">
+        <h3>Test Input Specializzati</h3>
+    </div>
+    <div class="card-body py-1">
+        <div class="row">
+             <div class="col-4">
+                 <div class="fs-4">
+                     Decimal
+                </div>
+                <div class="input-group">
+                    <InputDecimal Decimals="0" Step="0.001M" CssClass="form-control form-control-lg text-end w-auto" @bind-Value="@DecimalValue"></InputDecimal>
+                    <span class="input-group-text">Decimal 0</span>
+                </div>
+                <div class="input-group">
+                    <InputDecimal Decimals="3" Step="0.001M" CssClass="form-control form-control-lg text-end w-auto" @bind-Value="@DecimalValue"></InputDecimal>
+                    <span class="input-group-text">Decimal 3</span>
+                </div>
+            </div>
+            <div class="col-4">
+                <div class="fs-4">
+                    Percentage
+                </div>
+                <div class="input-group">
+                    <InputPercent CssClass="form-control form-control-lg text-end w-auto" @bind-Value="@PercValue" Decimals="0"></InputPercent>
+                    <span class="input-group-text">Percent P0</span>
+                </div>
+                <div class="input-group">
+                    <InputPercent CssClass="form-control form-control-lg text-end w-auto" @bind-Value="@PercValue" Decimals="2"></InputPercent>
+                    <span class="input-group-text">Percent P2</span>
+                </div>
+                <div class="input-group">
+                    <InputPercent CssClass="form-control form-control-lg text-end w-auto" @bind-Value="@PercValue" Decimals="2" ForceInvariantParsing="true"></InputPercent>
+                    <span class="input-group-text">Percent P2 Invariant</span>
+                </div>
+            </div>
+            <div class="col-4"></div>
+        </div>
+    </div>
+</div>
+
+@code {
+    private decimal DecimalValue = 0;
+    private decimal PercValue = 0.123M;
+}

EgwCoreLib.BlazorTest/Pages/TestParetoProgress.razor

@@ -0,0 +1,40 @@
+@page "/TestParetoProgress"
+
+
+<div class="card">
+    <div class="card-header">
+        <h3>Test Pareto ProgressBar</h3>
+    </div>
+    <div class="card-body py-1">
+        <div class="row">
+            @foreach (var dataSet in ListParetoTime)
+            {
+                <div class="col-4">
+                    <ParetoProgress ParetoData="@dataSet" Title="Demo Progress" />
+                </div>
+            }
+        </div>
+    </div>
+</div>
+
+
+@code {
+    private List<Dictionary<string, int>> ListParetoTime = new();
+
+
+    private Random rnd = new();
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+        ListParetoTime = new();
+        // simulazione...
+        for (int i = 0; i < 9; i++)
+        {
+            Dictionary<string, int> currSet = new();
+            currSet.Add("success", rnd.Next(2, 10));
+            currSet.Add("warning", rnd.Next(0, 10));
+            currSet.Add("danger", rnd.Next(1, 10));
+            ListParetoTime.Add(currSet);
+        }
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestRadzenSched.razor

@@ -0,0 +1,184 @@
+@page "/TestRadzenSched"
+@inject DialogService DialogService
+
+<PageTitle>Test Radzen  Scheduler</PageTitle>
+
+<div class="card">
+    <div class="card-header">
+        <h1>Test Radzen Scheduler</h1>
+    </div>
+    <div class="card-body">
+        @if (currView == "year" || currView == "planner")
+        {
+            <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0.5rem" class="rz-p-4 rz-mb-6 rz-border-radius-1" Style="border: var(--rz-grid-cell-border);">
+                <RadzenLabel Text="Schedule Start Month:" />
+                <RadzenSelectBar @bind-Value="@startMonth" TextProperty="Text" ValueProperty="Value" Data="@(Enum.GetValues(typeof(Month)).Cast<Month>().Select(t => new { Text = $"{t}", Value = t }))" Size="ButtonSize.Small" class="rz-display-none rz-display-xl-flex" />
+                <RadzenDropDown @bind-Value="@startMonth" Change="StartMonthChange" TextProperty="Text" ValueProperty="Value" Data="@(Enum.GetValues(typeof(Month)).Cast<Month>().Select(t => new { Text = $"{t}", Value = t }))" class="rz-display-inline-flex rz-display-xl-none" />
+            </RadzenStack>
+        }
+        else
+        {
+            <h3>@currView</h3>
+        }
+        <div style="@schedHeight">
+            <RadzenScheduler @ref=@scheduler SlotRender=@OnSlotRender style="height: 100%;" TItem="Appointment" Data=@appointments StartProperty="Start" EndProperty="End"
+                             TextProperty="Text" SelectedIndex="2"
+                             SlotSelect=@OnSlotSelect AppointmentSelect=@OnAppointmentSelect AppointmentRender=@OnAppointmentRender
+                             AppointmentMove=@OnAppointmentMove LoadData=OnLoadData>
+                <Template Context="appointments">
+                    <div>
+                        <strong>@appointments.Text</strong>
+                    </div>
+                    <small>
+                        @appointments.Detail
+                    </small>
+                </Template>
+                <ChildContent>
+                    <RadzenDayView />
+                    <RadzenWeekView />
+                    <RadzenMonthView />
+                    <RadzenYearPlannerView StartMonth="@startMonth" />
+                    @* <RadzenYearTimelineView StartMonth="@startMonth" /> *@
+                    <RadzenYearView StartMonth="@startMonth" />
+                </ChildContent>
+            </RadzenScheduler>
+        </div>
+        <EventConsole @ref=@console />
+    </div>
+</div>
+
+@code {
+
+    /* ------------------------------------------------
+     * Radzen Blazor
+     * https://www.radzen.com/blazor-components/
+     *
+     * dettagli installazione:
+     * NET6: https://blazor.radzen.com/get-started/net6-server
+     * NET8: https://blazor.radzen.com/get-started/net8
+     *
+     * Test componente Scheduler:
+     * https://blazor.radzen.com/scheduler?theme=material3
+     * https://blazor.radzen.com/docs/guides/components/scheduler.html
+     * ------------------------------------------------*/
+
+    RadzenScheduler<Appointment> scheduler;
+    EventConsole console;
+    Dictionary<DateTime, string> events = new Dictionary<DateTime, string>();
+
+    Month startMonth = Month.January;
+
+    bool showSelMonth { get; set; } = true;
+
+    async Task StartMonthChange()
+    {
+        await scheduler.Reload();
+    }
+
+
+    IList<Appointment> appointments = new List<Appointment>
+    {
+        new Appointment { Start = DateTime.Today.AddDays(-2), End = DateTime.Today.AddDays(-2), Text = "Birthday", Detail="My Birthday" },
+        new Appointment { Start = DateTime.Today.AddDays(-11), End = DateTime.Today.AddDays(-10), Text = "Day off", Detail="Rest required" },
+        new Appointment { Start = DateTime.Today.AddDays(-10), End = DateTime.Today.AddDays(-8), Text = "Work from home", Detail="WIP from remote" },
+        new Appointment { Start = DateTime.Today.AddHours(10), End = DateTime.Today.AddHours(12), Text = "Online meeting", Detail="Teams" },
+        new Appointment { Start = DateTime.Today.AddHours(10), End = DateTime.Today.AddHours(13), Text = "Skype call", Detail="Google Meet?" },
+        new Appointment { Start = DateTime.Today.AddHours(14), End = DateTime.Today.AddHours(14).AddMinutes(30), Text = "Dentist appointment", Detail="Anestetics" },
+        new Appointment { Start = DateTime.Today.AddDays(1), End = DateTime.Today.AddDays(12), Text = "Vacation", Detail="Long awaited!!!" },
+    };
+
+    void OnSlotRender(SchedulerSlotRenderEventArgs args)
+    {
+        // Highlight today in month view
+        if (args.View.Text == "Month" && args.Start.Date == DateTime.Today)
+        {
+            args.Attributes["style"] = "background: var(--rz-scheduler-highlight-background-color, rgba(255,220,40,.2));";
+        }
+
+        // Highlight working hours (9-18)
+        if ((args.View.Text == "Week" || args.View.Text == "Day") && args.Start.Hour > 8 && args.Start.Hour < 19)
+        {
+            args.Attributes["style"] = "background: var(--rz-scheduler-highlight-background-color, rgba(255,220,40,.2));";
+        }
+    }
+
+    async Task OnSlotSelect(SchedulerSlotSelectEventArgs args)
+    {
+        console.Log($"SlotSelect: Start={args.Start} End={args.End}");
+
+        if (args.View.Text != "Year")
+        {
+            Appointment data = await DialogService.OpenAsync<AddAppointmentPage>("Add Appointment",
+                new Dictionary<string, object> { { "Start", args.Start }, { "End", args.End } });
+
+            if (data != null)
+            {
+                appointments.Add(data);
+                // Either call the Reload method or reassign the Data property of the Scheduler
+                await scheduler.Reload();
+            }
+        }
+    }
+
+    async Task OnAppointmentSelect(SchedulerAppointmentSelectEventArgs<Appointment> args)
+    {
+        console.Log($"AppointmentSelect: Appointment={args.Data.Text}");
+
+        var copy = new Appointment
+            {
+                Start = args.Data.Start,
+                End = args.Data.End,
+                Text = args.Data.Text,
+                Detail = args.Data.Detail
+            };
+
+        var data = await DialogService.OpenAsync<EditAppointmentPage>("Edit Appointment", new Dictionary<string, object> { { "Appointment", copy } });
+
+        if (data != null)
+        {
+            // Update the appointment
+            args.Data.Start = data.Start;
+            args.Data.End = data.End;
+            args.Data.Text = data.Text;
+            args.Data.Detail = data.Detail;
+        }
+
+        await scheduler.Reload();
+    }
+
+    void OnAppointmentRender(SchedulerAppointmentRenderEventArgs<Appointment> args)
+    {
+        // Never call StateHasChanged in AppointmentRender - would lead to infinite loop
+
+        if (args.Data.Text == "Birthday")
+        {
+            args.Attributes["style"] = "background: red";
+        }
+    }
+
+    async Task OnAppointmentMove(SchedulerAppointmentMoveEventArgs args)
+    {
+        var draggedAppointment = appointments.FirstOrDefault(x => x == args.Appointment.Data);
+
+        if (draggedAppointment != null)
+        {
+            draggedAppointment.Start = draggedAppointment.Start + args.TimeSpan;
+
+            draggedAppointment.End = draggedAppointment.End + args.TimeSpan;
+
+            await scheduler.Reload();
+        }
+    }
+
+    async Task OnLoadData(SchedulerLoadDataEventArgs args)
+    {
+        await Task.Delay(1);
+        currView = scheduler.SelectedView.Text.ToLowerInvariant();
+
+        schedHeight = (currView == "year" || currView == "planner") ? "height: 50rem;" : "height: 40rem;";
+        // // Get the appointments for between the Start and End
+        // data = await MyAppointmentService.GetData(args.Start, args.End);
+    }
+    private string currView { get; set; } = "";
+    private string schedHeight { get; set; } = "height: 40rem;";
+}

EgwCoreLib.BlazorTest/Pages/ZZZ_TestOld.razor

@@ -1,161 +0,0 @@
-@page "/TestOld"
-
-<PageTitle>Test</PageTitle>
-
-<h1>Test</h1>
-
-
-<div class="row">
-    <div class="col-2">
-        <img src="_content/EgwCoreLib.Razor/images/LogoEgw.png" class="img-fluid" width="200" height="200" />
-        <PasswordBox></PasswordBox>
-        <PasswordBox ItemLabel="pwd"></PasswordBox>
-    </div>
-    <div class="col-10">
-        <TestJsInterop></TestJsInterop>
-        <div class="row">
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.AZTEC"></QrCodeDisplay>
-            </div>
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.QR_CODE"></QrCodeDisplay>
-            </div>
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.DATA_MATRIX" Width="400" Height="200"></QrCodeDisplay>
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.PDF_417" Width="600" Height="200"></QrCodeDisplay>
-            </div>
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.AZTEC"></QrCodeDisplay>
-            </div>
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.QR_CODE"></QrCodeDisplay>
-            </div>
-            <div class="col">
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.DATA_MATRIX" Width="400" Height="200"></QrCodeDisplay>
-                <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.PDF_417" Width="600" Height="200"></QrCodeDisplay>
-            </div>
-        </div>
-    </div>
-</div>
-
-<hr />
-
-
-<div class="row bg-secondary py-2">
-    <div class="col">
-        <StepArrow ObjId="123" StepText="Prova Arrow 01" BlockStyle="@($"fill: #123456;")" StrokeWidth="4" ObjW="650" ObjH="100" StrokeColors="@listBord01" TipAngle="90"></StepArrow>
-    </div>
-    <div class="col">
-        <StepArrow ObjId="456" StepText="Prova Arrow 02" BlockStyle="@($"fill: #456789;")" StrokeWidth="4" ObjW="600" ObjH="100" StrokeColors="@listBord02" TipAngle="60"></StepArrow>
-    </div>
-    <div class="col">
-        <StepArrow ObjId="456" StepText="Prova Arrow 03" BlockStyle="@($"fill: #6789AB;")" StrokeWidth="4" ObjW="500" ObjH="100" StrokeColors="@listBord03" TipAngle="120"></StepArrow>
-    </div>
-    <div class="col">
-        <StepArrow ObjId="456" StepText="Prova Arrow 04" BlockStyle="@($"fill: #89ABCD;")" StrokeWidth="0" ObjW="700" ObjH="100" TipAngle="108"></StepArrow>
-    </div>
-</div>
-
-<div class="row bg-secondary py-2">
-    <div class="col">
-        <ProgBar singleLine="true" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="true" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="true" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="true" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="true" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-</div>
-<div class="row bg-dark py-2">
-    <div class="col">
-        <ProgBar singleLine="false" baseUM="$" currVal="@(rnd.Next(50,250))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="false" baseUM="gg" currVal="@(rnd.Next(200,450))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="false" baseUM="min" currVal="@(rnd.Next(400,650))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="false" baseUM="px" currVal="@(rnd.Next(600,900))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-    <div class="col">
-        <ProgBar singleLine="false" baseUM="h" currVal="@(rnd.Next(500,1000))" maxVal="1000" redLim="200" yelLim="400" />
-    </div>
-</div>
-
-<BarcodeReader ScanResult="(e) => ScanDoneHandler(e)"
-               ScanBtnTitle="Scan"
-               ResetBtnTitle="Reset"
-               CloseBtnTitle="Close"
-               UseBuiltinDiv="false"
-@ref="barcodeReaderCustom"
-               SelectDeviceBtnTitle="Select Device">
-</BarcodeReader>
-
-<div @ref="barcodeReaderCustom.Element" class="d-flex  justify-content-center">
-    @* <div style="width: 480px; max-width: 100%"> *@
-    <div class="col-12 col-md-8 col-lg-6">
-        <button class="btn btn-outline-success p-2 m-1 w-25" data-action="startButton">Scan</button>
-        <button class="btn btn-outline-success p-2 m-1 w-25" data-action="resetButton">Reset</button>
-
-        <div data-action="sourceSelectPanel" style="display:none">
-            <label for="sourceSelect">Source:</label>
-            <select data-action="sourceSelect" style="max-width:100%" class="form-control">
-            </select>
-        </div>
-        <div>
-            <video id="video" playsinline="true" autoplay="true" class="w-100 h-100 border rounded shadow" muted="true"></video>
-        </div>
-    </div>
-</div>
-
-@code {
-    private int currentCount = 0;
-
-    protected BarcodeReader barcodeReaderCustom { get; set; } = null!;
-    protected Random rnd = new Random();
-    protected async Task ScanDoneHandler(string value)
-    {
-        await Task.Delay(1);
-    }
-    private void IncrementCount()
-    {
-        currentCount++;
-    }
-
-    protected override void OnInitialized()
-    {
-        base.OnInitialized();
-        listBord01 = new();
-        listBord01.Add("");
-        listBord01.Add("White");
-        listBord01.Add("");
-        listBord01.Add("");
-        listBord02 = new();
-        listBord02.Add("");
-        listBord02.Add("White");
-        listBord02.Add("");
-        listBord02.Add("White");
-        listBord03 = new();
-        listBord03.Add("");
-        listBord03.Add("White");
-        listBord03.Add("");
-        listBord03.Add("Blue");
-
-    }
-
-
-    protected List<string> listBord01 { get; set; } = new();
-    protected List<string> listBord02 { get; set; } = new();
-    protected List<string> listBord03 { get; set; } = new();
-
-    protected string qrCodeVal { get; set; } = "https://office.egalware.com/WDC/UI";
-}

EgwCoreLib.BlazorTest/Pages/_Layout.cshtml

@@ -1,4 +1,5 @@
 @using Microsoft.AspNetCore.Components.Web
+@using Radzen.Blazor
 @namespace EgwCoreLib.BlazorTest.Pages
 @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
 
@@ -8,11 +9,12 @@
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <base href="~/" />
-    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css" />
+    <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css" />
     <link rel="stylesheet" href="lib/font-awesome/css/all.min.css" />
     <link rel="stylesheet" href="css/site.css" />
     <link rel="stylesheet" href="EgwCoreLib.BlazorTest.styles.css" />
     <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
+    <component type="typeof(RadzenTheme)" render-mode="ServerPrerendered" param-Theme="@("material")" />
 </head>
 <body>
     @RenderBody()
@@ -29,6 +31,7 @@
     </div>
 
     <script src="lib/bootstrap/js/bootstrap.bundle.js"></script>
+    <script src="lib/bootstrapModalHelper.js"></script>
     @* <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> *@
     <script src="~/lib/Chart.js/chart.umd.js"></script>
 
@@ -63,5 +66,6 @@
     @*Gestione ricollegamento successivo: https://learn.microsoft.com/en-us/aspnet/core/blazor/fundamentals/signalr?view=aspnetcore-6.0*@
     @* <script>Blazor.defaultReconnectionHandler._reconnectCallback = function (d) { document.location.reload(); }</script> *@
 
+    <script src="_content/Radzen.Blazor/Radzen.Blazor.js?v=@(typeof(Radzen.Colors).Assembly.GetName().Version)"></script>
 </body>
 </html>

EgwCoreLib.BlazorTest/Program.cs

@@ -1,6 +1,8 @@
 using EgwCoreLib.BlazorTest;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Radzen;
 
 var builder = WebApplication.CreateBuilder(args);
 
@@ -8,6 +10,15 @@ var builder = WebApplication.CreateBuilder(args);
 builder.Services.AddRazorPages();
 builder.Services.AddServerSideBlazor();
 
+// aggiunto compressione
+builder.Services.AddResponseCompression(options =>
+{
+    options.EnableForHttps = true;
+});
+
+// aggiungo componenti radzen
+builder.Services.AddRadzenComponents();
+
 var app = builder.Build();
 
 // Configure the HTTP request pipeline.
@@ -18,11 +29,14 @@ if (!app.Environment.IsDevelopment())
     app.UseHsts();
 }
 
-//// disabilita risposta compressa in debug
-//if (!app.Environment.IsDevelopment())
-//{
-//    app.UseResponseCompression();
-//}
+
+app.UsePathBase("/BlazorTest/");
+
+// disabilita risposta compressa in debug
+if (!app.Environment.IsDevelopment())
+{
+    app.UseResponseCompression();
+}
 
 app.UseHttpsRedirection();
 

EgwCoreLib.BlazorTest/Properties/launchSettings.json

@@ -7,7 +7,7 @@
         "ASPNETCORE_ENVIRONMENT": "Development"
       },
       "dotnetRunMessages": true,
-      "applicationUrl": "https://localhost:7118;http://localhost:5145"
+      "applicationUrl": "https://localhost:7118;http://localhost:5146"
     },
     "IIS Express": {
       "commandName": "IISExpress",
@@ -22,7 +22,7 @@
       "launchUrl": "https://localhost:7118",
       "environmentVariables": {
         "ASPNETCORE_ENVIRONMENT": "Development",
-        "ASPNETCORE_URLS": "https://localhost:7118;http://localhost:5145"
+        "ASPNETCORE_URLS": "https://localhost:7118;http://localhost:5146"
       },
       "distributionName": ""
     }

EgwCoreLib.BlazorTest/Shared/MainLayout.razor

@@ -13,6 +13,7 @@
 
         <article class="content px-2">
             @Body
+            <RadzenComponents />
         </article>
 
         <div class="fixed-bottom bottom-row">

EgwCoreLib.BlazorTest/_Imports.razor

@@ -10,4 +10,6 @@
 @using EgwCoreLib.BlazorTest.Components
 @using EgwCoreLib.BlazorTest.Shared
 @using EgwCoreLib.Razor
-@using EgwCoreLib.Razor.Data
+@using EgwCoreLib.Razor.Data
+@using Radzen
+@using Radzen.Blazor

EgwCoreLib.BlazorTest/compilerconfig.json

@@ -14,5 +14,13 @@
   {
     "outputFile": "Pages/TestGauges.razor.css",
     "inputFile": "Pages/TestGauges.razor.less"
+  },
+  {
+    "outputFile": "Pages/TestBarcodeReader.razor.css",
+    "inputFile": "Pages/TestBarcodeReader.razor.less"
+  },
+  {
+    "outputFile": "Pages/BootstrapModal.razor.css",
+    "inputFile": "Pages/BootstrapModal.razor.less"
   }
 ]

EgwCoreLib.BlazorTest/libman.json

@@ -3,7 +3,7 @@
   "defaultProvider": "cdnjs",
   "libraries": [
     {
-      "library": "bootstrap@5.2.3",
+      "library": "bootstrap@5.3.8",
       "destination": "wwwroot/lib/bootstrap/"
     },
     {
@@ -11,7 +11,6 @@
       "destination": "wwwroot/lib/font-awesome/"
     },
     {
-      "provider": "cdnjs",
       "library": "Chart.js@4.4.1",
       "destination": "wwwroot/lib/Chart.js/"
     }

EgwCoreLib.BlazorTest/wwwroot/css/font.css

@@ -0,0 +1,36 @@
+/* lato-regular - latin */
+@font-face {
+    font-family: 'Lato';
+    font-style: normal;
+    font-weight: 400;
+    src: url('../fonts/lato-v17-latin-regular.eot'); /* IE9 Compat Modes */
+    src: local(''), url('../fonts/lato-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+    url('../fonts/lato-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+    url('../fonts/lato-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
+    url('../fonts/lato-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
+    url('../fonts/lato-v17-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
+}
+/* roboto-regular - latin */
+@font-face {
+    font-family: 'Roboto';
+    font-style: normal;
+    font-weight: 400;
+    src: url('../fonts/roboto-v27-latin-regular.eot'); /* IE9 Compat Modes */
+    src: local(''), url('../fonts/roboto-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+    url('../fonts/roboto-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+    url('../fonts/roboto-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
+    url('../fonts/roboto-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
+    url('../fonts/roboto-v27-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
+}
+/* roboto-condensed-regular - latin */
+@font-face {
+    font-family: 'Roboto Condensed';
+    font-style: normal;
+    font-weight: 400;
+    src: url('../fonts/roboto-condensed-v19-latin-regular.eot'); /* IE9 Compat Modes */
+    src: local(''), url('../fonts/roboto-condensed-v19-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+    url('../fonts/roboto-condensed-v19-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+    url('../fonts/roboto-condensed-v19-latin-regular.woff') format('woff'), /* Modern Browsers */
+    url('../fonts/roboto-condensed-v19-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
+    url('../fonts/roboto-condensed-v19-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */
+}

EgwCoreLib.BlazorTest/wwwroot/css/site.css

@@ -1,7 +1,12 @@
 @import url('open-iconic/font/css/open-iconic-bootstrap.min.css');
+@import url('font.css');
 
 html, body {
-    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+    font-family: Roboto,sans-serif;
+}
+
+.condensed {
+    font-family: 'Roboto Condensed', sans-serif;
 }
 
 h1:focus {

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/css/bootstrap-grid.css

@@ -1,78 +1,8 @@
 /*!
- * Bootstrap Grid v5.2.3 (https://getbootstrap.com/)
- * Copyright 2011-2022 The Bootstrap Authors
- * Copyright 2011-2022 Twitter, Inc.
+ * Bootstrap Grid v5.3.8 (https://getbootstrap.com/)
+ * Copyright 2011-2025 The Bootstrap Authors
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
-:root {
-  --bs-blue: #0d6efd;
-  --bs-indigo: #6610f2;
-  --bs-purple: #6f42c1;
-  --bs-pink: #d63384;
-  --bs-red: #dc3545;
-  --bs-orange: #fd7e14;
-  --bs-yellow: #ffc107;
-  --bs-green: #198754;
-  --bs-teal: #20c997;
-  --bs-cyan: #0dcaf0;
-  --bs-black: #000;
-  --bs-white: #fff;
-  --bs-gray: #6c757d;
-  --bs-gray-dark: #343a40;
-  --bs-gray-100: #f8f9fa;
-  --bs-gray-200: #e9ecef;
-  --bs-gray-300: #dee2e6;
-  --bs-gray-400: #ced4da;
-  --bs-gray-500: #adb5bd;
-  --bs-gray-600: #6c757d;
-  --bs-gray-700: #495057;
-  --bs-gray-800: #343a40;
-  --bs-gray-900: #212529;
-  --bs-primary: #0d6efd;
-  --bs-secondary: #6c757d;
-  --bs-success: #198754;
-  --bs-info: #0dcaf0;
-  --bs-warning: #ffc107;
-  --bs-danger: #dc3545;
-  --bs-light: #f8f9fa;
-  --bs-dark: #212529;
-  --bs-primary-rgb: 13, 110, 253;
-  --bs-secondary-rgb: 108, 117, 125;
-  --bs-success-rgb: 25, 135, 84;
-  --bs-info-rgb: 13, 202, 240;
-  --bs-warning-rgb: 255, 193, 7;
-  --bs-danger-rgb: 220, 53, 69;
-  --bs-light-rgb: 248, 249, 250;
-  --bs-dark-rgb: 33, 37, 41;
-  --bs-white-rgb: 255, 255, 255;
-  --bs-black-rgb: 0, 0, 0;
-  --bs-body-color-rgb: 33, 37, 41;
-  --bs-body-bg-rgb: 255, 255, 255;
-  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
-  --bs-body-font-family: var(--bs-font-sans-serif);
-  --bs-body-font-size: 1rem;
-  --bs-body-font-weight: 400;
-  --bs-body-line-height: 1.5;
-  --bs-body-color: #212529;
-  --bs-body-bg: #fff;
-  --bs-border-width: 1px;
-  --bs-border-style: solid;
-  --bs-border-color: #dee2e6;
-  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
-  --bs-border-radius: 0.375rem;
-  --bs-border-radius-sm: 0.25rem;
-  --bs-border-radius-lg: 0.5rem;
-  --bs-border-radius-xl: 1rem;
-  --bs-border-radius-2xl: 2rem;
-  --bs-border-radius-pill: 50rem;
-  --bs-link-color: #0d6efd;
-  --bs-link-hover-color: #0a58ca;
-  --bs-code-color: #d63384;
-  --bs-highlight-bg: #fff3cd;
-}
-
 .container,
 .container-fluid,
 .container-xxl,
@@ -114,6 +44,15 @@
     max-width: 1320px;
   }
 }
+:root {
+  --bs-breakpoint-xs: 0;
+  --bs-breakpoint-sm: 576px;
+  --bs-breakpoint-md: 768px;
+  --bs-breakpoint-lg: 992px;
+  --bs-breakpoint-xl: 1200px;
+  --bs-breakpoint-xxl: 1400px;
+}
+
 .row {
   --bs-gutter-x: 1.5rem;
   --bs-gutter-y: 0;
@@ -134,7 +73,7 @@
 }
 
 .col {
-  flex: 1 0 0%;
+  flex: 1 0 0;
 }
 
 .row-cols-auto > * {
@@ -154,7 +93,7 @@
 
 .row-cols-3 > * {
   flex: 0 0 auto;
-  width: 33.3333333333%;
+  width: 33.33333333%;
 }
 
 .row-cols-4 > * {
@@ -169,7 +108,7 @@
 
 .row-cols-6 > * {
   flex: 0 0 auto;
-  width: 16.6666666667%;
+  width: 16.66666667%;
 }
 
 .col-auto {
@@ -343,7 +282,7 @@
 
 @media (min-width: 576px) {
   .col-sm {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-sm-auto > * {
     flex: 0 0 auto;
@@ -359,7 +298,7 @@
   }
   .row-cols-sm-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-sm-4 > * {
     flex: 0 0 auto;
@@ -371,7 +310,7 @@
   }
   .row-cols-sm-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-sm-auto {
     flex: 0 0 auto;
@@ -462,57 +401,57 @@
     margin-left: 91.66666667%;
   }
   .g-sm-0,
-.gx-sm-0 {
+  .gx-sm-0 {
     --bs-gutter-x: 0;
   }
   .g-sm-0,
-.gy-sm-0 {
+  .gy-sm-0 {
     --bs-gutter-y: 0;
   }
   .g-sm-1,
-.gx-sm-1 {
+  .gx-sm-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-sm-1,
-.gy-sm-1 {
+  .gy-sm-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-sm-2,
-.gx-sm-2 {
+  .gx-sm-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-sm-2,
-.gy-sm-2 {
+  .gy-sm-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-sm-3,
-.gx-sm-3 {
+  .gx-sm-3 {
     --bs-gutter-x: 1rem;
   }
   .g-sm-3,
-.gy-sm-3 {
+  .gy-sm-3 {
     --bs-gutter-y: 1rem;
   }
   .g-sm-4,
-.gx-sm-4 {
+  .gx-sm-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-sm-4,
-.gy-sm-4 {
+  .gy-sm-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-sm-5,
-.gx-sm-5 {
+  .gx-sm-5 {
     --bs-gutter-x: 3rem;
   }
   .g-sm-5,
-.gy-sm-5 {
+  .gy-sm-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 768px) {
   .col-md {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-md-auto > * {
     flex: 0 0 auto;
@@ -528,7 +467,7 @@
   }
   .row-cols-md-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-md-4 > * {
     flex: 0 0 auto;
@@ -540,7 +479,7 @@
   }
   .row-cols-md-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-md-auto {
     flex: 0 0 auto;
@@ -631,57 +570,57 @@
     margin-left: 91.66666667%;
   }
   .g-md-0,
-.gx-md-0 {
+  .gx-md-0 {
     --bs-gutter-x: 0;
   }
   .g-md-0,
-.gy-md-0 {
+  .gy-md-0 {
     --bs-gutter-y: 0;
   }
   .g-md-1,
-.gx-md-1 {
+  .gx-md-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-md-1,
-.gy-md-1 {
+  .gy-md-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-md-2,
-.gx-md-2 {
+  .gx-md-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-md-2,
-.gy-md-2 {
+  .gy-md-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-md-3,
-.gx-md-3 {
+  .gx-md-3 {
     --bs-gutter-x: 1rem;
   }
   .g-md-3,
-.gy-md-3 {
+  .gy-md-3 {
     --bs-gutter-y: 1rem;
   }
   .g-md-4,
-.gx-md-4 {
+  .gx-md-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-md-4,
-.gy-md-4 {
+  .gy-md-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-md-5,
-.gx-md-5 {
+  .gx-md-5 {
     --bs-gutter-x: 3rem;
   }
   .g-md-5,
-.gy-md-5 {
+  .gy-md-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 992px) {
   .col-lg {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-lg-auto > * {
     flex: 0 0 auto;
@@ -697,7 +636,7 @@
   }
   .row-cols-lg-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-lg-4 > * {
     flex: 0 0 auto;
@@ -709,7 +648,7 @@
   }
   .row-cols-lg-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-lg-auto {
     flex: 0 0 auto;
@@ -800,57 +739,57 @@
     margin-left: 91.66666667%;
   }
   .g-lg-0,
-.gx-lg-0 {
+  .gx-lg-0 {
     --bs-gutter-x: 0;
   }
   .g-lg-0,
-.gy-lg-0 {
+  .gy-lg-0 {
     --bs-gutter-y: 0;
   }
   .g-lg-1,
-.gx-lg-1 {
+  .gx-lg-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-lg-1,
-.gy-lg-1 {
+  .gy-lg-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-lg-2,
-.gx-lg-2 {
+  .gx-lg-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-lg-2,
-.gy-lg-2 {
+  .gy-lg-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-lg-3,
-.gx-lg-3 {
+  .gx-lg-3 {
     --bs-gutter-x: 1rem;
   }
   .g-lg-3,
-.gy-lg-3 {
+  .gy-lg-3 {
     --bs-gutter-y: 1rem;
   }
   .g-lg-4,
-.gx-lg-4 {
+  .gx-lg-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-lg-4,
-.gy-lg-4 {
+  .gy-lg-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-lg-5,
-.gx-lg-5 {
+  .gx-lg-5 {
     --bs-gutter-x: 3rem;
   }
   .g-lg-5,
-.gy-lg-5 {
+  .gy-lg-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 1200px) {
   .col-xl {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-xl-auto > * {
     flex: 0 0 auto;
@@ -866,7 +805,7 @@
   }
   .row-cols-xl-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-xl-4 > * {
     flex: 0 0 auto;
@@ -878,7 +817,7 @@
   }
   .row-cols-xl-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-xl-auto {
     flex: 0 0 auto;
@@ -969,57 +908,57 @@
     margin-left: 91.66666667%;
   }
   .g-xl-0,
-.gx-xl-0 {
+  .gx-xl-0 {
     --bs-gutter-x: 0;
   }
   .g-xl-0,
-.gy-xl-0 {
+  .gy-xl-0 {
     --bs-gutter-y: 0;
   }
   .g-xl-1,
-.gx-xl-1 {
+  .gx-xl-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-xl-1,
-.gy-xl-1 {
+  .gy-xl-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-xl-2,
-.gx-xl-2 {
+  .gx-xl-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-xl-2,
-.gy-xl-2 {
+  .gy-xl-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-xl-3,
-.gx-xl-3 {
+  .gx-xl-3 {
     --bs-gutter-x: 1rem;
   }
   .g-xl-3,
-.gy-xl-3 {
+  .gy-xl-3 {
     --bs-gutter-y: 1rem;
   }
   .g-xl-4,
-.gx-xl-4 {
+  .gx-xl-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-xl-4,
-.gy-xl-4 {
+  .gy-xl-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-xl-5,
-.gx-xl-5 {
+  .gx-xl-5 {
     --bs-gutter-x: 3rem;
   }
   .g-xl-5,
-.gy-xl-5 {
+  .gy-xl-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 1400px) {
   .col-xxl {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-xxl-auto > * {
     flex: 0 0 auto;
@@ -1035,7 +974,7 @@
   }
   .row-cols-xxl-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-xxl-4 > * {
     flex: 0 0 auto;
@@ -1047,7 +986,7 @@
   }
   .row-cols-xxl-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-xxl-auto {
     flex: 0 0 auto;
@@ -1138,51 +1077,51 @@
     margin-left: 91.66666667%;
   }
   .g-xxl-0,
-.gx-xxl-0 {
+  .gx-xxl-0 {
     --bs-gutter-x: 0;
   }
   .g-xxl-0,
-.gy-xxl-0 {
+  .gy-xxl-0 {
     --bs-gutter-y: 0;
   }
   .g-xxl-1,
-.gx-xxl-1 {
+  .gx-xxl-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-xxl-1,
-.gy-xxl-1 {
+  .gy-xxl-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-xxl-2,
-.gx-xxl-2 {
+  .gx-xxl-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-xxl-2,
-.gy-xxl-2 {
+  .gy-xxl-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-xxl-3,
-.gx-xxl-3 {
+  .gx-xxl-3 {
     --bs-gutter-x: 1rem;
   }
   .g-xxl-3,
-.gy-xxl-3 {
+  .gy-xxl-3 {
     --bs-gutter-y: 1rem;
   }
   .g-xxl-4,
-.gx-xxl-4 {
+  .gx-xxl-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-xxl-4,
-.gy-xxl-4 {
+  .gy-xxl-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-xxl-5,
-.gx-xxl-5 {
+  .gx-xxl-5 {
     --bs-gutter-x: 3rem;
   }
   .g-xxl-5,
-.gy-xxl-5 {
+  .gy-xxl-5 {
     --bs-gutter-y: 3rem;
   }
 }
@@ -1202,6 +1141,10 @@
   display: grid !important;
 }
 
+.d-inline-grid {
+  display: inline-grid !important;
+}
+
 .d-table {
   display: table !important;
 }
@@ -1801,6 +1744,9 @@
   .d-sm-grid {
     display: grid !important;
   }
+  .d-sm-inline-grid {
+    display: inline-grid !important;
+  }
   .d-sm-table {
     display: table !important;
   }
@@ -2261,6 +2207,9 @@
   .d-md-grid {
     display: grid !important;
   }
+  .d-md-inline-grid {
+    display: inline-grid !important;
+  }
   .d-md-table {
     display: table !important;
   }
@@ -2721,6 +2670,9 @@
   .d-lg-grid {
     display: grid !important;
   }
+  .d-lg-inline-grid {
+    display: inline-grid !important;
+  }
   .d-lg-table {
     display: table !important;
   }
@@ -3181,6 +3133,9 @@
   .d-xl-grid {
     display: grid !important;
   }
+  .d-xl-inline-grid {
+    display: inline-grid !important;
+  }
   .d-xl-table {
     display: table !important;
   }
@@ -3641,6 +3596,9 @@
   .d-xxl-grid {
     display: grid !important;
   }
+  .d-xxl-inline-grid {
+    display: inline-grid !important;
+  }
   .d-xxl-table {
     display: table !important;
   }
@@ -4101,6 +4059,9 @@
   .d-print-grid {
     display: grid !important;
   }
+  .d-print-inline-grid {
+    display: inline-grid !important;
+  }
   .d-print-table {
     display: table !important;
   }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/css/bootstrap-grid.rtl.css

@@ -1,78 +1,8 @@
 /*!
- * Bootstrap Grid v5.2.3 (https://getbootstrap.com/)
- * Copyright 2011-2022 The Bootstrap Authors
- * Copyright 2011-2022 Twitter, Inc.
+ * Bootstrap Grid v5.3.8 (https://getbootstrap.com/)
+ * Copyright 2011-2025 The Bootstrap Authors
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
-:root {
-  --bs-blue: #0d6efd;
-  --bs-indigo: #6610f2;
-  --bs-purple: #6f42c1;
-  --bs-pink: #d63384;
-  --bs-red: #dc3545;
-  --bs-orange: #fd7e14;
-  --bs-yellow: #ffc107;
-  --bs-green: #198754;
-  --bs-teal: #20c997;
-  --bs-cyan: #0dcaf0;
-  --bs-black: #000;
-  --bs-white: #fff;
-  --bs-gray: #6c757d;
-  --bs-gray-dark: #343a40;
-  --bs-gray-100: #f8f9fa;
-  --bs-gray-200: #e9ecef;
-  --bs-gray-300: #dee2e6;
-  --bs-gray-400: #ced4da;
-  --bs-gray-500: #adb5bd;
-  --bs-gray-600: #6c757d;
-  --bs-gray-700: #495057;
-  --bs-gray-800: #343a40;
-  --bs-gray-900: #212529;
-  --bs-primary: #0d6efd;
-  --bs-secondary: #6c757d;
-  --bs-success: #198754;
-  --bs-info: #0dcaf0;
-  --bs-warning: #ffc107;
-  --bs-danger: #dc3545;
-  --bs-light: #f8f9fa;
-  --bs-dark: #212529;
-  --bs-primary-rgb: 13, 110, 253;
-  --bs-secondary-rgb: 108, 117, 125;
-  --bs-success-rgb: 25, 135, 84;
-  --bs-info-rgb: 13, 202, 240;
-  --bs-warning-rgb: 255, 193, 7;
-  --bs-danger-rgb: 220, 53, 69;
-  --bs-light-rgb: 248, 249, 250;
-  --bs-dark-rgb: 33, 37, 41;
-  --bs-white-rgb: 255, 255, 255;
-  --bs-black-rgb: 0, 0, 0;
-  --bs-body-color-rgb: 33, 37, 41;
-  --bs-body-bg-rgb: 255, 255, 255;
-  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
-  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
-  --bs-body-font-family: var(--bs-font-sans-serif);
-  --bs-body-font-size: 1rem;
-  --bs-body-font-weight: 400;
-  --bs-body-line-height: 1.5;
-  --bs-body-color: #212529;
-  --bs-body-bg: #fff;
-  --bs-border-width: 1px;
-  --bs-border-style: solid;
-  --bs-border-color: #dee2e6;
-  --bs-border-color-translucent: rgba(0, 0, 0, 0.175);
-  --bs-border-radius: 0.375rem;
-  --bs-border-radius-sm: 0.25rem;
-  --bs-border-radius-lg: 0.5rem;
-  --bs-border-radius-xl: 1rem;
-  --bs-border-radius-2xl: 2rem;
-  --bs-border-radius-pill: 50rem;
-  --bs-link-color: #0d6efd;
-  --bs-link-hover-color: #0a58ca;
-  --bs-code-color: #d63384;
-  --bs-highlight-bg: #fff3cd;
-}
-
 .container,
 .container-fluid,
 .container-xxl,
@@ -114,6 +44,15 @@
     max-width: 1320px;
   }
 }
+:root {
+  --bs-breakpoint-xs: 0;
+  --bs-breakpoint-sm: 576px;
+  --bs-breakpoint-md: 768px;
+  --bs-breakpoint-lg: 992px;
+  --bs-breakpoint-xl: 1200px;
+  --bs-breakpoint-xxl: 1400px;
+}
+
 .row {
   --bs-gutter-x: 1.5rem;
   --bs-gutter-y: 0;
@@ -134,7 +73,7 @@
 }
 
 .col {
-  flex: 1 0 0%;
+  flex: 1 0 0;
 }
 
 .row-cols-auto > * {
@@ -154,7 +93,7 @@
 
 .row-cols-3 > * {
   flex: 0 0 auto;
-  width: 33.3333333333%;
+  width: 33.33333333%;
 }
 
 .row-cols-4 > * {
@@ -169,7 +108,7 @@
 
 .row-cols-6 > * {
   flex: 0 0 auto;
-  width: 16.6666666667%;
+  width: 16.66666667%;
 }
 
 .col-auto {
@@ -343,7 +282,7 @@
 
 @media (min-width: 576px) {
   .col-sm {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-sm-auto > * {
     flex: 0 0 auto;
@@ -359,7 +298,7 @@
   }
   .row-cols-sm-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-sm-4 > * {
     flex: 0 0 auto;
@@ -371,7 +310,7 @@
   }
   .row-cols-sm-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-sm-auto {
     flex: 0 0 auto;
@@ -462,57 +401,57 @@
     margin-right: 91.66666667%;
   }
   .g-sm-0,
-.gx-sm-0 {
+  .gx-sm-0 {
     --bs-gutter-x: 0;
   }
   .g-sm-0,
-.gy-sm-0 {
+  .gy-sm-0 {
     --bs-gutter-y: 0;
   }
   .g-sm-1,
-.gx-sm-1 {
+  .gx-sm-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-sm-1,
-.gy-sm-1 {
+  .gy-sm-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-sm-2,
-.gx-sm-2 {
+  .gx-sm-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-sm-2,
-.gy-sm-2 {
+  .gy-sm-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-sm-3,
-.gx-sm-3 {
+  .gx-sm-3 {
     --bs-gutter-x: 1rem;
   }
   .g-sm-3,
-.gy-sm-3 {
+  .gy-sm-3 {
     --bs-gutter-y: 1rem;
   }
   .g-sm-4,
-.gx-sm-4 {
+  .gx-sm-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-sm-4,
-.gy-sm-4 {
+  .gy-sm-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-sm-5,
-.gx-sm-5 {
+  .gx-sm-5 {
     --bs-gutter-x: 3rem;
   }
   .g-sm-5,
-.gy-sm-5 {
+  .gy-sm-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 768px) {
   .col-md {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-md-auto > * {
     flex: 0 0 auto;
@@ -528,7 +467,7 @@
   }
   .row-cols-md-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-md-4 > * {
     flex: 0 0 auto;
@@ -540,7 +479,7 @@
   }
   .row-cols-md-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-md-auto {
     flex: 0 0 auto;
@@ -631,57 +570,57 @@
     margin-right: 91.66666667%;
   }
   .g-md-0,
-.gx-md-0 {
+  .gx-md-0 {
     --bs-gutter-x: 0;
   }
   .g-md-0,
-.gy-md-0 {
+  .gy-md-0 {
     --bs-gutter-y: 0;
   }
   .g-md-1,
-.gx-md-1 {
+  .gx-md-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-md-1,
-.gy-md-1 {
+  .gy-md-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-md-2,
-.gx-md-2 {
+  .gx-md-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-md-2,
-.gy-md-2 {
+  .gy-md-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-md-3,
-.gx-md-3 {
+  .gx-md-3 {
     --bs-gutter-x: 1rem;
   }
   .g-md-3,
-.gy-md-3 {
+  .gy-md-3 {
     --bs-gutter-y: 1rem;
   }
   .g-md-4,
-.gx-md-4 {
+  .gx-md-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-md-4,
-.gy-md-4 {
+  .gy-md-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-md-5,
-.gx-md-5 {
+  .gx-md-5 {
     --bs-gutter-x: 3rem;
   }
   .g-md-5,
-.gy-md-5 {
+  .gy-md-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 992px) {
   .col-lg {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-lg-auto > * {
     flex: 0 0 auto;
@@ -697,7 +636,7 @@
   }
   .row-cols-lg-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-lg-4 > * {
     flex: 0 0 auto;
@@ -709,7 +648,7 @@
   }
   .row-cols-lg-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-lg-auto {
     flex: 0 0 auto;
@@ -800,57 +739,57 @@
     margin-right: 91.66666667%;
   }
   .g-lg-0,
-.gx-lg-0 {
+  .gx-lg-0 {
     --bs-gutter-x: 0;
   }
   .g-lg-0,
-.gy-lg-0 {
+  .gy-lg-0 {
     --bs-gutter-y: 0;
   }
   .g-lg-1,
-.gx-lg-1 {
+  .gx-lg-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-lg-1,
-.gy-lg-1 {
+  .gy-lg-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-lg-2,
-.gx-lg-2 {
+  .gx-lg-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-lg-2,
-.gy-lg-2 {
+  .gy-lg-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-lg-3,
-.gx-lg-3 {
+  .gx-lg-3 {
     --bs-gutter-x: 1rem;
   }
   .g-lg-3,
-.gy-lg-3 {
+  .gy-lg-3 {
     --bs-gutter-y: 1rem;
   }
   .g-lg-4,
-.gx-lg-4 {
+  .gx-lg-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-lg-4,
-.gy-lg-4 {
+  .gy-lg-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-lg-5,
-.gx-lg-5 {
+  .gx-lg-5 {
     --bs-gutter-x: 3rem;
   }
   .g-lg-5,
-.gy-lg-5 {
+  .gy-lg-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 1200px) {
   .col-xl {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-xl-auto > * {
     flex: 0 0 auto;
@@ -866,7 +805,7 @@
   }
   .row-cols-xl-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-xl-4 > * {
     flex: 0 0 auto;
@@ -878,7 +817,7 @@
   }
   .row-cols-xl-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-xl-auto {
     flex: 0 0 auto;
@@ -969,57 +908,57 @@
     margin-right: 91.66666667%;
   }
   .g-xl-0,
-.gx-xl-0 {
+  .gx-xl-0 {
     --bs-gutter-x: 0;
   }
   .g-xl-0,
-.gy-xl-0 {
+  .gy-xl-0 {
     --bs-gutter-y: 0;
   }
   .g-xl-1,
-.gx-xl-1 {
+  .gx-xl-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-xl-1,
-.gy-xl-1 {
+  .gy-xl-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-xl-2,
-.gx-xl-2 {
+  .gx-xl-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-xl-2,
-.gy-xl-2 {
+  .gy-xl-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-xl-3,
-.gx-xl-3 {
+  .gx-xl-3 {
     --bs-gutter-x: 1rem;
   }
   .g-xl-3,
-.gy-xl-3 {
+  .gy-xl-3 {
     --bs-gutter-y: 1rem;
   }
   .g-xl-4,
-.gx-xl-4 {
+  .gx-xl-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-xl-4,
-.gy-xl-4 {
+  .gy-xl-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-xl-5,
-.gx-xl-5 {
+  .gx-xl-5 {
     --bs-gutter-x: 3rem;
   }
   .g-xl-5,
-.gy-xl-5 {
+  .gy-xl-5 {
     --bs-gutter-y: 3rem;
   }
 }
 @media (min-width: 1400px) {
   .col-xxl {
-    flex: 1 0 0%;
+    flex: 1 0 0;
   }
   .row-cols-xxl-auto > * {
     flex: 0 0 auto;
@@ -1035,7 +974,7 @@
   }
   .row-cols-xxl-3 > * {
     flex: 0 0 auto;
-    width: 33.3333333333%;
+    width: 33.33333333%;
   }
   .row-cols-xxl-4 > * {
     flex: 0 0 auto;
@@ -1047,7 +986,7 @@
   }
   .row-cols-xxl-6 > * {
     flex: 0 0 auto;
-    width: 16.6666666667%;
+    width: 16.66666667%;
   }
   .col-xxl-auto {
     flex: 0 0 auto;
@@ -1138,51 +1077,51 @@
     margin-right: 91.66666667%;
   }
   .g-xxl-0,
-.gx-xxl-0 {
+  .gx-xxl-0 {
     --bs-gutter-x: 0;
   }
   .g-xxl-0,
-.gy-xxl-0 {
+  .gy-xxl-0 {
     --bs-gutter-y: 0;
   }
   .g-xxl-1,
-.gx-xxl-1 {
+  .gx-xxl-1 {
     --bs-gutter-x: 0.25rem;
   }
   .g-xxl-1,
-.gy-xxl-1 {
+  .gy-xxl-1 {
     --bs-gutter-y: 0.25rem;
   }
   .g-xxl-2,
-.gx-xxl-2 {
+  .gx-xxl-2 {
     --bs-gutter-x: 0.5rem;
   }
   .g-xxl-2,
-.gy-xxl-2 {
+  .gy-xxl-2 {
     --bs-gutter-y: 0.5rem;
   }
   .g-xxl-3,
-.gx-xxl-3 {
+  .gx-xxl-3 {
     --bs-gutter-x: 1rem;
   }
   .g-xxl-3,
-.gy-xxl-3 {
+  .gy-xxl-3 {
     --bs-gutter-y: 1rem;
   }
   .g-xxl-4,
-.gx-xxl-4 {
+  .gx-xxl-4 {
     --bs-gutter-x: 1.5rem;
   }
   .g-xxl-4,
-.gy-xxl-4 {
+  .gy-xxl-4 {
     --bs-gutter-y: 1.5rem;
   }
   .g-xxl-5,
-.gx-xxl-5 {
+  .gx-xxl-5 {
     --bs-gutter-x: 3rem;
   }
   .g-xxl-5,
-.gy-xxl-5 {
+  .gy-xxl-5 {
     --bs-gutter-y: 3rem;
   }
 }
@@ -1202,6 +1141,10 @@
   display: grid !important;
 }
 
+.d-inline-grid {
+  display: inline-grid !important;
+}
+
 .d-table {
   display: table !important;
 }
@@ -1801,6 +1744,9 @@
   .d-sm-grid {
     display: grid !important;
   }
+  .d-sm-inline-grid {
+    display: inline-grid !important;
+  }
   .d-sm-table {
     display: table !important;
   }
@@ -2261,6 +2207,9 @@
   .d-md-grid {
     display: grid !important;
   }
+  .d-md-inline-grid {
+    display: inline-grid !important;
+  }
   .d-md-table {
     display: table !important;
   }
@@ -2721,6 +2670,9 @@
   .d-lg-grid {
     display: grid !important;
   }
+  .d-lg-inline-grid {
+    display: inline-grid !important;
+  }
   .d-lg-table {
     display: table !important;
   }
@@ -3181,6 +3133,9 @@
   .d-xl-grid {
     display: grid !important;
   }
+  .d-xl-inline-grid {
+    display: inline-grid !important;
+  }
   .d-xl-table {
     display: table !important;
   }
@@ -3641,6 +3596,9 @@
   .d-xxl-grid {
     display: grid !important;
   }
+  .d-xxl-inline-grid {
+    display: inline-grid !important;
+  }
   .d-xxl-table {
     display: table !important;
   }
@@ -4101,6 +4059,9 @@
   .d-print-grid {
     display: grid !important;
   }
+  .d-print-inline-grid {
+    display: inline-grid !important;
+  }
   .d-print-table {
     display: table !important;
   }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/css/bootstrap-reboot.css

@@ -1,10 +1,10 @@
 /*!
- * Bootstrap Reboot v5.2.3 (https://getbootstrap.com/)
- * Copyright 2011-2022 The Bootstrap Authors
- * Copyright 2011-2022 Twitter, Inc.
+ * Bootstrap Reboot v5.3.8 (https://getbootstrap.com/)
+ * Copyright 2011-2025 The Bootstrap Authors
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
-:root {
+:root,
+[data-bs-theme=light] {
   --bs-blue: #0d6efd;
   --bs-indigo: #6610f2;
   --bs-purple: #6f42c1;
@@ -44,10 +44,32 @@
   --bs-danger-rgb: 220, 53, 69;
   --bs-light-rgb: 248, 249, 250;
   --bs-dark-rgb: 33, 37, 41;
+  --bs-primary-text-emphasis: #052c65;
+  --bs-secondary-text-emphasis: #2b2f32;
+  --bs-success-text-emphasis: #0a3622;
+  --bs-info-text-emphasis: #055160;
+  --bs-warning-text-emphasis: #664d03;
+  --bs-danger-text-emphasis: #58151c;
+  --bs-light-text-emphasis: #495057;
+  --bs-dark-text-emphasis: #495057;
+  --bs-primary-bg-subtle: #cfe2ff;
+  --bs-secondary-bg-subtle: #e2e3e5;
+  --bs-success-bg-subtle: #d1e7dd;
+  --bs-info-bg-subtle: #cff4fc;
+  --bs-warning-bg-subtle: #fff3cd;
+  --bs-danger-bg-subtle: #f8d7da;
+  --bs-light-bg-subtle: #fcfcfd;
+  --bs-dark-bg-subtle: #ced4da;
+  --bs-primary-border-subtle: #9ec5fe;
+  --bs-secondary-border-subtle: #c4c8cb;
+  --bs-success-border-subtle: #a3cfbb;
+  --bs-info-border-subtle: #9eeaf9;
+  --bs-warning-border-subtle: #ffe69c;
+  --bs-danger-border-subtle: #f1aeb5;
+  --bs-light-border-subtle: #e9ecef;
+  --bs-dark-border-subtle: #adb5bd;
   --bs-white-rgb: 255, 255, 255;
   --bs-black-rgb: 0, 0, 0;
-  --bs-body-color-rgb: 33, 37, 41;
-  --bs-body-bg-rgb: 255, 255, 255;
   --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
@@ -56,7 +78,28 @@
   --bs-body-font-weight: 400;
   --bs-body-line-height: 1.5;
   --bs-body-color: #212529;
+  --bs-body-color-rgb: 33, 37, 41;
   --bs-body-bg: #fff;
+  --bs-body-bg-rgb: 255, 255, 255;
+  --bs-emphasis-color: #000;
+  --bs-emphasis-color-rgb: 0, 0, 0;
+  --bs-secondary-color: rgba(33, 37, 41, 0.75);
+  --bs-secondary-color-rgb: 33, 37, 41;
+  --bs-secondary-bg: #e9ecef;
+  --bs-secondary-bg-rgb: 233, 236, 239;
+  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
+  --bs-tertiary-color-rgb: 33, 37, 41;
+  --bs-tertiary-bg: #f8f9fa;
+  --bs-tertiary-bg-rgb: 248, 249, 250;
+  --bs-heading-color: inherit;
+  --bs-link-color: #0d6efd;
+  --bs-link-color-rgb: 13, 110, 253;
+  --bs-link-decoration: underline;
+  --bs-link-hover-color: #0a58ca;
+  --bs-link-hover-color-rgb: 10, 88, 202;
+  --bs-code-color: #d63384;
+  --bs-highlight-color: #212529;
+  --bs-highlight-bg: #fff3cd;
   --bs-border-width: 1px;
   --bs-border-style: solid;
   --bs-border-color: #dee2e6;
@@ -65,12 +108,76 @@
   --bs-border-radius-sm: 0.25rem;
   --bs-border-radius-lg: 0.5rem;
   --bs-border-radius-xl: 1rem;
-  --bs-border-radius-2xl: 2rem;
+  --bs-border-radius-xxl: 2rem;
+  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
   --bs-border-radius-pill: 50rem;
-  --bs-link-color: #0d6efd;
-  --bs-link-hover-color: #0a58ca;
-  --bs-code-color: #d63384;
-  --bs-highlight-bg: #fff3cd;
+  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
+  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+  --bs-focus-ring-width: 0.25rem;
+  --bs-focus-ring-opacity: 0.25;
+  --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
+  --bs-form-valid-color: #198754;
+  --bs-form-valid-border-color: #198754;
+  --bs-form-invalid-color: #dc3545;
+  --bs-form-invalid-border-color: #dc3545;
+}
+
+[data-bs-theme=dark] {
+  color-scheme: dark;
+  --bs-body-color: #dee2e6;
+  --bs-body-color-rgb: 222, 226, 230;
+  --bs-body-bg: #212529;
+  --bs-body-bg-rgb: 33, 37, 41;
+  --bs-emphasis-color: #fff;
+  --bs-emphasis-color-rgb: 255, 255, 255;
+  --bs-secondary-color: rgba(222, 226, 230, 0.75);
+  --bs-secondary-color-rgb: 222, 226, 230;
+  --bs-secondary-bg: #343a40;
+  --bs-secondary-bg-rgb: 52, 58, 64;
+  --bs-tertiary-color: rgba(222, 226, 230, 0.5);
+  --bs-tertiary-color-rgb: 222, 226, 230;
+  --bs-tertiary-bg: #2b3035;
+  --bs-tertiary-bg-rgb: 43, 48, 53;
+  --bs-primary-text-emphasis: #6ea8fe;
+  --bs-secondary-text-emphasis: #a7acb1;
+  --bs-success-text-emphasis: #75b798;
+  --bs-info-text-emphasis: #6edff6;
+  --bs-warning-text-emphasis: #ffda6a;
+  --bs-danger-text-emphasis: #ea868f;
+  --bs-light-text-emphasis: #f8f9fa;
+  --bs-dark-text-emphasis: #dee2e6;
+  --bs-primary-bg-subtle: #031633;
+  --bs-secondary-bg-subtle: #161719;
+  --bs-success-bg-subtle: #051b11;
+  --bs-info-bg-subtle: #032830;
+  --bs-warning-bg-subtle: #332701;
+  --bs-danger-bg-subtle: #2c0b0e;
+  --bs-light-bg-subtle: #343a40;
+  --bs-dark-bg-subtle: #1a1d20;
+  --bs-primary-border-subtle: #084298;
+  --bs-secondary-border-subtle: #41464b;
+  --bs-success-border-subtle: #0f5132;
+  --bs-info-border-subtle: #087990;
+  --bs-warning-border-subtle: #997404;
+  --bs-danger-border-subtle: #842029;
+  --bs-light-border-subtle: #495057;
+  --bs-dark-border-subtle: #343a40;
+  --bs-heading-color: inherit;
+  --bs-link-color: #6ea8fe;
+  --bs-link-hover-color: #8bb9fe;
+  --bs-link-color-rgb: 110, 168, 254;
+  --bs-link-hover-color-rgb: 139, 185, 254;
+  --bs-code-color: #e685b5;
+  --bs-highlight-color: #dee2e6;
+  --bs-highlight-bg: #664d03;
+  --bs-border-color: #495057;
+  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
+  --bs-form-valid-color: #75b798;
+  --bs-form-valid-border-color: #75b798;
+  --bs-form-invalid-color: #ea868f;
+  --bs-form-invalid-border-color: #ea868f;
 }
 
 *,
@@ -102,7 +209,7 @@ hr {
   margin: 1rem 0;
   color: inherit;
   border: 0;
-  border-top: 1px solid;
+  border-top: var(--bs-border-width) solid;
   opacity: 0.25;
 }
 
@@ -111,6 +218,7 @@ h6, h5, h4, h3, h2, h1 {
   margin-bottom: 0.5rem;
   font-weight: 500;
   line-height: 1.2;
+  color: var(--bs-heading-color);
 }
 
 h1 {
@@ -219,6 +327,7 @@ small {
 
 mark {
   padding: 0.1875em;
+  color: var(--bs-highlight-color);
   background-color: var(--bs-highlight-bg);
 }
 
@@ -239,11 +348,11 @@ sup {
 }
 
 a {
-  color: var(--bs-link-color);
+  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
   text-decoration: underline;
 }
 a:hover {
-  color: var(--bs-link-hover-color);
+  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
 }
 
 a:not([href]):not([class]), a:not([href]):not([class]):hover {
@@ -310,7 +419,7 @@ table {
 caption {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
-  color: #6c757d;
+  color: var(--bs-secondary-color);
   text-align: left;
 }
 
@@ -407,8 +516,8 @@ legend {
   width: 100%;
   padding: 0;
   margin-bottom: 0.5rem;
-  font-size: calc(1.275rem + 0.3vw);
   line-height: inherit;
+  font-size: calc(1.275rem + 0.3vw);
 }
 @media (min-width: 1200px) {
   legend {
@@ -434,8 +543,12 @@ legend + * {
 }
 
 [type=search] {
-  outline-offset: -2px;
   -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+[type=search]::-webkit-search-cancel-button {
+  cursor: pointer;
+  filter: grayscale(1);
 }
 
 /* rtl:raw:

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/css/bootstrap-reboot.rtl.css

@@ -1,10 +1,10 @@
 /*!
- * Bootstrap Reboot v5.2.3 (https://getbootstrap.com/)
- * Copyright 2011-2022 The Bootstrap Authors
- * Copyright 2011-2022 Twitter, Inc.
+ * Bootstrap Reboot v5.3.8 (https://getbootstrap.com/)
+ * Copyright 2011-2025 The Bootstrap Authors
  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
-:root {
+:root,
+[data-bs-theme=light] {
   --bs-blue: #0d6efd;
   --bs-indigo: #6610f2;
   --bs-purple: #6f42c1;
@@ -44,10 +44,32 @@
   --bs-danger-rgb: 220, 53, 69;
   --bs-light-rgb: 248, 249, 250;
   --bs-dark-rgb: 33, 37, 41;
+  --bs-primary-text-emphasis: #052c65;
+  --bs-secondary-text-emphasis: #2b2f32;
+  --bs-success-text-emphasis: #0a3622;
+  --bs-info-text-emphasis: #055160;
+  --bs-warning-text-emphasis: #664d03;
+  --bs-danger-text-emphasis: #58151c;
+  --bs-light-text-emphasis: #495057;
+  --bs-dark-text-emphasis: #495057;
+  --bs-primary-bg-subtle: #cfe2ff;
+  --bs-secondary-bg-subtle: #e2e3e5;
+  --bs-success-bg-subtle: #d1e7dd;
+  --bs-info-bg-subtle: #cff4fc;
+  --bs-warning-bg-subtle: #fff3cd;
+  --bs-danger-bg-subtle: #f8d7da;
+  --bs-light-bg-subtle: #fcfcfd;
+  --bs-dark-bg-subtle: #ced4da;
+  --bs-primary-border-subtle: #9ec5fe;
+  --bs-secondary-border-subtle: #c4c8cb;
+  --bs-success-border-subtle: #a3cfbb;
+  --bs-info-border-subtle: #9eeaf9;
+  --bs-warning-border-subtle: #ffe69c;
+  --bs-danger-border-subtle: #f1aeb5;
+  --bs-light-border-subtle: #e9ecef;
+  --bs-dark-border-subtle: #adb5bd;
   --bs-white-rgb: 255, 255, 255;
   --bs-black-rgb: 0, 0, 0;
-  --bs-body-color-rgb: 33, 37, 41;
-  --bs-body-bg-rgb: 255, 255, 255;
   --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
   --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
@@ -56,7 +78,28 @@
   --bs-body-font-weight: 400;
   --bs-body-line-height: 1.5;
   --bs-body-color: #212529;
+  --bs-body-color-rgb: 33, 37, 41;
   --bs-body-bg: #fff;
+  --bs-body-bg-rgb: 255, 255, 255;
+  --bs-emphasis-color: #000;
+  --bs-emphasis-color-rgb: 0, 0, 0;
+  --bs-secondary-color: rgba(33, 37, 41, 0.75);
+  --bs-secondary-color-rgb: 33, 37, 41;
+  --bs-secondary-bg: #e9ecef;
+  --bs-secondary-bg-rgb: 233, 236, 239;
+  --bs-tertiary-color: rgba(33, 37, 41, 0.5);
+  --bs-tertiary-color-rgb: 33, 37, 41;
+  --bs-tertiary-bg: #f8f9fa;
+  --bs-tertiary-bg-rgb: 248, 249, 250;
+  --bs-heading-color: inherit;
+  --bs-link-color: #0d6efd;
+  --bs-link-color-rgb: 13, 110, 253;
+  --bs-link-decoration: underline;
+  --bs-link-hover-color: #0a58ca;
+  --bs-link-hover-color-rgb: 10, 88, 202;
+  --bs-code-color: #d63384;
+  --bs-highlight-color: #212529;
+  --bs-highlight-bg: #fff3cd;
   --bs-border-width: 1px;
   --bs-border-style: solid;
   --bs-border-color: #dee2e6;
@@ -65,12 +108,76 @@
   --bs-border-radius-sm: 0.25rem;
   --bs-border-radius-lg: 0.5rem;
   --bs-border-radius-xl: 1rem;
-  --bs-border-radius-2xl: 2rem;
+  --bs-border-radius-xxl: 2rem;
+  --bs-border-radius-2xl: var(--bs-border-radius-xxl);
   --bs-border-radius-pill: 50rem;
-  --bs-link-color: #0d6efd;
-  --bs-link-hover-color: #0a58ca;
-  --bs-code-color: #d63384;
-  --bs-highlight-bg: #fff3cd;
+  --bs-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+  --bs-box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
+  --bs-box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);
+  --bs-box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);
+  --bs-focus-ring-width: 0.25rem;
+  --bs-focus-ring-opacity: 0.25;
+  --bs-focus-ring-color: rgba(13, 110, 253, 0.25);
+  --bs-form-valid-color: #198754;
+  --bs-form-valid-border-color: #198754;
+  --bs-form-invalid-color: #dc3545;
+  --bs-form-invalid-border-color: #dc3545;
+}
+
+[data-bs-theme=dark] {
+  color-scheme: dark;
+  --bs-body-color: #dee2e6;
+  --bs-body-color-rgb: 222, 226, 230;
+  --bs-body-bg: #212529;
+  --bs-body-bg-rgb: 33, 37, 41;
+  --bs-emphasis-color: #fff;
+  --bs-emphasis-color-rgb: 255, 255, 255;
+  --bs-secondary-color: rgba(222, 226, 230, 0.75);
+  --bs-secondary-color-rgb: 222, 226, 230;
+  --bs-secondary-bg: #343a40;
+  --bs-secondary-bg-rgb: 52, 58, 64;
+  --bs-tertiary-color: rgba(222, 226, 230, 0.5);
+  --bs-tertiary-color-rgb: 222, 226, 230;
+  --bs-tertiary-bg: #2b3035;
+  --bs-tertiary-bg-rgb: 43, 48, 53;
+  --bs-primary-text-emphasis: #6ea8fe;
+  --bs-secondary-text-emphasis: #a7acb1;
+  --bs-success-text-emphasis: #75b798;
+  --bs-info-text-emphasis: #6edff6;
+  --bs-warning-text-emphasis: #ffda6a;
+  --bs-danger-text-emphasis: #ea868f;
+  --bs-light-text-emphasis: #f8f9fa;
+  --bs-dark-text-emphasis: #dee2e6;
+  --bs-primary-bg-subtle: #031633;
+  --bs-secondary-bg-subtle: #161719;
+  --bs-success-bg-subtle: #051b11;
+  --bs-info-bg-subtle: #032830;
+  --bs-warning-bg-subtle: #332701;
+  --bs-danger-bg-subtle: #2c0b0e;
+  --bs-light-bg-subtle: #343a40;
+  --bs-dark-bg-subtle: #1a1d20;
+  --bs-primary-border-subtle: #084298;
+  --bs-secondary-border-subtle: #41464b;
+  --bs-success-border-subtle: #0f5132;
+  --bs-info-border-subtle: #087990;
+  --bs-warning-border-subtle: #997404;
+  --bs-danger-border-subtle: #842029;
+  --bs-light-border-subtle: #495057;
+  --bs-dark-border-subtle: #343a40;
+  --bs-heading-color: inherit;
+  --bs-link-color: #6ea8fe;
+  --bs-link-hover-color: #8bb9fe;
+  --bs-link-color-rgb: 110, 168, 254;
+  --bs-link-hover-color-rgb: 139, 185, 254;
+  --bs-code-color: #e685b5;
+  --bs-highlight-color: #dee2e6;
+  --bs-highlight-bg: #664d03;
+  --bs-border-color: #495057;
+  --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
+  --bs-form-valid-color: #75b798;
+  --bs-form-valid-border-color: #75b798;
+  --bs-form-invalid-color: #ea868f;
+  --bs-form-invalid-border-color: #ea868f;
 }
 
 *,
@@ -102,7 +209,7 @@ hr {
   margin: 1rem 0;
   color: inherit;
   border: 0;
-  border-top: 1px solid;
+  border-top: var(--bs-border-width) solid;
   opacity: 0.25;
 }
 
@@ -111,6 +218,7 @@ h6, h5, h4, h3, h2, h1 {
   margin-bottom: 0.5rem;
   font-weight: 500;
   line-height: 1.2;
+  color: var(--bs-heading-color);
 }
 
 h1 {
@@ -219,6 +327,7 @@ small {
 
 mark {
   padding: 0.1875em;
+  color: var(--bs-highlight-color);
   background-color: var(--bs-highlight-bg);
 }
 
@@ -239,11 +348,11 @@ sup {
 }
 
 a {
-  color: var(--bs-link-color);
+  color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
   text-decoration: underline;
 }
 a:hover {
-  color: var(--bs-link-hover-color);
+  --bs-link-color-rgb: var(--bs-link-hover-color-rgb);
 }
 
 a:not([href]):not([class]), a:not([href]):not([class]):hover {
@@ -310,7 +419,7 @@ table {
 caption {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
-  color: #6c757d;
+  color: var(--bs-secondary-color);
   text-align: right;
 }
 
@@ -407,8 +516,8 @@ legend {
   width: 100%;
   padding: 0;
   margin-bottom: 0.5rem;
-  font-size: calc(1.275rem + 0.3vw);
   line-height: inherit;
+  font-size: calc(1.275rem + 0.3vw);
 }
 @media (min-width: 1200px) {
   legend {
@@ -434,8 +543,12 @@ legend + * {
 }
 
 [type=search] {
-  outline-offset: -2px;
   -webkit-appearance: textfield;
+  outline-offset: -2px;
+}
+[type=search]::-webkit-search-cancel-button {
+  cursor: pointer;
+  filter: grayscale(1);
 }
 
 [type="tel"],

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_accordion.scss

@@ -20,7 +20,6 @@
   --#{$prefix}accordion-btn-icon-transform: #{$accordion-icon-transform};
   --#{$prefix}accordion-btn-icon-transition: #{$accordion-icon-transition};
   --#{$prefix}accordion-btn-active-icon: #{escape-svg($accordion-button-active-icon)};
-  --#{$prefix}accordion-btn-focus-border-color: #{$accordion-button-focus-border-color};
   --#{$prefix}accordion-btn-focus-box-shadow: #{$accordion-button-focus-box-shadow};
   --#{$prefix}accordion-body-padding-x: #{$accordion-body-padding-x};
   --#{$prefix}accordion-body-padding-y: #{$accordion-body-padding-y};
@@ -74,7 +73,6 @@
 
   &:focus {
     z-index: 3;
-    border-color: var(--#{$prefix}accordion-btn-focus-border-color);
     outline: 0;
     box-shadow: var(--#{$prefix}accordion-btn-focus-box-shadow);
   }
@@ -92,7 +90,7 @@
   &:first-of-type {
     @include border-top-radius(var(--#{$prefix}accordion-border-radius));
 
-    .accordion-button {
+    > .accordion-header .accordion-button {
       @include border-top-radius(var(--#{$prefix}accordion-inner-border-radius));
     }
   }
@@ -105,13 +103,13 @@
   &:last-of-type {
     @include border-bottom-radius(var(--#{$prefix}accordion-border-radius));
 
-    .accordion-button {
+    > .accordion-header .accordion-button {
       &.collapsed {
         @include border-bottom-radius(var(--#{$prefix}accordion-inner-border-radius));
       }
     }
 
-    .accordion-collapse {
+    > .accordion-collapse {
       @include border-bottom-radius(var(--#{$prefix}accordion-border-radius));
     }
   }
@@ -127,11 +125,7 @@
 // Remove borders and border-radius to keep accordion items edge-to-edge.
 
 .accordion-flush {
-  .accordion-collapse {
-    border-width: 0;
-  }
-
-  .accordion-item {
+  > .accordion-item {
     border-right: 0;
     border-left: 0;
     @include border-radius(0);
@@ -139,11 +133,21 @@
     &:first-child { border-top: 0; }
     &:last-child { border-bottom: 0; }
 
-    .accordion-button {
-      &,
-      &.collapsed {
-        @include border-radius(0);
-      }
+    // stylelint-disable selector-max-class
+    > .accordion-collapse,
+    > .accordion-header .accordion-button,
+    > .accordion-header .accordion-button.collapsed {
+      @include border-radius(0);
+    }
+    // stylelint-enable selector-max-class
+  }
+}
+
+@if $enable-dark-mode {
+  @include color-mode(dark) {
+    .accordion-button::after {
+      --#{$prefix}accordion-btn-icon: #{escape-svg($accordion-button-icon-dark)};
+      --#{$prefix}accordion-btn-active-icon: #{escape-svg($accordion-button-active-icon-dark)};
     }
   }
 }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_alert.scss

@@ -12,6 +12,7 @@
   --#{$prefix}alert-border-color: transparent;
   --#{$prefix}alert-border: #{$alert-border-width} solid var(--#{$prefix}alert-border-color);
   --#{$prefix}alert-border-radius: #{$alert-border-radius};
+  --#{$prefix}alert-link-color: inherit;
   // scss-docs-end alert-css-vars
 
   position: relative;
@@ -32,6 +33,7 @@
 // Provide class for links that match alerts
 .alert-link {
   font-weight: $alert-link-font-weight;
+  color: var(--#{$prefix}alert-link-color);
 }
 
 
@@ -54,18 +56,13 @@
 
 
 // scss-docs-start alert-modifiers
-// Generate contextual modifier classes for colorizing the alert.
-
-@each $state, $value in $theme-colors {
-  $alert-background: shift-color($value, $alert-bg-scale);
-  $alert-border: shift-color($value, $alert-border-scale);
-  $alert-color: shift-color($value, $alert-color-scale);
-
-  @if (contrast-ratio($alert-background, $alert-color) < $min-contrast-ratio) {
-    $alert-color: mix($value, color-contrast($alert-background), abs($alert-color-scale));
-  }
+// Generate contextual modifier classes for colorizing the alert
+@each $state in map-keys($theme-colors) {
   .alert-#{$state} {
-    @include alert-variant($alert-background, $alert-border, $alert-color);
+    --#{$prefix}alert-color: var(--#{$prefix}#{$state}-text-emphasis);
+    --#{$prefix}alert-bg: var(--#{$prefix}#{$state}-bg-subtle);
+    --#{$prefix}alert-border-color: var(--#{$prefix}#{$state}-border-subtle);
+    --#{$prefix}alert-link-color: var(--#{$prefix}#{$state}-text-emphasis);
   }
 }
 // scss-docs-end alert-modifiers

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_button-group.scss

@@ -39,7 +39,7 @@
   // Prevent double borders when buttons are next to each other
   > :not(.btn-check:first-child) + .btn,
   > .btn-group:not(:first-child) {
-    margin-left: -$btn-border-width;
+    margin-left: calc(-1 * #{$btn-border-width}); // stylelint-disable-line function-disallowed-list
   }
 
   // Reset rounded corners
@@ -126,7 +126,7 @@
 
   > .btn:not(:first-child),
   > .btn-group:not(:first-child) {
-    margin-top: -$btn-border-width;
+    margin-top: calc(-1 * #{$btn-border-width}); // stylelint-disable-line function-disallowed-list
   }
 
   // Reset rounded corners
@@ -135,7 +135,12 @@
     @include border-bottom-radius(0);
   }
 
-  > .btn ~ .btn,
+  // The top radius should be 0 if the button is:
+  // - the "third or more" child
+  // - the second child and the previous element isn't `.btn-check` (making it the first child visually)
+  // - part of a btn-group which isn't the first child
+  > .btn:nth-child(n + 3),
+  > :not(.btn-check) + .btn,
   > .btn-group:not(:first-child) > .btn {
     @include border-top-radius(0);
   }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_buttons.scss

@@ -10,7 +10,7 @@
   @include rfs($btn-font-size, --#{$prefix}btn-font-size);
   --#{$prefix}btn-font-weight: #{$btn-font-weight};
   --#{$prefix}btn-line-height: #{$btn-line-height};
-  --#{$prefix}btn-color: #{$body-color};
+  --#{$prefix}btn-color: #{$btn-color};
   --#{$prefix}btn-bg: transparent;
   --#{$prefix}btn-border-width: #{$btn-border-width};
   --#{$prefix}btn-border-color: transparent;
@@ -100,6 +100,15 @@
     }
   }
 
+  .btn-check:checked:focus-visible + & {
+    // Avoid using mixin so we can pass custom focus shadow properly
+    @if $enable-shadows {
+      box-shadow: var(--#{$prefix}btn-active-shadow), var(--#{$prefix}btn-focus-box-shadow);
+    } @else {
+      box-shadow: var(--#{$prefix}btn-focus-box-shadow);
+    }
+  }
+
   &:disabled,
   &.disabled,
   fieldset:disabled & {
@@ -169,8 +178,8 @@
   --#{$prefix}btn-active-border-color: transparent;
   --#{$prefix}btn-disabled-color: #{$btn-link-disabled-color};
   --#{$prefix}btn-disabled-border-color: transparent;
-  --#{$prefix}btn-box-shadow: none;
-  --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix(color-contrast($primary), $primary, 15%))};
+  --#{$prefix}btn-box-shadow: 0 0 0 #000; // Can't use `none` as keyword negates all values when used with multiple shadows
+  --#{$prefix}btn-focus-shadow-rgb: #{$btn-link-focus-shadow-rgb};
 
   text-decoration: $link-decoration;
   @if $enable-gradients {

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_card.scss

@@ -7,6 +7,8 @@
   --#{$prefix}card-spacer-y: #{$card-spacer-y};
   --#{$prefix}card-spacer-x: #{$card-spacer-x};
   --#{$prefix}card-title-spacer-y: #{$card-title-spacer-y};
+  --#{$prefix}card-title-color: #{$card-title-color};
+  --#{$prefix}card-subtitle-color: #{$card-subtitle-color};
   --#{$prefix}card-border-width: #{$card-border-width};
   --#{$prefix}card-border-color: #{$card-border-color};
   --#{$prefix}card-border-radius: #{$card-border-radius};
@@ -28,6 +30,7 @@
   flex-direction: column;
   min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106
   height: var(--#{$prefix}card-height);
+  color: var(--#{$prefix}body-color);
   word-wrap: break-word;
   background-color: var(--#{$prefix}card-bg);
   background-clip: border-box;
@@ -73,11 +76,13 @@
 
 .card-title {
   margin-bottom: var(--#{$prefix}card-title-spacer-y);
+  color: var(--#{$prefix}card-title-color);
 }
 
 .card-subtitle {
   margin-top: calc(-.5 * var(--#{$prefix}card-title-spacer-y)); // stylelint-disable-line function-disallowed-list
   margin-bottom: 0;
+  color: var(--#{$prefix}card-subtitle-color);
 }
 
 .card-text:last-child {
@@ -188,8 +193,7 @@
     // The child selector allows nested `.card` within `.card-group`
     // to display properly.
     > .card {
-      // Flexbugs #4: https://github.com/philipwalton/flexbugs#flexbug-4
-      flex: 1 0 0%;
+      flex: 1 0 0;
       margin-bottom: 0;
 
       + .card {
@@ -202,13 +206,13 @@
         &:not(:last-child) {
           @include border-end-radius(0);
 
-          .card-img-top,
-          .card-header {
+          > .card-img-top,
+          > .card-header {
             // stylelint-disable-next-line property-disallowed-list
             border-top-right-radius: 0;
           }
-          .card-img-bottom,
-          .card-footer {
+          > .card-img-bottom,
+          > .card-footer {
             // stylelint-disable-next-line property-disallowed-list
             border-bottom-right-radius: 0;
           }
@@ -217,13 +221,13 @@
         &:not(:first-child) {
           @include border-start-radius(0);
 
-          .card-img-top,
-          .card-header {
+          > .card-img-top,
+          > .card-header {
             // stylelint-disable-next-line property-disallowed-list
             border-top-left-radius: 0;
           }
-          .card-img-bottom,
-          .card-footer {
+          > .card-img-bottom,
+          > .card-footer {
             // stylelint-disable-next-line property-disallowed-list
             border-bottom-left-radius: 0;
           }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_carousel.scss

@@ -99,6 +99,7 @@
   color: $carousel-control-color;
   text-align: center;
   background: none;
+  filter: var(--#{$prefix}carousel-control-icon-filter);
   border: 0;
   opacity: $carousel-control-opacity;
   @include transition($carousel-control-transition);
@@ -132,19 +133,11 @@
   background-size: 100% 100%;
 }
 
-/* rtl:options: {
-  "autoRename": true,
-  "stringMap":[ {
-    "name"    : "prev-next",
-    "search"  : "prev",
-    "replace" : "next"
-  } ]
-} */
 .carousel-control-prev-icon {
-  background-image: escape-svg($carousel-control-prev-icon-bg);
+  background-image: escape-svg($carousel-control-prev-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-next-icon-bg) + "*/"};
 }
 .carousel-control-next-icon {
-  background-image: escape-svg($carousel-control-next-icon-bg);
+  background-image: escape-svg($carousel-control-next-icon-bg) #{"/*rtl:" + escape-svg($carousel-control-prev-icon-bg) + "*/"};
 }
 
 // Optional indicator pips/controls
@@ -165,7 +158,6 @@
   margin-right: $carousel-control-width;
   margin-bottom: 1rem;
   margin-left: $carousel-control-width;
-  list-style: none;
 
   [data-bs-target] {
     box-sizing: content-box;
@@ -177,7 +169,7 @@
     margin-left: $carousel-indicator-spacer;
     text-indent: -999px;
     cursor: pointer;
-    background-color: $carousel-indicator-active-bg;
+    background-color: var(--#{$prefix}carousel-indicator-active-bg);
     background-clip: padding-box;
     border: 0;
     // Use transparent borders to increase the hit area by 10px on top and bottom.
@@ -204,23 +196,31 @@
   left: (100% - $carousel-caption-width) * .5;
   padding-top: $carousel-caption-padding-y;
   padding-bottom: $carousel-caption-padding-y;
-  color: $carousel-caption-color;
+  color: var(--#{$prefix}carousel-caption-color);
   text-align: center;
 }
 
 // Dark mode carousel
 
+@mixin carousel-dark() {
+  --#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg-dark};
+  --#{$prefix}carousel-caption-color: #{$carousel-caption-color-dark};
+  --#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter-dark};
+}
+
 .carousel-dark {
-  .carousel-control-prev-icon,
-  .carousel-control-next-icon {
-    filter: $carousel-dark-control-icon-filter;
-  }
+  @include carousel-dark();
+}
 
-  .carousel-indicators [data-bs-target] {
-    background-color: $carousel-dark-indicator-active-bg;
-  }
+:root,
+[data-bs-theme="light"] {
+  --#{$prefix}carousel-indicator-active-bg: #{$carousel-indicator-active-bg};
+  --#{$prefix}carousel-caption-color: #{$carousel-caption-color};
+  --#{$prefix}carousel-control-icon-filter: #{$carousel-control-icon-filter};
+}
 
-  .carousel-caption {
-    color: $carousel-dark-caption-color;
+@if $enable-dark-mode {
+  @include color-mode(dark, true) {
+    @include carousel-dark();
   }
 }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_close.scss

@@ -4,37 +4,63 @@
 // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
 
 .btn-close {
+  // scss-docs-start close-css-vars
+  --#{$prefix}btn-close-color: #{$btn-close-color};
+  --#{$prefix}btn-close-bg: #{ escape-svg($btn-close-bg) };
+  --#{$prefix}btn-close-opacity: #{$btn-close-opacity};
+  --#{$prefix}btn-close-hover-opacity: #{$btn-close-hover-opacity};
+  --#{$prefix}btn-close-focus-shadow: #{$btn-close-focus-shadow};
+  --#{$prefix}btn-close-focus-opacity: #{$btn-close-focus-opacity};
+  --#{$prefix}btn-close-disabled-opacity: #{$btn-close-disabled-opacity};
+  // scss-docs-end close-css-vars
+
   box-sizing: content-box;
   width: $btn-close-width;
   height: $btn-close-height;
   padding: $btn-close-padding-y $btn-close-padding-x;
-  color: $btn-close-color;
-  background: transparent escape-svg($btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
+  color: var(--#{$prefix}btn-close-color);
+  background: transparent var(--#{$prefix}btn-close-bg) center / $btn-close-width auto no-repeat; // include transparent for button elements
+  filter: var(--#{$prefix}btn-close-filter);
   border: 0; // for button elements
   @include border-radius();
-  opacity: $btn-close-opacity;
+  opacity: var(--#{$prefix}btn-close-opacity);
 
   // Override <a>'s hover style
   &:hover {
-    color: $btn-close-color;
+    color: var(--#{$prefix}btn-close-color);
     text-decoration: none;
-    opacity: $btn-close-hover-opacity;
+    opacity: var(--#{$prefix}btn-close-hover-opacity);
   }
 
   &:focus {
     outline: 0;
-    box-shadow: $btn-close-focus-shadow;
-    opacity: $btn-close-focus-opacity;
+    box-shadow: var(--#{$prefix}btn-close-focus-shadow);
+    opacity: var(--#{$prefix}btn-close-focus-opacity);
   }
 
   &:disabled,
   &.disabled {
     pointer-events: none;
     user-select: none;
-    opacity: $btn-close-disabled-opacity;
+    opacity: var(--#{$prefix}btn-close-disabled-opacity);
   }
 }
 
-.btn-close-white {
-  filter: $btn-close-white-filter;
+@mixin btn-close-white() {
+  --#{$prefix}btn-close-filter: #{$btn-close-filter-dark};
+}
+
+.btn-close-white {
+  @include btn-close-white();
+}
+
+:root,
+[data-bs-theme="light"] {
+  --#{$prefix}btn-close-filter: #{$btn-close-filter};
+}
+
+@if $enable-dark-mode {
+  @include color-mode(dark, true) {
+    @include btn-close-white();
+  }
 }

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_dropdown.scss

@@ -184,6 +184,7 @@
   white-space: nowrap; // prevent links from randomly breaking onto new lines
   background-color: transparent; // For `<button>`s
   border: 0; // For `<button>`s
+  @include border-radius(var(--#{$prefix}dropdown-item-border-radius, 0));
 
   &:hover,
   &:focus {

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_functions.scss

@@ -157,7 +157,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
 
   @each $color in $foregrounds {
     $contrast-ratio: contrast-ratio($background, $color);
-    @if $contrast-ratio > $min-contrast-ratio {
+    @if $contrast-ratio >= $min-contrast-ratio {
       @return $color;
     } @else if $contrast-ratio > $max-ratio {
       $max-ratio: $contrast-ratio;
@@ -177,7 +177,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
   @return if($l1 > $l2, divide($l1 + .05, $l2 + .05), divide($l2 + .05, $l1 + .05));
 }
 
-// Return WCAG2.1 relative luminance
+// Return WCAG2.2 relative luminance
 // See https://www.w3.org/TR/WCAG/#dfn-relative-luminance
 // See https://www.w3.org/TR/WCAG/#dfn-contrast-ratio
 @function luminance($color) {
@@ -188,7 +188,7 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
   );
 
   @each $name, $value in $rgb {
-    $value: if(divide($value, 255) < .03928, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));
+    $value: if(divide($value, 255) < .04045, divide(divide($value, 255), 12.92), nth($_luminance-list, $value + 1));
     $rgb: map-merge($rgb, ($name: $value));
   }
 

EgwCoreLib.BlazorTest/wwwroot/lib/bootstrap/scss/_grid.scss

@@ -2,6 +2,12 @@
 //
 // Rows contain your columns.
 
+:root {
+  @each $name, $value in $grid-breakpoints {
+    --#{$prefix}breakpoint-#{$name}: #{$value};
+  }
+}
+
 @if $enable-grid-classes {
   .row {
     @include make-row();