Merge branch 'main' into develop

Aggiunto componente BlazorDialog

.gitlab-ci.yml

@@ -1,5 +1,5 @@
 variables:
- VERS_MAIN: '1.4'
+ VERS_MAIN: '1.5'
  NEW_REL: ''
  NUM_REL: '0.1.2.3'
  NUM_DEB: '0.1.2-beta.3'
@@ -89,21 +89,10 @@ variables:
 
 stages:
  - build
+ - deploy
  - release
 
 # ---------- BUILD ----------
-EgwCoreLib.Razor:build:
-  stage: build
-  tags:
-    - win
-  variables:
-    APP_NAME: EgwCoreLib.Razor
-    SOL_NAME: EgwCoreLib
-  before_script:
-    - *nuget-fix
-    - dotnet restore "$env:SOL_NAME.sln"
-  script:    
-    - dotnet build $env:APP_NAME/$env:APP_NAME.csproj
 
 EgwCoreLib.Utils:build:
   stage: build
@@ -115,9 +104,57 @@ EgwCoreLib.Utils:build:
   before_script:
     - *nuget-fix
     - dotnet restore "$env:SOL_NAME.sln"
+    - *version-fix
   script:    
     - dotnet build $env:APP_NAME/$env:APP_NAME.csproj
 
+EgwCoreLib.Razor:build:
+  stage: build
+  tags:
+    - win
+  variables:
+    APP_NAME: EgwCoreLib.Razor
+    SOL_NAME: EgwCoreLib
+  before_script:
+    - *nuget-fix
+    - dotnet restore "$env:SOL_NAME.sln"
+    - *version-fix
+  script:    
+    - dotnet build $env:APP_NAME/$env:APP_NAME.csproj
+
+EgwCoreLib.BlazorTest:build:
+  stage: build
+  tags:
+    - win
+  variables:
+    APP_NAME: EgwCoreLib.BlazorTest
+    SOL_NAME: EgwCoreLib
+  before_script:
+    - *nuget-fix
+    - dotnet restore "$env:SOL_NAME.sln"
+    - *version-fix
+  script:    
+    - dotnet build $env:APP_NAME/$env:APP_NAME.csproj
+
+# ----- Start DEPLOY develop (IIS01) -----
+EgwCoreLib.BlazorTest:IIS01:deploy:
+  stage: deploy
+  tags:
+    - win
+  variables:
+    APP_NAME: EgwCoreLib.BlazorTest
+    SOL_NAME: EgwCoreLib
+  before_script:
+    - *nuget-fix
+    - dotnet restore "$env:SOL_NAME.sln"
+    - *version-fix
+  rules:
+    - if: $CI_COMMIT_BRANCH == 'develop'
+  needs: ["EgwCoreLib.BlazorTest:build"]
+  script: 
+    - dotnet build $env:APP_NAME/$env:APP_NAME.csproj
+    - dotnet publish -p:PublishProfile=IIS01.pubxml -p:RunCodeAnalysis=false -p:Configuration=Release -p:username=jenkins -p:Password=$IIS_PWD -p:AllowUntrustedCertificate=true -p:verbosity=quiet $env:APP_NAME/$env:APP_NAME.csproj
+
 # ---------- Upload Debug/Unstable ----------
 EgwCoreLib.Razor:release-dev:
   stage: release

EgwCoreLib.BlazorTest/.config/dotnet-tools.json

@@ -0,0 +1,5 @@
+{
+  "version": 1,
+  "isRoot": true,
+  "tools": {}
+}

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/CmpFooter.razor

@@ -0,0 +1,16 @@
+<div class="d-flex justify-content-between text-light w-100">
+    <div class="px-1 text-left">
+        <b>EgwCoreLib</b> <span class="small">v.@version</span>
+    </div>
+    <div class="px-1 text-end">
+        <span class="small px-1">@adesso</span>
+        <a class="text-light fw-bold" href="https://www.egalware.com/" target="_blank">Egalware<img class="img-fluid" width="16" src="images/EgalwareLogo.svg" /></a>
+    </div>
+</div>
+
+@code {
+    protected DateTime adesso = DateTime.Now;
+
+    Version version = typeof(Program).Assembly.GetName().Version;
+
+}

EgwCoreLib.BlazorTest/Components/CmpTop.razor

@@ -0,0 +1,16 @@
+<div class="row pt-2">
+    <div class="col-4 px-0">
+    </div>
+    <div class="col-4 px-0 d-none d-lg-block text-center h4 text-truncate">
+        <NavLink class="btn btn-primary" href="ForceReload" >
+            <span class="oi oi-home" aria-hidden="true"></span> Home
+        </NavLink>
+    </div>
+    <div class="col-4 px-0 text-end d-flex flex-row-reverse">
+        <SearchMod></SearchMod>
+    </div>
+</div>
+
+@code {
+
+}

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/Components/SearchMod.razor

@@ -0,0 +1,31 @@
+
+<div class="input-group input-group-sm">
+    <input @bind-value="searchVal" @bind-value:event="oninput" type="text" class="form-control" title="Campo Ricerca" placeholder="Ricerca [ALT-R]" accesskey="R" />
+    <button @onclick="reset" class="btn btn-success input-group-text">reset</button>
+</div>
+
+@code {
+    #region Public Properties
+
+    [Parameter]
+    public EventCallback<string> searchUpdated { get; set; }
+
+    [Parameter]
+    public string searchVal { get; set; } = "";
+
+    #endregion Public Properties
+
+    #region Private Methods
+
+    private void reportChange()
+    {
+        searchUpdated.InvokeAsync(searchVal);
+    }
+
+    private void reset()
+    {
+        searchVal = "";
+    }
+
+    #endregion Private Methods
+}

EgwCoreLib.BlazorTest/Components/TestJsInterop.razor

@@ -1,9 +0,0 @@
-<h3>TestJsInterop</h3>
-
-
-<CopyToClipboard Text="@qrCodeVal"></CopyToClipboard>
-
-@code {
-
-    protected string qrCodeVal { get; set; } = "Some text for  clipboard-copy  debug";
-}

EgwCoreLib.BlazorTest/Data/TestData.cs

@@ -0,0 +1,27 @@
+using EgwCoreLib.BlazorTest.Pages;
+
+namespace EgwCoreLib.BlazorTest.Data
+{
+    public class TestData
+    {
+        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/Data/WeatherForecast.cs

@@ -1,13 +0,0 @@
-namespace EgwCoreLib.BlazorTest.Data
-{
-    public class WeatherForecast
-    {
-        public DateTime Date { get; set; }
-
-        public int TemperatureC { get; set; }
-
-        public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
-
-        public string? Summary { get; set; }
-    }
-}

EgwCoreLib.BlazorTest/Data/WeatherForecastService.cs

@@ -1,20 +0,0 @@
-namespace EgwCoreLib.BlazorTest.Data
-{
-    public class WeatherForecastService
-    {
-        private static readonly string[] Summaries = new[]
-        {
-        "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
-    };
-
-        public Task<WeatherForecast[]> GetForecastAsync(DateTime startDate)
-        {
-            return Task.FromResult(Enumerable.Range(1, 25).Select(index => new WeatherForecast
-            {
-                Date = startDate.AddDays(index),
-                TemperatureC = Random.Shared.Next(-20, 55),
-                Summary = Summaries[Random.Shared.Next(Summaries.Length)]
-            }).ToArray());
-        }
-    }
-}

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>
@@ -11,10 +11,22 @@
     <Content Remove="compilerconfig.json" />
   </ItemGroup>
 
+  <ItemGroup>
+    <_WebToolingArtifacts Remove="Properties\PublishProfiles\IIS01.pubxml" />
+  </ItemGroup>
+
   <ItemGroup>
     <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>

EgwCoreLib.BlazorTest/Pages/FetchData.razor

@@ -1,42 +0,0 @@
-@page "/fetchdata"
-
-<PageTitle>Weather forecast</PageTitle>
-
-@using EgwCoreLib.BlazorTest.Data
-@inject WeatherForecastService ForecastService
-
-<h1>Weather forecast</h1>
-
-<p>This component demonstrates fetching data from a service.</p>
-
-@if (forecasts == null)
-{
-    <p><em>Loading...</em></p>
-}
-else
-{
-    <table class="table">
-        <thead>
-            <tr>
-                <th>Date<Sorter ParamName="Date" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter></th>
-                <th>Temp. (C)<Sorter ParamName="TempC" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter></th>
-                <th>Temp. (F)<Sorter ParamName="TempF" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter></th>
-                <th>Summary<Sorter ParamName="Summary" IsAsc="@sortAsc" CurrParam="@sortField" sortReq="SortRequested"></Sorter></th>
-            </tr>
-        </thead>
-        <tbody>
-            @foreach (var forecast in forecasts)
-            {
-                <tr>
-                    <td>@forecast.Date.ToShortDateString()</td>
-                    <td>@forecast.TemperatureC</td>
-                    <td>@forecast.TemperatureF</td>
-                    <td>@forecast.Summary</td>
-                </tr>
-            }
-        </tbody>
-    </table>
-    <DataPager PageSize="@numRecord" currPage="@currPage" numRecordChanged="SetNumRec" numPageChanged="SetCurrPage" totalCount="@totalCount" showLoading="@isLoading" PageSizeList="@PageSizeEnab" />
-}
-
-

EgwCoreLib.BlazorTest/Pages/FetchData.razor.cs

@@ -1,122 +0,0 @@
-using EgwCoreLib.BlazorTest.Data;
-using EgwCoreLib.Razor;
-
-namespace EgwCoreLib.BlazorTest.Pages
-{
-    public partial class FetchData
-    {
-        #region Protected Properties
-
-        protected List<int> PageSizeEnab { get; set; } = new List<int>();
-
-        #endregion Protected Properties
-
-        #region Protected Methods
-
-        protected override async Task OnInitializedAsync()
-        {
-            rawData = await ForecastService.GetForecastAsync(DateTime.Now);
-            PageSizeEnab = new List<int>()
-            {
-                4,8,12,16,20,24,28,32,36,40
-            };
-            await ReloadAllData();
-        }
-
-        protected async Task ReloadAllData()
-        {
-            await Task.Delay(1);
-            totalCount = rawData.Count();
-            List<WeatherForecast> currForecast = rawData.ToList();
-            // effetuo sort...
-            if (!string.IsNullOrEmpty(sortField))
-            {
-                switch (sortField)
-                {
-                    case "TempC":
-                        if (sortAsc)
-                        {
-                            currForecast = currForecast.OrderBy(x => x.TemperatureC).ToList();
-                        }
-                        else
-                        {
-                            currForecast = currForecast.OrderByDescending(x => x.TemperatureC).ToList();
-                        }
-                        break;
-                    case "TempF":
-                        if (sortAsc)
-                        {
-                            currForecast = currForecast.OrderBy(x => x.TemperatureF).ToList();
-                        }
-                        else
-                        {
-                            currForecast = currForecast.OrderByDescending(x => x.TemperatureF).ToList();
-                        }
-                        break;
-                    case "Summary":
-                        if (sortAsc)
-                        {
-                            currForecast = currForecast.OrderBy(x => x.Summary).ToList();
-                        }
-                        else
-                        {
-                            currForecast = currForecast.OrderByDescending(x => x.Summary).ToList();
-                        }
-                        break;
-                    default:
-                    case "Date":
-                        if (sortAsc)
-                        {
-                            currForecast = currForecast.OrderBy(x => x.Date).ToList();
-                        }
-                        else
-                        {
-                            currForecast = currForecast.OrderByDescending(x => x.Date).ToList();
-                        }
-                        break;
-                }
-            }
-
-            forecasts = currForecast.Skip(numRecord * (currPage - 1)).Take(numRecord).ToList();
-        }
-
-        protected async Task SetCurrPage(int newNum)
-        {
-            currPage = newNum;
-            await ReloadAllData();
-        }
-
-        protected async Task SetNumRec(int newNum)
-        {
-            numRecord = newNum;
-            await ReloadAllData();
-        }
-
-        protected async Task SortRequested(Sorter.SortCallBack e)
-        {
-            sortField = e.ParamName;
-            sortAsc = e.IsAscending;
-            await ReloadAllData();
-        }
-
-        #endregion Protected Methods
-
-        #region Private Fields
-
-        private List<WeatherForecast>? forecasts;
-        private WeatherForecast[] rawData { get; set; } = new WeatherForecast[1];
-        private bool sortAsc = true;
-        private string sortField = "";
-
-        #endregion Private Fields
-
-        #region Private Properties
-
-        private int currPage { get; set; } = 1;
-        private bool isLoading { get; set; } = false;
-        private int numRecord { get; set; } = 8;
-        private int totalCount { get; set; } = 0;
-
-        #endregion Private Properties
-    }
-}

EgwCoreLib.BlazorTest/Pages/ForceReload.razor

@@ -0,0 +1,10 @@
+@page "/ForceReload"
+@inject NavigationManager NavMan
+<h3>ForceReload</h3>
+
+@code {
+    protected override void OnInitialized()
+    {
+        NavMan.NavigateTo("/", true);
+    }
+}

EgwCoreLib.BlazorTest/Pages/Index.razor

@@ -1,125 +1,45 @@
 @page "/"
+@using EgwCoreLib.BlazorTest.Data
 
-<PageTitle>Index</PageTitle>
-<div>
+<PageTitle>EgwCoreLib Test Site</PageTitle>
 
-    <div class="row py-4" style="background-color: #ACDDAC;">
-        <div class="col-4">
-            @*<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
-            <rect width="10" height="10">
-            <animate attributeName="rx"
-            values="0;5;0"
-            dur="5s"
-            repeatCount="indefinite" />
-            </rect>
-            </svg>*@
-        </div>
-        <div class="col-4">
-            <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
-                <defs>
-                    <radialGradient id="RadialGrad2">
-                        <stop offset="0%" stop-color="#000000" />
-                        <stop offset="80%" stop-color="#151515" />
-                        <stop offset="90%" stop-color="#444444" />
-                        <stop offset="100%" stop-color="#878787" />
-                    </radialGradient>
-                </defs>
-                <rect width="100" height="100" rx="50" fill="url(#RadialGrad2)" fill-opacity="0.5">
-                </rect>
-                <text id="TitleElem" x="10%" y="50%" class="text-light" style="font-size:2rem;">Titolo</text>
-                <g>
-                    <rect x="10%" y="10%" width="80%" height="80%" fill="white" fill-opacity="0.1">
-                    </rect>
-                    <text x="10%" y="70%" class="text-light" style="font-size:0.8rem;">
-                        testo più lungo... 0123456789
-                        <animate attributeName="x"
-                                 values="10%;10%;-10%;-80%;-100%;-100%;10%"
-                                 dur="6s"
-                                 begin="2s"
-                                 repeatCount="indefinite" />
-                    </text>
-                </g>
-            </svg>
-        </div>
-        <div class="col-4">
-            <svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
-                <defs>
-                    <radialGradient id="RadialGrad2">
-                        <stop offset="0%" stop-color="#000000" />
-                        <stop offset="80%" stop-color="#151515" />
-                        <stop offset="90%" stop-color="#444444" />
-                        <stop offset="100%" stop-color="#878787" />
-                    </radialGradient>
-                </defs>
-                <rect width="10" height="10" rx="5" fill="url(#RadialGrad2)" fill-opacity="0.5">
-                </rect>
-            </svg>
-        </div>
-        <div class="col-2 bg-dark">
-        </div>
-        <div class="col-2 bg-dark">
-        </div>
-        <div class="col-2 bg-dark">
-            <CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
-        </div>
-        <div class="col-2 bg-dark">
-            <CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
-        </div>
-        <div class="col-2 bg-dark">
-        </div>
-        <div class="col-2 bg-dark">
-        </div>
-    </div>
+<div class="mt-4 p-4  bg-primary bg-gradient bg-opacity-25 border border-light text-dark rounded shadow">
     <div class="row">
-        <div class="col-12 containerCalendario">
-            <div class="calendario">
-                <div class="d-flex justify-content-between">
-                    <div>
-                        <CircleGauge Titolo="9:00" Testo="Caricate" maxVal="480" currVal="540" StrokeColorVal="#F1C40F" ShowCircleBtn="true"></CircleGauge>
+        <div class="col-6 col-md-8 pr-0">
+            <h1>EgwCoreLib</h1>
+            <div>
+                Test componenti EgwCoreLib
+            </div>
+        </div>
+        <div class="col-6 col-md-4 text-right pl-0">
+            <div class="d-flex flex-row-reverse">
+                <div class="px-2 badge rounded-pill bg-dark my-4">
+                    <div class="p-2" style="font-size: 1.5em;">
+                        <a class="text-light" href="https://www.egalware.com/" target="_blank">powered by&nbsp;EgalWare <img width="32" class="img-fluid" src="images/EgalwareLogo.svg" /></a>
                     </div>
-                    <div>
-                        <CircleGauge Titolo="4:00" Testo="Lavorate" maxVal="480" currVal="240" StrokeColorVal="#00FF00" ShowCircleBtn="true"></CircleGauge>
-                    </div>
-                    <div>
-                        <CircleGauge Titolo="12:00" Testo="Caricate" maxVal="480" currVal="720" StrokeColorVal="#F1C40F" StrokeColorValOuter="#01C4FF" ShowCircleBtn="true"></CircleGauge>
-                    </div>
-                </div>
-                <div class="containerBtnTemp">
-                    <button class="btn btn-sm btn-warning">
-                        TEMP
-                    </button>
                 </div>
             </div>
         </div>
     </div>
 </div>
+<div class="card mt-2 shadow my-lg-5">
+    <div class="card-body">
+        <div class="row px-0">
+            @foreach (var item in MenuList)
+            {
+                <div class="col-6 col-md-4 col-lg-3 my-1">
+                    <NavLink type="button" class="btn btn-primary bg-gradient text-light p-3 w-100" title="@item.Value" href="@item.Key">
+                        <i class="fa-solid fa-wrench fa-2x mb-2" aria-hidden="true"></i>
+                        <h5>@item.Value</h5>
+                    </NavLink>
+                </div>
+            }
+        </div>
+    </div>
+</div>
+
 
 @code {
-    protected List<CircleGaugeMulti.CircSegm> DDemo1 = new List<CircleGaugeMulti.CircSegm>();
-    protected List<CircleGaugeMulti.CircSegm> DDemoIn2 = new List<CircleGaugeMulti.CircSegm>();
-    protected List<CircleGaugeMulti.CircSegm> DDemoOut2 = new List<CircleGaugeMulti.CircSegm>();
 
-    protected int currVal1 = 1000;
-    protected int currVal2 = 1000;
-    protected int maxVal = 1000;
-
-    protected override void OnInitialized()
-    {
-        DDemo1.Clear();
-        currVal1 = 800;
-        DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 800 });
-        DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 300 });
-        Random rnd = new Random();
-        DDemoIn2.Clear();
-        DDemoOut2.Clear();
-        currVal2 = 1300;
-        DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 1000 });
-        DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 600 });
-        DDemoOut2.Add(new CircleGaugeMulti.CircSegm() { Color = "#1367FD", Value = 300 });
-        // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = 700 });
-        // currVal = rnd.Next(maxVal - 200, maxVal + 500);
-        // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = currVal / 4 });
-        // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#ACFD15", Value = currVal / 4 });
-        // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = currVal / 2 });
-    }
+    private Dictionary<string, string> MenuList { get; set; } = TestData.MenuList;
 }

EgwCoreLib.BlazorTest/Pages/ProvaCalendar.razor

@@ -1,18 +0,0 @@
-@page "/provacalendar"
-
-<PageTitle>Index</PageTitle>
-<div>
-
-    <div class="containerCard">
-        <DtCard cardBg="background-color: #E74C3C"></DtCard>
-    </div>
-    <div class="containerBtnEntrEsc">
-        <BottoniEntrEsc></BottoniEntrEsc>
-    </div>
-
-    <div class="row mt-2">
-        <div class="col">
-            <CalendarMonth DtRif="@dtCurr" MainCss="table table-dark table-borderless" DateSelected="DisplayDate" DateCheck="@DateCheck" SingleWeek="@singleWeek" SelDayCss="selDate rounded-top p-2"></CalendarMonth>
-        </div>
-    </div>    
-</div>

EgwCoreLib.BlazorTest/Pages/ProvaCalendar.razor.cs

@@ -1,60 +0,0 @@
-namespace EgwCoreLib.BlazorTest.Pages
-{
-    public partial class ProvaCalendar
-    {
-        #region Protected Methods
-
-        protected override async Task OnInitializedAsync()
-        {
-            dtCurr = DateTime.Today;
-            await Task.Delay(1);
-            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");
-                }
-                else
-                {
-                    DateCheck[newDate] = "bg-warning text-light rounded-circle p-2";
-                }
-            }
-        }
-
-        #endregion Protected Methods
-
-        #region Private Fields
-
-        private Dictionary<DateTime, string> DateCheck = new Dictionary<DateTime, string>();
-
-        #endregion Private Fields
-
-        #region Private Properties
-
-        private DateTime dtCurr { get; set; } = DateTime.Today;
-
-        private bool singleWeek = false;
-
-        #endregion Private Properties
-
-        #region Private Methods
-
-        private void DisplayDate(DateTime dtSel)
-        {
-            dtCurr = dtSel;
-            singleWeek = true;
-        }
-
-        private async Task resetCal()
-        {
-            singleWeek = false;
-            await Task.Delay(1);
-        }
-
-        #endregion Private Methods
-    }
-}

EgwCoreLib.BlazorTest/Pages/ProvaCalendar.razor.css

@@ -1,43 +0,0 @@
-.containerCalendario {
-  margin-top: 20px;
-  position: relative;
-  min-width: 20rem;
-  align-items: center;
-  display: flex;
-  justify-content: center;
-}
-.containerGauge {
-  position: fixed;
-  bottom: 5rem;
-  width: 100%;
-  align-items: center;
-  right: 5.2rem;
-  display: flex;
-  justify-content: center;
-  gap: 8.3rem;
-}
-.containerCard {
-  position: relative;
-  width: 100%;
-  align-items: center;
-  display: flex;
-  justify-content: center;
-  flex-direction: row;
-}
-.containerBtnEntrEsc {
-  margin-top: 20px;
-  position: relative;
-  width: 95%;
-  height: 2.5rem;
-  display: flex;
-  justify-content: center;
-}
-.containerBtnTemp {
-  position: fixed;
-  height: 39px;
-  width: 59px;
-  bottom: 4rem;
-  align-items: center;
-  display: flex;
-  justify-content: center;
-}

EgwCoreLib.BlazorTest/Pages/ProvaCalendar.razor.less

@@ -1,49 +0,0 @@
-.containerCalendario {
-    margin-top: 20px;
-    position: relative;
-    min-width: 20rem;
-    align-items: center;
-    display: flex;
-    justify-content: center;
-}
-
-.containerGauge {
-    position: fixed;
-    bottom: 5rem;
-    width: 100%;
-    align-items: center;
-    right: 5.2rem;
-    display: flex;
-    justify-content: center;
-    gap: 8.3rem;
-}
-
-.containerCard {
-    position: relative;
-    width: 100%;
-    align-items: center;
-    display: flex;
-    justify-content: center;
-    flex-direction: row;
-}
-
-.containerBtnEntrEsc {
-    margin-top: 20px;
-    position: relative;
-    width: 95%;
-    height: 2.5rem;
-    display: flex;
-    justify-content: center;
-}
-
-.containerBtnTemp {
-    position: fixed;
-    height: 39px;
-    width: 59px;
-    bottom: 4rem;
-    align-items: center;
-    display: flex;
-    justify-content: center;
-}
-
-

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

@@ -1 +0,0 @@
-.containerCalendario{margin-top:20px;position:relative;min-width:20rem;align-items:center;display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;flex-direction:row;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:95%;height:2.5rem;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:39px;width:59px;bottom:4rem;align-items:center;display:flex;justify-content:center;}

EgwCoreLib.BlazorTest/Pages/Test.razor

@@ -1,161 +0,0 @@
-@page "/Test"
-
-<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/TestBarcodeReader.razor

@@ -0,0 +1,65 @@
+@page "/TestBarcodeReader"
+
+<PageTitle>Test Barcode Reader</PageTitle>
+
+<div class="card my-2">
+    <div class="card-header"><h4>Test Barcode Reader</h4></div>
+    <div class="card-body">
+        @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 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 shadow-lg image-mirror" muted="true"></video>
+                    </div>
+                </div>
+            </div>
+        }
+        else
+        {
+            <button class="btn btn-outline-success p-2 m-1 w-25" @onclick="() => ToggleCodeScan()">Open</button>
+        }
+    </div>
+</div>
+
+@code {
+
+    protected BarcodeReader barcodeReaderCustom { get; set; } = null!;
+    protected Random rnd = new Random();
+    protected async Task ScanDoneHandler(string value)
+    {
+        await Task.Delay(1);
+    }
+
+    protected override void OnInitialized()
+    {
+        base.OnInitialized();
+    }
+
+    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/TestCal.razor

@@ -1,42 +0,0 @@
-@page "/TestCal"
-
-
-<h3>TestCal</h3>
-
-<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>
-
-

EgwCoreLib.BlazorTest/Pages/TestCal.razor.cs

@@ -1,60 +0,0 @@
-namespace EgwCoreLib.BlazorTest.Pages
-{
-    public partial class TestCal
-    {
-        #region Protected Methods
-
-        protected override async Task OnInitializedAsync()
-        {
-            dtCurr = DateTime.Today;
-            await Task.Delay(1);
-            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");
-                }
-                else
-                {
-                    DateCheck[newDate] = "bg-warning text-light rounded-circle p-2";
-                }
-            }
-        }
-
-        #endregion Protected Methods
-
-        #region Private Fields
-
-        private Dictionary<DateTime, string> DateCheck = new Dictionary<DateTime, string>();
-
-        #endregion Private Fields
-
-        #region Private Properties
-
-        private DateTime dtCurr { get; set; } = DateTime.Today;
-
-        private bool singleWeek = false;
-
-        #endregion Private Properties
-
-        #region Private Methods
-
-        private void DisplayDate(DateTime dtSel)
-        {
-            dtCurr = dtSel;
-            singleWeek= true;
-        }
-
-        private async Task resetCal()
-        {
-            singleWeek = false;
-            await Task.Delay(1);
-        }
-
-        #endregion Private Methods
-    }
-}

EgwCoreLib.BlazorTest/Pages/TestCalendario.razor

@@ -0,0 +1,54 @@
+@page "/TestCalendario"
+
+<PageTitle>TestGauges</PageTitle>
+
+<div class="card shadow">
+    <div class="card-header">
+        <h3>Test Calendario + Gauges</h3>
+    </div>
+    <div class="card-body py-0">
+
+        <div class="row bg-dark py-3">
+            <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>
+</div>
+
+

EgwCoreLib.BlazorTest/Pages/TestCalendario.razor.cs

@@ -0,0 +1,127 @@
+using EgwCoreLib.Razor.Data;
+
+namespace EgwCoreLib.BlazorTest.Pages
+{
+    public partial class TestCalendario
+    {
+        #region Protected Methods
+
+        protected override async Task OnInitializedAsync()
+        {
+            dtCurr = DateTime.Today;
+            await Task.Delay(1);
+            setupMonthSim();
+
+            // preparo calendario settimanale...
+            setupWeekSim();
+        }
+
+        private void setupMonthSim()
+        {
+            DateCheck = new Dictionary<DateTime, string>();
+            // 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-danger text-light rounded-circle p-2");
+                }
+                else
+                {
+                    DateCheck[newDate] = "bg-warning text-light rounded-circle p-2";
+                }
+            }
+        }
+
+        /// <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
+
+        private Dictionary<DateTime, string> DateCheck = new Dictionary<DateTime, string>();
+
+        #endregion Private Fields
+
+        #region Private Properties
+
+        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
+
+        #region Private Methods
+
+        private void DisplayDate(DateTime dtSel)
+        {
+            dtCurr = dtSel;
+            singleWeek = true;
+        }
+
+        private async Task resetCal()
+        {
+            singleWeek = false;
+            await Task.Delay(1);
+        }
+
+        #endregion Private Methods
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestCerchi.razor

@@ -0,0 +1,75 @@
+@page "/TestSvgDraw"
+
+<PageTitle>TestSvgDraw</PageTitle>
+
+
+<div class="card">
+    <div class="card-header">
+            <h3>Test SVG</h3>
+    </div>
+    <div class="card-body py-1">
+        <div class="row py-4" style="background-color: #ACDDAC;">
+            <div class="col-4">
+                <svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+                    <defs>
+                        <radialGradient id="RadialGrad2">
+                            <stop offset="0%" stop-color="#000000" />
+                            <stop offset="80%" stop-color="#151515" />
+                            <stop offset="90%" stop-color="#444444" />
+                            <stop offset="100%" stop-color="#878787" />
+                        </radialGradient>
+                    </defs>
+                    <rect width="100" height="100" rx="50" fill="url(#RadialGrad2)" fill-opacity="0.5">
+                    </rect>
+                    <text id="TitleElem" x="10%" y="50%" class="text-light" style="font-size:2rem;">Titolo</text>
+                    <g>
+                        <rect x="10%" y="10%" width="80%" height="80%" fill="white" fill-opacity="0.1">
+                        </rect>
+                        <text x="10%" y="70%" class="text-light" style="font-size:0.8rem;">
+                            testo più lungo... 0123456789
+                            <animate attributeName="x"
+                                     values="10%;10%;-10%;-80%;-100%;-100%;10%"
+                                     dur="6s"
+                                     begin="2s"
+                                     repeatCount="indefinite" />
+                        </text>
+                    </g>
+                </svg>
+            </div>
+            <div class="col-4 text-center">
+                <ul class="list-group">
+                    <li class="list-group-item active">
+                        <b>SVG Draw</b>
+                    </li>
+                    <li class="list-group-item">
+                        Test disegno diretto component SVG + html/css
+                    </li>
+                    <li class="list-group-item">
+                        Disegno elemento circolare + gradiente (simil-button)
+                        <div class="fs-3">&rarr;</div>
+                    </li>
+                    <li class="list-group-item">
+                        Testo che scorre entro un box
+                        <div class="fs-3">&larr;</div>
+                    </li>
+
+                </ul>
+            </div>
+            <div class="col-4">
+                <svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
+                    <defs>
+                        <radialGradient id="RadialGrad2">
+                            <stop offset="0%" stop-color="#000000" />
+                            <stop offset="80%" stop-color="#151515" />
+                            <stop offset="90%" stop-color="#444444" />
+                            <stop offset="100%" stop-color="#878787" />
+                        </radialGradient>
+                    </defs>
+                    <rect width="10" height="10" rx="5" fill="url(#RadialGrad2)" fill-opacity="0.5">
+                    </rect>
+                </svg>
+            </div>
+
+        </div>
+    </div>
+</div>

EgwCoreLib.BlazorTest/Pages/TestCerchi.razor.cs

@@ -0,0 +1,37 @@
+using EgwCoreLib.Razor;
+
+namespace EgwCoreLib.BlazorTest.Pages
+{
+    public partial class TestCerchi
+    {
+        protected List<CircleGaugeMulti.CircSegm> DDemo1 = new List<CircleGaugeMulti.CircSegm>();
+        protected List<CircleGaugeMulti.CircSegm> DDemoIn2 = new List<CircleGaugeMulti.CircSegm>();
+        protected List<CircleGaugeMulti.CircSegm> DDemoOut2 = new List<CircleGaugeMulti.CircSegm>();
+
+        protected int currVal1 = 1000;
+        protected int currVal2 = 1000;
+        protected int maxVal = 1000;
+
+        protected decimal valDecimale = 12345;
+
+        protected override void OnInitialized()
+        {
+            DDemo1.Clear();
+            currVal1 = 800;
+            DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 800 });
+            DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 300 });
+            Random rnd = new Random();
+            DDemoIn2.Clear();
+            DDemoOut2.Clear();
+            currVal2 = 1300;
+            DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 1000 });
+            DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 600 });
+            DDemoOut2.Add(new CircleGaugeMulti.CircSegm() { Color = "#1367FD", Value = 300 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = 700 });
+            // currVal = rnd.Next(maxVal - 200, maxVal + 500);
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = currVal / 4 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#ACFD15", Value = currVal / 4 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = currVal / 2 });
+        }
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestChart.razor

@@ -0,0 +1,66 @@
+@page "/TestChart"
+@using EgwCoreLib.Razor.Data;
+@using EgwCoreLib.Utils;
+
+<PageTitle>Test</PageTitle>
+
+<div class="card">
+    <div class="card-header d-flex justify-content-between">
+        <div class="px-0">
+            <h3>Test Grafici Chart.js</h3>
+        </div>
+        <div class="px-0">
+            <Toggler SelFilter="CurrFilt" FilterChanged="SetTipo"></Toggler>
+        </div>
+    </div>
+    <div class="card-body py-1">
+        @if (showMulti)
+        {
+            <div class="row" style="height: 400px;">
+                <div class="col-6">
+                    <ChartHist Id="01" Data="@histData(1)" Labels="@histLabel(1)" LineColor="rgb(7, 173, 236)" BackColor="rgba(107, 223, 255, 0.5)" ChartLabel="Ore 01"></ChartHist>
+                </div>
+                <div class="col-6">
+                    <ChartMultiLine DataSets="currDS" ChartLabels="ChLabels"></ChartMultiLine>
+                </div>
+            </div>
+        }
+        else
+        {
+            <div class="row" style="height: 400px;">
+                <div class="col-6">
+                    @if (periodo != null)
+                    {
+                        <div>
+                            Periodo Selezionato: <b>@($"{periodo.Inizio:yyyy/MM/dd}") &rarr; @($"{periodo.Fine:yyyy/MM/dd}")</b>
+                        </div>
+                    }
+                </div>
+                <div class="col-6">
+                    <PeriodoSel E_PeriodoSel="setPeriodo" CurrPeriodo="@periodo"></PeriodoSel>
+                </div>
+                <div class="col-4">
+                    <ChartHist Id="01" Data="@histData(1)" Labels="@histLabel(1)" LineColor="rgb(7, 173, 236)" BackColor="rgba(107, 223, 255, 0.5)" ChartLabel="Ore 01"></ChartHist>
+                </div>
+                <div class="col-2 text-center">
+                    <div>
+                        <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" BordWidth="3"></Doughnut>
+                    </div>
+                    <small>display con animazione</small>
+                </div>
+                <div class="col-4">
+                    <ChartHist Id="02" Data="@histData(2)" Labels="@histLabel(2)" LineColor="rgb(173, 7, 236)" BackColor="rgba(223,107,  255, 0.5)" ChartLabel="Ore 02"></ChartHist>
+                </div>
+            </div>
+        }
+    </div>
+</div>
+
+
+

EgwCoreLib.BlazorTest/Pages/TestChart.razor.cs

@@ -1,40 +1,135 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
-using Microsoft.AspNetCore.Components;
-using System.Net.Http;
-using Microsoft.AspNetCore.Authorization;
-using Microsoft.AspNetCore.Components.Authorization;
-using Microsoft.AspNetCore.Components.Forms;
-using Microsoft.AspNetCore.Components.Routing;
-using Microsoft.AspNetCore.Components.Web;
-using Microsoft.AspNetCore.Components.Web.Virtualization;
-using Microsoft.JSInterop;
-using EgwCoreLib.BlazorTest;
-using EgwCoreLib.BlazorTest.Components;
-using EgwCoreLib.BlazorTest.Shared;
 using EgwCoreLib.Razor;
 using EgwCoreLib.Razor.Data;
+using EgwCoreLib.Utils;
 using static EgwCoreLib.Razor.Data.chartJsData;
+using static EgwCoreLib.Razor.Toggler;
 
 namespace EgwCoreLib.BlazorTest.Pages
 {
-    public partial class TestMultiLine
+    public partial class TestChart
     {
+        #region Public Fields
+
+        public List<DoughnutStyling> colors = new List<DoughnutStyling>();
+        public List<double> Data = new List<double>();
+        public List<string> Labels = new List<string>();
+
+        #endregion Public Fields
+
+        #region Protected Fields
+
+        protected Random rnd = new Random();
+
+        #endregion Protected Fields
+
+        #region Protected Properties
+
+        protected List<string>? ChLabels { get; set; } = null;
+        protected List<chartJsData.chartJsDataSetXY>? currDS { get; set; } = null;
+        protected DtUtils.Periodo? periodo { get; set; } = new DtUtils.Periodo(DtUtils.PeriodSet.ThisTrim);
+
+        #endregion Protected Properties
+
+        #region Protected Methods
+
+        protected string[] histData(int num)
+        {
+            List<string> answ = new List<string>();
+            for (int i = 0; i < 50; i++)
+            {
+                answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
+            }
+            return answ.ToArray();
+        }
+
+        protected string[] histLabel(int num)
+        {
+            List<string> answ = new List<string>();
+            for (int i = 0; i < 50; i++)
+            {
+                answ.Add($"LBL_{i:00}");
+            }
+            return answ.ToArray();
+        }
 
         protected override async Task OnInitializedAsync()
         {
+            CurrFilt = new Toggler.SelectGlobalToggle()
+            {
+                leftString = "Multi-linea",
+                rightString = "Singolo",
+                isActive = true,
+                toolTip = "Tipo di grafico"
+            };
             currDS = null;
             await Task.Delay(200);
             await setupData();
         }
 
-        protected List<chartJsData.chartJsDataSetXY>? currDS { get; set; } = null;
+        protected override async Task OnParametersSetAsync()
+        {
+            await ReloadData();
+            await Task.Delay(1);
+        }
 
-        protected List<string>? ChLabels { get; set; } = null;
+        protected async Task ReloadData()
+        {
+            await Task.Delay(1);
+        }
 
-        protected Random rnd = new Random();
+        protected async Task setPeriodo(DtUtils.Periodo newPeriodo)
+        {
+            await Task.Delay(1);
+            periodo = newPeriodo;
+        }
+
+        protected void SetTipo(SelectGlobalToggle selFilt)
+        {
+            if (selFilt != null)
+            {
+                showMulti = !selFilt.isActive;
+            }
+        }
+
+        protected double[] SimData()
+        {
+            List<double> answ = new List<double>();
+            double currColor = 0;
+            for (int i = 0; i < 10; i++)
+            {
+                currColor = (double)(rnd.Next(10, 100)) / 10;
+                answ.Add(currColor);
+                if (currColor > 7)
+                {
+                    colors.Add(new DoughnutStyling("#28FF69", "#00AA00"));
+                }
+                else if (currColor > 3)
+                {
+                    colors.Add(new DoughnutStyling("orange", "#99AA00"));
+                }
+                else
+                {
+                    colors.Add(new DoughnutStyling("red", "#FF6969"));
+                }
+            }
+            return answ.ToArray();
+        }
+
+        #endregion Protected Methods
+
+        #region Private Fields
+
+        private bool showMulti = false;
+
+        #endregion Private Fields
+
+        #region Private Properties
+
+        private Toggler.SelectGlobalToggle CurrFilt { get; set; } = new Toggler.SelectGlobalToggle();
+
+        #endregion Private Properties
+
+        #region Private Methods
 
         private async Task setupData()
         {
@@ -75,23 +170,6 @@ namespace EgwCoreLib.BlazorTest.Pages
             await Task.Delay(10);
         }
 
-        protected string[] histLabel(int num)
-        {
-            List<string> answ = new List<string>();
-            for (int i = 0; i < 50; i++)
-            {
-                answ.Add($"LBL_{i:00}");
-            }
-            return answ.ToArray();
-        }
-        protected string[] histData(int num)
-        {
-            List<string> answ = new List<string>();
-            for (int i = 0; i < 50; i++)
-            {
-                answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
-            }
-            return answ.ToArray();
-        }
+        #endregion Private Methods
     }
 }

EgwCoreLib.BlazorTest/Pages/TestCompo.razor

@@ -1,115 +0,0 @@
-@page "/TestCompo"
-@using EgwCoreLib.Razor.Data;
-@using EgwCoreLib.Utils;
-
-<PageTitle>Test</PageTitle>
-
-<h3>TestCompo</h3>
-
-<div class="row">
-    <div class="col-6">
-        @if (periodo != null)
-        {
-            <div>
-                Periodo Selezionato: <b>@($"{periodo.Inizio:yyyy/MM/dd}") &rarr; @($"{periodo.Fine:yyyy/MM/dd}")</b>
-            </div>
-        }
-    </div>
-    <div class="col-6">
-        <PeriodoSel E_PeriodoSel="setPeriodo" CurrPeriodo="@periodo"></PeriodoSel>
-    </div>
-</div>
-
-<div class="row" style="max-height: 30rem;">
-    <div class="col-2">
-        <Doughnut Id="00" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
-    </div>
-    <div class="col-4">
-        <ChartHist Id="01" Data="@histData(1)" Labels="@histLabel(1)" LineColor="rgb(7, 173, 236)" BackColor="rgba(107, 223, 255, 0.5)" ChartLabel="Ore 01"></ChartHist>
-    </div>
-    <div class="col-4">
-        <ChartHist Id="02" Data="@histData(2)" Labels="@histLabel(2)" LineColor="rgb(173, 7, 236)" BackColor="rgba(223,107,  255, 0.5)" ChartLabel="Ore 02"></ChartHist>
-    </div>
-    <div class="col-2">
-        <Doughnut Id="03" Type="@Doughnut.ChartType.Doughnut" Data="@SimData()" BackgroundColor="@colors"></Doughnut>
-    </div>
-</div>
-
-@code {
-
-    protected DtUtils.Periodo? periodo { get; set; } = new DtUtils.Periodo(DtUtils.PeriodSet.ThisTrim);
-
-    protected async Task setPeriodo(DtUtils.Periodo newPeriodo)
-    {
-        await Task.Delay(1);
-        periodo = newPeriodo;
-    }
-
-    public List<DoughnutStyling> colors = new List<DoughnutStyling>();
-
-    public List<double> Data = new List<double>();
-
-    public List<string> Labels = new List<string>();
-
-    protected override async Task OnInitializedAsync()
-    {
-        await Task.Delay(1);
-    }
-
-    protected override async Task OnParametersSetAsync()
-    {
-        await ReloadData();
-        await Task.Delay(1);
-    }
-
-    protected double[] SimData()
-    {
-        List<double> answ = new List<double>();
-        double currColor = 0;
-        for (int i = 0; i < 10; i++)
-        {
-            currColor = (double)(rnd.Next(10, 100)) / 10;
-            answ.Add(currColor);
-            if(currColor>7)
-            {
-                colors.Add(new DoughnutStyling("#28FF69", "ccc"));
-            }
-            else if (currColor > 3)
-            {
-                colors.Add(new DoughnutStyling("orange", "ccc"));
-            }
-            else
-            {
-                colors.Add(new DoughnutStyling("red", "ccc"));
-            }
-        }
-        return answ.ToArray();
-    }
-
-    protected async Task ReloadData()
-    {
-        await Task.Delay(1);
-    }
-
-    protected Random rnd = new Random();
-
-    protected string[] histLabel(int num)
-    {
-        List<string> answ = new List<string>();
-        for (int i = 0; i < 50; i++)
-        {
-            answ.Add($"LBL_{i:00}");
-        }
-        return answ.ToArray();
-    }
-    protected string[] histData(int num)
-    {
-        List<string> answ = new List<string>();
-        for (int i = 0; i < 50; i++)
-        {
-            answ.Add($"{(double)(rnd.Next(10, 100)) / 10 + i}");
-        }
-        return answ.ToArray();
-    }
-
-}

EgwCoreLib.BlazorTest/Pages/TestComponenti.razor

@@ -0,0 +1,308 @@
+@page "/TestComponenti"
+@using static EgwCoreLib.Razor.Sorter
+
+@inject NavigationManager NavMan
+@implements IDisposable
+
+<PageTitle>Test</PageTitle>
+
+<div class="card shadow">
+    <div class="card-header">
+        <h1>Test Componenti custom</h1>
+    </div>
+    <div class="card-body py-4">
+        <div class="row">
+            <div class="col-3">
+                <div class="card shadow">
+                    <div class="card-header">
+                        Test Image
+                    </div>
+                    <div class="card-body py-1">
+                        <img src="_content/EgwCoreLib.Razor/images/LogoEgw.png" class="img-fluid" width="200" height="200" />
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card shadow">
+                    <div class="card-header">
+                        Input password
+                    </div>
+                    <div class="card-body py-1">
+                        <ul class="list-group">
+                            <li class="list-group-item">
+                                Standard
+                                <PasswordBox></PasswordBox>
+                            </li>
+                            <li class="list-group-item">
+                                Cambio label
+                                <PasswordBox ItemLabel="pwd"></PasswordBox>
+                            </li>
+                            <li class="list-group-item">
+                                Show disabilitato
+                                <PasswordBox DisableShow="true"></PasswordBox>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <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>
+                        <div>
+                            <b>@valDecimale</b>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-3">
+                <div class="card shadow">
+                    <div class="card-header">
+                        QueryString
+                    </div>
+                    <div class="card-body py-1">
+
+
+                        Test valori QueryString
+                        <ul class="list-group">
+                            <li class="list-group-item d-flex justify-content-between">
+                                QString <b>Nome</b>:
+                                <span class="badge bg-primary rounded-pill">
+                                    @if (!string.IsNullOrEmpty(qsNome))
+                                    {
+                                        @qsNome
+                                    }
+                                    else
+                                    {
+                                        <span>-</span>
+                                    }
+                                </span>
+                            </li>
+                            <li class="list-group-item d-flex justify-content-between">
+                                QString <b>Intero</b>:
+                                <span class="badge bg-primary rounded-pill">
+                                    @if (qsIntero > 0)
+                                    {
+                                        @qsIntero
+                                    }
+                                    else
+                                    {
+                                        <span>-</span>
+                                    }
+                                </span>
+                            </li>
+                            <li class="list-group-item">
+                                <NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="TestComponenti">
+                                    <i class="fa-solid fa-wrench" aria-hidden="true"></i>
+                                    <small>Reload Vuoto</small>
+                                </NavLink>
+                            </li>
+                            <li class="list-group-item">
+                                <NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Nome=Test_{DateTime.Now:mm}")">
+                                    <i class="fa-solid fa-wrench" aria-hidden="true"></i>
+                                    <small>Reload Nome</small>
+                                </NavLink>
+                            </li>
+                            <li class="list-group-item">
+                                <NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Intero={DateTime.Now:ss}")">
+                                    <i class="fa-solid fa-wrench" aria-hidden="true"></i>
+                                    <small>Reload Intero</small>
+                                </NavLink>
+                            </li>
+                            <li class="list-group-item">
+                                <NavLink type="button" class="btn btn-primary bg-gradient text-light w-100" href="@($"TestComponenti?Nome=Test_{DateTime.Now:mm}&Intero={DateTime.Now:ss}")">
+                                    <i class="fa-solid fa-wrench" aria-hidden="true"></i>
+                                    <small>Reload All</small>
+                                </NavLink>
+                            </li>
+                        </ul>
+                    </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>
+    </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()
+    {
+        // base.OnInitialized();
+        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}"
+            });
+        }
+    }
+    async void LocationChanged(object sender, LocationChangedEventArgs e)
+    {
+        qsNome = NavMan.ExtractQueryStringByKey<string>("Nome");
+        qsIntero = NavMan.ExtractQueryStringByKey<int>("Intero");
+        StateHasChanged();
+    }
+
+    void IDisposable.Dispose()
+    {
+        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,72 @@
+@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>
+
+        <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 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 BootstrapModal.ModalMode cMode = BootstrapModal.ModalMode.ND;
+
+
+    private async Task ShowMessage()
+    {
+        cTitle = "Information";
+        cMessage = "This is a standard message.";
+        cMode = BootstrapModal.ModalMode.Message;
+        cOpt = 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");
+        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;
+        cBigBtn = false;
+
+        string? name = await modal!.ShowAsync<string?>();
+        resultMessage = name is null ? "User cancelled." : $"Hello, {name}!";
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestGauges.razor

@@ -0,0 +1,54 @@
+@page "/TestGauges"
+
+<PageTitle>TestGauges</PageTitle>
+
+<div class="card shadow">
+    <div class="card-header">
+        <h3>Test componente Gauges</h3>
+    </div>
+    <div class="card-body py-1">
+        <div class="row py-4" style="background-color: #ACDDAC;">
+            <div class="col-1 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+            <div class="col-2 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+            <div class="col-3 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+            <div class="col-3 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+            <div class="col-2 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal1}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemo1" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+            <div class="col-1 bg-dark">
+                <CircleGaugeMulti Titolo="@($"{currVal2}")" Testo="#pz prod" maxVal="@maxVal" ListInner="@DDemoIn2" ListOuter="@DDemoOut2" ShowCircleBtn="true"></CircleGaugeMulti>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-12 containerCalendario">
+                <small>Blocco calendario (sottostante) gestito da css sticky sul fondo</small>
+                <div class="calendario">
+                    <div class="d-flex justify-content-between">
+                        <div>
+                            <CircleGauge Titolo="9:00" Testo="Caricate" maxVal="480" currVal="540" StrokeColorVal="#F1C40F" ShowCircleBtn="true"></CircleGauge>
+                        </div>
+                        <div>
+                            <CircleGauge Titolo="4:00" Testo="Lavorate" maxVal="480" currVal="240" StrokeColorVal="#00FF00" ShowCircleBtn="true"></CircleGauge>
+                        </div>
+                        <div>
+                            <CircleGauge Titolo="12:00" Testo="Caricate" maxVal="480" currVal="720" StrokeColorVal="#F1C40F" StrokeColorValOuter="#01C4FF" ShowCircleBtn="true"></CircleGauge>
+                        </div>
+                    </div>
+                    <div class="containerBtnTemp">
+                        <button class="btn btn-sm btn-warning">
+                            TEMP
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

EgwCoreLib.BlazorTest/Pages/TestGauges.razor.cs

@@ -0,0 +1,37 @@
+using EgwCoreLib.Razor;
+
+namespace EgwCoreLib.BlazorTest.Pages
+{
+    public partial class TestGauges
+    {
+        protected List<CircleGaugeMulti.CircSegm> DDemo1 = new List<CircleGaugeMulti.CircSegm>();
+        protected List<CircleGaugeMulti.CircSegm> DDemoIn2 = new List<CircleGaugeMulti.CircSegm>();
+        protected List<CircleGaugeMulti.CircSegm> DDemoOut2 = new List<CircleGaugeMulti.CircSegm>();
+
+        protected int currVal1 = 1000;
+        protected int currVal2 = 1000;
+        protected int maxVal = 1000;
+
+        protected decimal valDecimale = 12345;
+
+        protected override void OnInitialized()
+        {
+            DDemo1.Clear();
+            currVal1 = 800;
+            DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 800 });
+            DDemo1.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 300 });
+            Random rnd = new Random();
+            DDemoIn2.Clear();
+            DDemoOut2.Clear();
+            currVal2 = 1300;
+            DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#DCFD15", Value = 1000 });
+            DDemoIn2.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = 600 });
+            DDemoOut2.Add(new CircleGaugeMulti.CircSegm() { Color = "#1367FD", Value = 300 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = 700 });
+            // currVal = rnd.Next(maxVal - 200, maxVal + 500);
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#13FD67", Value = currVal / 4 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#ACFD15", Value = currVal / 4 });
+            // DataDemo.Add(new CircleGaugeMulti.CircSegm() { Color = "#1515FD", Value = currVal / 2 });
+        }
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestGauges.razor.css

@@ -4,7 +4,7 @@
   height: 18.75rem;
   position: fixed;
   bottom: 3.5rem;
-  width: 95%;
+  width: 70%;
   display: flex;
   justify-content: center;
   border-radius: 12px 12px 12px 12px;
@@ -39,9 +39,9 @@
 }
 .containerBtnTemp {
   position: fixed;
-  height: 39px;
-  width: 59px;
-  bottom: 4rem;
+  height: 3rem;
+  width: 6rem;
+  bottom: 2rem;
   align-items: center;
   display: flex;
   justify-content: center;

EgwCoreLib.BlazorTest/Pages/TestGauges.razor.less

@@ -4,7 +4,7 @@
     height: 18.75rem;
     position: fixed;
     bottom: 3.5rem;
-    width: 95%;
+    width: 70%;
     display: flex;
     justify-content: center;
     border-radius: 12px 12px 12px 12px
@@ -44,9 +44,9 @@
 
 .containerBtnTemp {
     position: fixed;
-    height: 39px;
-    width: 59px;
-    bottom: 4rem;
+    height: 3rem;
+    width: 6rem;
+    bottom: 2rem;
     align-items: center;
     display: flex;
     justify-content: center;

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

@@ -1 +1 @@
-.calendario{background-color:#34495e;border:2px solid #000;height:18.75rem;position:fixed;bottom:3.5rem;width:95%;display:flex;justify-content:center;border-radius:12px 12px 12px 12px;}.containerCalendario{display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:100%;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:39px;width:59px;bottom:4rem;align-items:center;display:flex;justify-content:center;}
+.calendario{background-color:#34495e;border:2px solid #000;height:18.75rem;position:fixed;bottom:3.5rem;width:70%;display:flex;justify-content:center;border-radius:12px 12px 12px 12px;}.containerCalendario{display:flex;justify-content:center;}.containerGauge{position:fixed;bottom:5rem;width:100%;align-items:center;right:5.2rem;display:flex;justify-content:center;gap:8.3rem;}.containerCard{position:relative;width:100%;align-items:center;display:flex;justify-content:center;}.containerBtnEntrEsc{margin-top:20px;position:relative;width:100%;display:flex;justify-content:center;}.containerBtnTemp{position:fixed;height:3rem;width:6rem;bottom:2rem;align-items:center;display:flex;justify-content:center;}

EgwCoreLib.BlazorTest/Pages/TestGraphCompo.razor

@@ -0,0 +1,55 @@
+@page "/TestGraphCompo"
+
+<PageTitle>Test</PageTitle>
+
+<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">
+                <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>
+</div>
+
+@code {
+
+    private int currentCount = 0;
+
+    protected Random rnd = new Random();
+
+    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();
+
+}

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/TestLoading.razor

@@ -1,14 +1,36 @@
 @page "/TestLoading"
 
-<h3>TestLoading</h3>
-<div>
-    <label class="form-label">Tempo sim</label>
-    <input css="form-control" @bind="@expTime" type="number" />
-</div>
-<div>
-    <label class="form-label">Num steps</label>
-    <input css="form-control" @bind="@numSteps" type="number" />
-</div>
-<button class="btn btn-success" @onclick="StartLongTimer">Start</button>
 
-<ProgressDisplay RefreshInterval="100" Title="@titleMsg" MaxVal="@maxVal" CurrVal="@currVal" NextVal="@nextVal" ExpTimeMSec="@expTimeMSec" DisplaySize="ProgressDisplay.ModalSize.Medium" ModalCss="card alert-primary" SlowLimit="0.4"></ProgressDisplay>
+<div class="row">
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
+    </div>
+</div>
+<div class="row">
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
+    </div>
+</div>
+<div class="row">
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
+    </div>
+    <div class="col-4">
+        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
+    </div>
+</div>

EgwCoreLib.BlazorTest/Pages/TestMultiLine.razor

@@ -1,53 +0,0 @@
-@page "/TestMultiLine"
-
-@if (currDS == null)
-{
-    <LoadingData></LoadingData>
-}
-else
-{
-    <h3>TestMultiLine</h3>
-    <div class="row" style="height: 500px;">
-        <div class="col-6">
-            <ChartHist Id="01" Data="@histData(1)" Labels="@histLabel(1)" LineColor="rgb(7, 173, 236)" BackColor="rgba(107, 223, 255, 0.5)" ChartLabel="Ore 01"></ChartHist>
-        </div>
-        <div class="col-6">
-            <ChartMultiLine DataSets="currDS" ChartLabels="ChLabels"></ChartMultiLine>
-        </div>
-    </div>
-}
-
-<hr />
-<div class="row">
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Small" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
-    </div>
-</div>
-<div class="row">
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Normal" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
-    </div>
-</div>
-<div class="row">
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Normal"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.Growl"></LoadingData>
-    </div>
-    <div class="col-4">
-        <LoadingData DisplaySize="LoadingData.CtrlSize.Large" DisplayMode="LoadingData.SpinMode.BounceLine"></LoadingData>
-    </div>
-</div>

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/TestPdfViewer.razor

@@ -0,0 +1,27 @@
+@page "/TestPdfViewer"
+
+<div class="card">
+    <div class="card-header">
+        <div class="d-flex justify-content-between">
+            <div class="px-0">
+                <h3>Test pdf display</h3>
+            </div>
+            <div class="px-0">
+                <div class="input-group w-100">
+                    <span class="input-group-text">File</span>
+                    <select class="form-select" @bind="@FileSel">
+                        <option value="File01.pdf">File 01</option>
+                        <option value="File02.pdf">File 02</option>
+                        <option value="File03.pdf">File 03</option>
+                        <option value="File04.pdf">File 04</option>
+                        <option value="File05.pdf">File 05</option>
+                    </select>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="card-body py-1">
+        <PdfDisplay Width="100%" PdfUrl="@($"test/{FileSel}")" HeightList="@heightList"></PdfDisplay>
+        <p class="card-text">Selezione: <b>@FileSel</b></p>
+    </div>
+</div>

EgwCoreLib.BlazorTest/Pages/TestPdfViewer.razor.cs

@@ -0,0 +1,121 @@
+#if false
+using CA.Blazor.Pdf;
+using CA.Blazor.Pdf.Extensions;
+#endif
+
+using Microsoft.AspNetCore.Components;
+using System.Net.Http.Headers;
+
+namespace EgwCoreLib.BlazorTest.Pages
+{
+    public partial class TestPdfViewer
+    {
+        #region Public Fields
+
+        public int CompoSel = 1;
+
+        #endregion Public Fields
+
+        #region Public Properties
+
+        public string PdfBase64 { get; set; } = "";
+
+        #endregion Public Properties
+
+        #region Protected Properties
+
+        protected string FileSel
+        {
+            get => fileSel;
+            set
+            {
+                if (fileSel != value)
+                {
+                    fileSel = value;
+                    ReloadData().ConfigureAwait(false);
+                    StateHasChanged();
+                }
+            }
+        }
+
+        protected string HeightSel
+        {
+            get => heightSel;
+            set
+            {
+                if (heightSel != value)
+                {
+                    heightSel = value;
+                    StateHasChanged();
+                }
+            }
+        }
+
+        [Inject]
+        protected NavigationManager NavMan { get; set; } = null!;
+
+        #endregion Protected Properties
+
+        #region Protected Methods
+
+        protected override async Task OnInitializedAsync()
+        {
+            await ReloadData();
+            await Task.Delay(1);
+        }
+
+        #endregion Protected Methods
+
+        #region Private Properties
+
+        private string fileSel { get; set; } = "File01.pdf";
+        private string heightSel { get; set; } = "400px";
+
+        private string baseUri = "";
+        private string fileUrl = "";
+
+        private Dictionary<string, string> heightList { get; set; } = new Dictionary<string, string>() { { "200", "200px" }, { "400", "400px" }, { "600", "600px" }, { "800", "800px" }, { "1000", "1000px" } };
+
+        #endregion Private Properties
+
+        #region Private Methods
+
+        private async Task<string> GetBase64Pdf(string apiUrl)
+        {
+            using (var httpClient = new HttpClient())
+            {
+                httpClient.BaseAddress = new Uri(NavMan.BaseUri);
+
+                // Make the API request to get the PDF content
+                var response = await httpClient.GetAsync(apiUrl);
+
+                if (response.IsSuccessStatusCode)
+                {
+                    // Convert the response content to Base64
+                    var pdfBytes = await response.Content.ReadAsByteArrayAsync();
+                    var base64String = Convert.ToBase64String(pdfBytes);
+                    return $"data:application/pdf;base64,{base64String}";
+                }
+                else
+                {
+                    // Handle error scenarios based on your application needs For simplicity, we
+                    // return an empty string in case of an error
+                    return string.Empty;
+                }
+            }
+        }
+
+        private async Task ReloadData()
+        {
+            baseUri = NavMan.BaseUri;
+            fileUrl = $"{baseUri}/test/{FileSel}";
+
+#if false
+            // Call the helper method to retrieve the Base64-encoded PDF content
+            PdfBase64 = await GetBase64Pdf(apiUrl); 
+#endif
+        }
+
+        #endregion Private Methods
+    }
+}

EgwCoreLib.BlazorTest/Pages/TestProgress.razor

@@ -0,0 +1,78 @@
+@page "/TestProgress"
+
+
+<div class="card">
+    <div class="card-header">
+        <h3>Test Modale Loading</h3>
+    </div>
+    <div class="card-body py-1">
+        <div class="row">
+            <div class="col-4">
+                <div class="input-group w-100 mb-1">
+                    <span class="input-group-text">Tempo sim</span>
+                    <input class="form-control" @bind="@expTime" type="number" />
+                </div>
+                <div class="input-group w-100 mb-1">
+                    <span class="input-group-text">Num steps</span>
+                    <input class="form-control" @bind="@numSteps" type="number" />
+                </div>
+                <button class="btn btn-success w-100" @onclick="StartLongTimer">Start</button>
+                <div>@realTime</div>
+            </div>
+            <div class="col-8 small">
+                <h3>Fake Progressbar</h3>
+                <p>Modale che mostra avanzamento (progressbar con %) di un task lungo.</p>
+                <p>Devono essere definiti il numero degli step attesi e per ogni step la durata attesa di completamento.</p>
+                <p>Viene definito <b>fake</b> poiché l'avanzamento è artificialmente rallentato quando si approssima allo scadere di uno step per dare impressione di un sistema realmente (ri)calcolato di continuo, mentre al superamento di ogni step viene portato avanti il conteggio recuperando eventuali ritardi di stima.</p>
+            </div>
+        </div>
+        <hr />
+        <div class="card my-2">
+            <div class="card-header"><h4>Test progBar singola linea</h4></div>
+            <div class="card-body">
+                <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>
+        </div>
+
+        <hr />
+        <div class="card  my-2">
+            <div class="card-header"><h4>Test progBar multi linea</h4></div>
+            <div class="card-body">
+                <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>
+            </div>
+        </div>
+    </div>
+</div>
+<ProgressDisplay RefreshInterval="100" Title="@titleMsg" MaxVal="@maxVal" CurrVal="@currVal" NextVal="@nextVal" ExpTimeMSec="@expTimeMSec" DisplaySize="ProgressDisplay.ModalSize.Medium" ModalCss="card alert-primary" SlowLimit="0.4"></ProgressDisplay>

EgwCoreLib.BlazorTest/Pages/TestProgress.razor.cs

@@ -1,18 +1,24 @@
+using System.Diagnostics;
+
 namespace EgwCoreLib.BlazorTest.Pages
 {
-    public partial class TestLoading
+    public partial class TestProgress
     {
         #region Protected Properties
 
-        protected double expTime { get; set; } = 6;
-        protected int numSteps { get; set; } = 4;
+        protected double expTime { get; set; } = 5;
+        protected int numSteps { get; set; } = 10;
 
         #endregion Protected Properties
 
         #region Protected Methods
 
+        protected string realTime = "";
+
         protected async Task StartLongTimer()
         {
+            Stopwatch sw = new Stopwatch();
+            sw.Start();
             maxVal = numSteps * 10;
             double stdWait = expTime / numSteps;
             int nextWait = 1000;
@@ -31,13 +37,15 @@ namespace EgwCoreLib.BlazorTest.Pages
                     nextVal = maxVal;
                 }
                 await InvokeAsync(StateHasChanged);
-                // simulo ritardo importante (da 2 a 3 volte
-                nextWait = (int)(rnd.Next(2000, 3000) * stdWait);
+                // simulo ritardo importante (da 0 a 2 volte)
+                nextWait = (int)(rnd.Next(100, 2000) * stdWait);
                 // attendo step successivi...
                 await Task.Delay(nextWait);
             }
             await Task.Delay(1);
             currVal = maxVal;
+            sw.Stop();
+            realTime = $"Real: {sw.Elapsed.TotalSeconds:N3}s";
             await InvokeAsync(StateHasChanged);
         }
 

EgwCoreLib.BlazorTest/Pages/TestQrDisplay.razor

@@ -0,0 +1,75 @@
+@page "/TestQrDisplay"
+
+<PageTitle>Test Display QRCode</PageTitle>
+
+
+<div class="card">
+    <div class="card-header">
+        <h1>Test Display QRCode</h1>
+    </div>
+    <div class="card-body">
+        <div class="row text-center">
+            <div class="col">
+                <div class="card">
+                    <div class="card-header"><b>AZTEC</b></div>
+                    <div class="card-body">
+                        <div class="d-flex align-items-center text-center" style=" height: 13rem;">
+                            <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.AZTEC"></QrCodeDisplay>
+                        </div>
+                        <hr />
+                        <small>Quadrato, control point centrale</small>
+                    </div>
+                    @* <div class="card-footer"></div> *@
+                </div>
+            </div>
+            <div class="col">
+                <div class="card">
+                    <div class="card-header"><b>QR_CODE</b></div>
+                    <div class="card-body">
+                        <div class="d-flex align-items-center" style=" height: 13rem;">
+                            <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.QR_CODE"></QrCodeDisplay>
+                        </div>
+                        <hr />
+                        <small>Quadrato, 3 control point vertici</small>
+                    </div>
+                </div>
+            </div>
+            <div class="col">
+                <div class="card">
+                    <div class="card-header"><b>DATA_MATRIX</b></div>
+                    <div class="card-body">
+                        <div class="d-flex align-items-center" style=" height: 13rem;">
+                            <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.DATA_MATRIX"></QrCodeDisplay>
+                        </div>
+                        <hr />
+                        <small>Quadrato/Rettangolare (se codice lungo), linee controllo sx/basso</small>
+                    </div>
+                </div>
+            </div>
+            <div class="col">
+                <div class="card">
+                    <div class="card-header"><b>PDF_417</b></div>
+                    <div class="card-body">
+                        <div class="d-flex align-items-center" style=" height: 13rem;">
+                            <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.PDF_417" Width="600" Height="200"></QrCodeDisplay>
+                            @* <QrCodeDisplay rawCode="@qrCodeVal" ImgFormat="ZXing.BarcodeFormat.PDF_417" Width="600"></QrCodeDisplay> *@
+                        </div>
+                        <hr />
+                        <small>Rettangolare, linee controllo verticali sx/dx differenti (verso)</small>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+
+
+
+
+
+
+@code {
+
+    protected string qrCodeVal { get; set; } = "https://office.egalware.com/WDC/UI";
+}

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/_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="css/bootstrap/bootstrap.min.css" />
-    <link rel="stylesheet" href="~/lib/font-awesome/css/all.min.css" />
-    <link href="css/site.css" rel="stylesheet" />
-    <link href="EgwCoreLib.BlazorTest.styles.css" rel="stylesheet" />
+    <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()
@@ -28,8 +30,42 @@
         <a class="dismiss">🗙</a>
     </div>
 
-    <script src="_framework/blazor.server.js"></script>
+    <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>
 
-    <script src="~/lib/Chart.js/chart.js"></script>
+    <script src="_framework/blazor.server.js" autostart="false"></script>
+
+    @*Gestione autoriconnessione: https://github.com/dotnet/aspnetcore/issues/38305 (vedere anche https://docs.microsoft.com/it-it/aspnet/core/blazor/fundamentals/signalr?view=aspnetcore-6.0#modify-the-reconnection-handler-blazor-server)*@
+    <script>
+        Blazor.start({
+            reconnectionOptions: {
+                maxRetries: 1500,
+                retryIntervalMilliseconds: 4000
+            },
+            reconnectionHandler: {
+                onConnectionDown: (options, error) => console.error(error),
+                onConnectionUp: () => console.log("Connection up!,restarting!")
+            }
+        }).then(() => {
+            Object.defineProperty(Blazor.defaultReconnectionHandler, '_reconnectionDisplay', {
+                get() {
+                    return this.__reconnectionDisplay;
+                },
+                set(value) {
+                    this.__reconnectionDisplay = {
+                        show: () => value.show(),
+                        update: (d) => value.update(d),
+                        rejected: (d) => document.location.reload()
+                    }
+                }
+            });
+        });
+    </script>
+    @*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,13 +1,23 @@
-using EgwCoreLib.BlazorTest.Data;
+using EgwCoreLib.BlazorTest;
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Radzen;
 
 var builder = WebApplication.CreateBuilder(args);
 
 // Add services to the container.
 builder.Services.AddRazorPages();
 builder.Services.AddServerSideBlazor();
-builder.Services.AddSingleton<WeatherForecastService>();
+
+// aggiunto compressione
+builder.Services.AddResponseCompression(options =>
+{
+    options.EnableForHttps = true;
+});
+
+// aggiungo componenti radzen
+builder.Services.AddRadzenComponents();
 
 var app = builder.Build();
 
@@ -19,6 +29,15 @@ if (!app.Environment.IsDevelopment())
     app.UseHsts();
 }
 
+
+app.UsePathBase("/BlazorTest/");
+
+// disabilita risposta compressa in debug
+if (!app.Environment.IsDevelopment())
+{
+    app.UseResponseCompression();
+}
+
 app.UseHttpsRedirection();
 
 app.UseStaticFiles();

EgwCoreLib.BlazorTest/Properties/PublishProfiles/IIS01.pubxml

@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+https://go.microsoft.com/fwlink/?LinkID=208121.
+-->
+<Project>
+  <PropertyGroup>
+    <WebPublishMethod>MSDeploy</WebPublishMethod>
+    <LaunchSiteAfterPublish>true</LaunchSiteAfterPublish>
+    <LastUsedBuildConfiguration>Release</LastUsedBuildConfiguration>
+    <LastUsedPlatform>Any CPU</LastUsedPlatform>
+    <SiteUrlToLaunchAfterPublish>https://iis01.egalware.com/EgwCoreTest</SiteUrlToLaunchAfterPublish>
+    <ExcludeApp_Data>false</ExcludeApp_Data>
+    <ProjectGuid>9e5a3295-08bf-4603-9fa3-d38a2f1100e5</ProjectGuid>
+    <SelfContained>false</SelfContained>
+    <MSDeployServiceURL>https://iis01.egalware.com:8172/MsDeploy.axd</MSDeployServiceURL>
+    <DeployIisAppPath>Default Web Site/EgwCoreTest</DeployIisAppPath>
+    <RemoteSitePhysicalPath />
+    <SkipExtraFilesOnServer>false</SkipExtraFilesOnServer>
+    <MSDeployPublishMethod>WMSVC</MSDeployPublishMethod>
+    <EnableMSDeployBackup>true</EnableMSDeployBackup>
+    <EnableMsDeployAppOffline>true</EnableMsDeployAppOffline>
+    <UserName>jenkins</UserName>
+    <_SavePWD>true</_SavePWD>
+    <_TargetId>IISWebDeploy</_TargetId>
+    <TargetFramework>net6.0</TargetFramework>
+  </PropertyGroup>
+</Project>

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

@@ -3,17 +3,26 @@
 <PageTitle>EgwCoreLib.BlazorTest</PageTitle>
 
 <div class="page">
+    <div class="@sideClass">
+        <NavMenu />
+    </div>
     <main class="w-100">
-        <div class="w-100">
+        <div class="top-row">
             <CmpTop></CmpTop>
         </div>
 
         <article class="content px-2">
             @Body
+            <RadzenComponents />
         </article>
 
-        <div class="w-100">
-            <NavBottom></NavBottom>
+        <div class="fixed-bottom bottom-row">
+            <CmpFooter></CmpFooter>
         </div>
     </main>
 </div>
+@code{
+
+    protected bool navLarge { get; set; } = true;
+    protected string sideClass { get; set; } = "sidebar";
+}

EgwCoreLib.BlazorTest/Shared/MainLayout.razor.css

@@ -8,22 +8,22 @@ main {
     flex: 1;
 }
 
-.sidebar {
-    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
+.sidebar, .sidebarSmall {
+    background-image: linear-gradient(180deg, rgb(5, 39, 103) 20%, #3aa6ff 90%);
 }
 
 .top-row {
     background-color: #f7f7f7;
     border-bottom: 1px solid #d6d5d5;
-    justify-content: flex-end;
     height: 3.5rem;
-    display: flex;
     align-items: center;
+    /*justify-content: space-evenly;
+    display: flex;*/
 }
 
     .top-row ::deep a, .top-row .btn-link {
         white-space: nowrap;
-        margin-left: 1.5rem;
+        margin-left: 0.5rem;
     }
 
     .top-row a:first-child {
@@ -45,13 +45,34 @@ main {
     }
 }
 
+.bottom-row {
+    color: #dedede;
+    background-color: #000000;
+    height: 1.6rem;
+    align-items: center;
+}
+
+@media (max-width: 640.99px) {
+    .main > div {
+        padding-left: 0.5rem !important;
+        padding-right: 0.5rem !important;
+    }
+}
+
 @media (min-width: 641px) {
     .page {
         flex-direction: row;
     }
 
     .sidebar {
-        width: 250px;
+        width: 230px;
+        height: 100vh;
+        position: sticky;
+        top: 0;
+    }
+
+    .sidebarSmall {
+        width: 80px;
         height: 100vh;
         position: sticky;
         top: 0;
@@ -64,7 +85,18 @@ main {
     }
 
     .top-row, article {
-        padding-left: 2rem !important;
-        padding-right: 1.5rem !important;
+        padding-left: 1rem !important;
+        padding-right: 1.0rem !important;
+    }
+
+    .bottom-row {
+        position: fixed;
+        bottom: 0;
+        z-index: 1;
+    }
+
+    .main > div {
+        /*padding-left: 0.5rem !important;
+        padding-right: 0.5rem !important;*/
     }
 }

EgwCoreLib.BlazorTest/Shared/NavMenu.razor

@@ -1,4 +1,5 @@
-<div class="top-row ps-3 navbar navbar-dark">
+@using EgwCoreLib.BlazorTest.Data
+<div class="top-row ps-3 navbar navbar-dark">
     <div class="container-fluid">
         <a class="navbar-brand" href="">EgwCoreLib.BlazorTest</a>
         <button title="Navigation menu" class="navbar-toggler" @onclick="ToggleNavMenu">
@@ -9,26 +10,19 @@
 
 <div class="@NavMenuCssClass" @onclick="ToggleNavMenu">
     <nav class="flex-column">
-        <div class="nav-item px-3">
+        <div class="nav-item px-2">
             <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
                 <span class="oi oi-home" aria-hidden="true"></span> Home
             </NavLink>
         </div>
-        <div class="nav-item px-3">
-            <NavLink class="nav-link" href="TestCal">
-                <span class="oi oi-list-rich" aria-hidden="true"></span> Test Calendario
-            </NavLink>
-        </div>
-        <div class="nav-item px-3">
-            <NavLink class="nav-link" href="counter">
-                <span class="oi oi-plus" aria-hidden="true"></span> Counter
-            </NavLink>
-        </div>
-        <div class="nav-item px-3">
-            <NavLink class="nav-link" href="fetchdata">
-                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
-            </NavLink>
-        </div>
+        @foreach (var item in MenuList)
+        {
+            <div class="nav-item px-1">
+                <NavLink class="nav-link px-2" href="@item.Key">
+                    <span class="fa-solid fa-wrench pe-2" aria-hidden="true"></span> @item.Value
+                </NavLink>
+            </div>
+        }        
     </nav>
 </div>
 
@@ -41,4 +35,7 @@
     {
         collapseNavMenu = !collapseNavMenu;
     }
+
+    private Dictionary<string, string> MenuList { get; set; } = TestData.MenuList;
+
 }

EgwCoreLib.BlazorTest/_Imports.razor

@@ -9,4 +9,7 @@
 @using EgwCoreLib.BlazorTest
 @using EgwCoreLib.BlazorTest.Components
 @using EgwCoreLib.BlazorTest.Shared
-@using EgwCoreLib.Razor
+@using EgwCoreLib.Razor
+@using EgwCoreLib.Razor.Data
+@using Radzen
+@using Radzen.Blazor

EgwCoreLib.BlazorTest/compilerconfig.json

@@ -10,5 +10,17 @@
   {
     "outputFile": "Pages/ProvaCalendar.razor.css",
     "inputFile": "Pages/ProvaCalendar.razor.less"
+  },
+  {
+    "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,22 +3,16 @@
   "defaultProvider": "cdnjs",
   "libraries": [
     {
-      "library": "bootstrap@5.2.3",
-      "destination": "wwwroot/lib/css/bootstrap/"
+      "library": "bootstrap@5.3.8",
+      "destination": "wwwroot/lib/bootstrap/"
     },
     {
       "library": "font-awesome@6.3.0",
       "destination": "wwwroot/lib/font-awesome/"
     },
     {
-      "library": "Chart.js@4.3.0",
-      "destination": "wwwroot/lib/Chart.js/",
-      "files": [
-        "chart.min.js",
-        "helpers.min.js",
-        "helpers.js",
-        "chart.js"
-      ]
+      "library": "Chart.js@4.4.1",
+      "destination": "wwwroot/lib/Chart.js/"
     }
   ]
 }

EgwCoreLib.BlazorTest/wwwroot/images/EgalwareLogo.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 564 568" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g id="Livello_3"><g><path d="M275.833,117.917l-156.25,-0.417l156.25,0.417Z" style="fill:none;fill-rule:nonzero;"/><path d="M179.167,361.25l62.5,-89.583l-62.5,89.583Z" style="fill:none;fill-rule:nonzero;"/><path d="M563.333,445.833l-443.333,0l-0.417,-328.333l156.25,0.417l83.334,-117.917l-359.167,0l1.667,567.5l561.666,-0.833l0,-120.834Z" style="fill:#fff;fill-rule:nonzero;"/><path d="M290.417,201.25l-48.75,70.417l-62.5,89.583l384.166,-0.417l0,-360.833l-82.083,0l-140,200.833l-50.833,0.417Z" style="fill:#fff;fill-rule:nonzero;"/><path d="M481.25,0l-122.083,0l122.083,0Z" style="fill:#fff;fill-rule:nonzero;"/></g></g></svg>

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.esm.js

@@ -1,7 +0,0 @@
-/*!
- * Chart.js v3.7.0
- * https://www.chartjs.org
- * (c) 2021 Chart.js Contributors
- * Released under the MIT License
- */
-export { H as HALF_PI, aX as INFINITY, P as PI, aW as PITAU, aZ as QUARTER_PI, aY as RAD_PER_DEG, T as TAU, a_ as TWO_THIRDS_PI, Q as _addGrace, V as _alignPixel, a0 as _alignStartEnd, p as _angleBetween, a$ as _angleDiff, _ as _arrayUnique, a6 as _attachContext, aq as _bezierCurveTo, an as _bezierInterpolation, av as _boundSegment, al as _boundSegments, a3 as _capitalize, ak as _computeSegments, a7 as _createResolver, aH as _decimalPlaces, aP as _deprecated, a8 as _descriptors, af as _elementsEqual, M as _factorize, aJ as _filterBetween, F as _getParentNode, U as _int16Range, ah as _isBetween, ag as _isClickEvent, K as _isDomSupported, z as _isPointInArea, w as _limitValue, aI as _longestText, aK as _lookup, x as _lookupByKey, S as _measureText, aN as _merger, aO as _mergerIf, aw as _normalizeAngle, ao as _pointInLine, ai as _readValueToProps, A as _rlookupByKey, aD as _setMinAndMaxByKey, am as _steppedInterpolation, ap as _steppedLineTo, az as _textX, $ as _toLeftRightCenter, aj as _updateBezierControlPoints, as as addRoundedRectPath, aG as almostEquals, aF as almostWhole, O as callback, ad as clearCanvas, W as clipArea, aM as clone, c as color, h as createContext, ab as debounce, j as defined, aC as distanceBetweenPoints, ar as drawPoint, D as each, e as easingEffects, N as finiteOrDefault, aU as fontString, o as formatNumber, B as getAngleFromPoint, aL as getHoverColor, E as getMaximumSize, y as getRelativePosition, ax as getRtlAdapter, aT as getStyle, b as isArray, g as isFinite, a5 as isFunction, k as isNullOrUndef, q as isNumber, i as isObject, l as listenArrayEvents, L as log10, a2 as merge, a9 as mergeIf, aE as niceNum, aB as noop, ay as overrideTextDirection, G as readUsedSize, X as renderText, r as requestAnimFrame, a as resolve, f as resolveObjectKey, aA as restoreTextDirection, ac as retinaScale, ae as setsEqual, s as sign, aR as splineCurve, aS as splineCurveMonotone, J as supportsEventListenerOptions, I as throttled, R as toDegrees, n as toDimension, Z as toFont, aQ as toFontString, aV as toLineHeight, C as toPadding, m as toPercentage, t as toRadians, at as toTRBL, au as toTRBLCorners, aa as uid, Y as unclipArea, u as unlistenArrayEvents, v as valueOrDefault } from './chunks/helpers.segment.js';

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.esm.min.js

@@ -1 +0,0 @@
-export{H as HALF_PI,aX as INFINITY,P as PI,aW as PITAU,aZ as QUARTER_PI,aY as RAD_PER_DEG,T as TAU,a_ as TWO_THIRDS_PI,Q as _addGrace,V as _alignPixel,a0 as _alignStartEnd,p as _angleBetween,a$ as _angleDiff,_ as _arrayUnique,a6 as _attachContext,aq as _bezierCurveTo,an as _bezierInterpolation,av as _boundSegment,al as _boundSegments,a3 as _capitalize,ak as _computeSegments,a7 as _createResolver,aH as _decimalPlaces,aP as _deprecated,a8 as _descriptors,af as _elementsEqual,M as _factorize,aJ as _filterBetween,F as _getParentNode,U as _int16Range,ah as _isBetween,ag as _isClickEvent,K as _isDomSupported,z as _isPointInArea,w as _limitValue,aI as _longestText,aK as _lookup,x as _lookupByKey,S as _measureText,aN as _merger,aO as _mergerIf,aw as _normalizeAngle,ao as _pointInLine,ai as _readValueToProps,A as _rlookupByKey,aD as _setMinAndMaxByKey,am as _steppedInterpolation,ap as _steppedLineTo,az as _textX,$ as _toLeftRightCenter,aj as _updateBezierControlPoints,as as addRoundedRectPath,aG as almostEquals,aF as almostWhole,O as callback,ad as clearCanvas,W as clipArea,aM as clone,c as color,h as createContext,ab as debounce,j as defined,aC as distanceBetweenPoints,ar as drawPoint,D as each,e as easingEffects,N as finiteOrDefault,aU as fontString,o as formatNumber,B as getAngleFromPoint,aL as getHoverColor,E as getMaximumSize,y as getRelativePosition,ax as getRtlAdapter,aT as getStyle,b as isArray,g as isFinite,a5 as isFunction,k as isNullOrUndef,q as isNumber,i as isObject,l as listenArrayEvents,L as log10,a2 as merge,a9 as mergeIf,aE as niceNum,aB as noop,ay as overrideTextDirection,G as readUsedSize,X as renderText,r as requestAnimFrame,a as resolve,f as resolveObjectKey,aA as restoreTextDirection,ac as retinaScale,ae as setsEqual,s as sign,aR as splineCurve,aS as splineCurveMonotone,J as supportsEventListenerOptions,I as throttled,R as toDegrees,n as toDimension,Z as toFont,aQ as toFontString,aV as toLineHeight,C as toPadding,m as toPercentage,t as toRadians,at as toTRBL,au as toTRBLCorners,aa as uid,Y as unclipArea,u as unlistenArrayEvents,v as valueOrDefault}from"./chunks/helpers.segment.js";

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.js

@@ -0,0 +1,9 @@
+/*!
+ * Chart.js v4.4.1
+ * https://www.chartjs.org
+ * (c) 2023 Chart.js Contributors
+ * Released under the MIT License
+ */
+export { H as HALF_PI, b2 as INFINITY, P as PI, b1 as PITAU, b4 as QUARTER_PI, b3 as RAD_PER_DEG, T as TAU, b5 as TWO_THIRDS_PI, R as _addGrace, X as _alignPixel, a2 as _alignStartEnd, p as _angleBetween, b6 as _angleDiff, _ as _arrayUnique, a8 as _attachContext, as as _bezierCurveTo, ap as _bezierInterpolation, ax as _boundSegment, an as _boundSegments, a5 as _capitalize, am as _computeSegments, a9 as _createResolver, aK as _decimalPlaces, aV as _deprecated, aa as _descriptors, ah as _elementsEqual, N as _factorize, aO as _filterBetween, I as _getParentNode, q as _getStartAndCountOfVisiblePoints, W as _int16Range, aj as _isBetween, ai as _isClickEvent, M as _isDomSupported, C as _isPointInArea, S as _limitValue, aN as _longestText, aP as _lookup, B as _lookupByKey, V as _measureText, aT as _merger, aU as _mergerIf, ay as _normalizeAngle, y as _parseObjectDataRadialScale, aq as _pointInLine, ak as _readValueToProps, A as _rlookupByKey, w as _scaleRangesChanged, aG as _setMinAndMaxByKey, aW as _splitKey, ao as _steppedInterpolation, ar as _steppedLineTo, aB as _textX, a1 as _toLeftRightCenter, al as _updateBezierControlPoints, au as addRoundedRectPath, aJ as almostEquals, aI as almostWhole, Q as callback, af as clearCanvas, Y as clipArea, aS as clone, c as color, j as createContext, ad as debounce, h as defined, aE as distanceBetweenPoints, at as drawPoint, aD as drawPointLegend, F as each, e as easingEffects, O as finiteOrDefault, a$ as fontString, o as formatNumber, D as getAngleFromPoint, aR as getHoverColor, G as getMaximumSize, z as getRelativePosition, az as getRtlAdapter, a_ as getStyle, b as isArray, g as isFinite, a7 as isFunction, k as isNullOrUndef, x as isNumber, i as isObject, aQ as isPatternOrGradient, l as listenArrayEvents, aM as log10, a4 as merge, ab as mergeIf, aH as niceNum, aF as noop, aA as overrideTextDirection, J as readUsedSize, Z as renderText, r as requestAnimFrame, a as resolve, f as resolveObjectKey, aC as restoreTextDirection, ae as retinaScale, ag as setsEqual, s as sign, aY as splineCurve, aZ as splineCurveMonotone, K as supportsEventListenerOptions, L as throttled, U as toDegrees, n as toDimension, a0 as toFont, aX as toFontString, b0 as toLineHeight, E as toPadding, m as toPercentage, t as toRadians, av as toTRBL, aw as toTRBLCorners, ac as uid, $ as unclipArea, u as unlistenArrayEvents, v as valueOrDefault } from './chunks/helpers.segment.js';
+import '@kurkle/color';
+//# sourceMappingURL=helpers.js.map

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/helpers.min.js

@@ -0,0 +1 @@
+export{H as HALF_PI,b2 as INFINITY,P as PI,b1 as PITAU,b4 as QUARTER_PI,b3 as RAD_PER_DEG,T as TAU,b5 as TWO_THIRDS_PI,R as _addGrace,X as _alignPixel,a2 as _alignStartEnd,p as _angleBetween,b6 as _angleDiff,_ as _arrayUnique,a8 as _attachContext,as as _bezierCurveTo,ap as _bezierInterpolation,ax as _boundSegment,an as _boundSegments,a5 as _capitalize,am as _computeSegments,a9 as _createResolver,aK as _decimalPlaces,aV as _deprecated,aa as _descriptors,ah as _elementsEqual,N as _factorize,aO as _filterBetween,I as _getParentNode,q as _getStartAndCountOfVisiblePoints,W as _int16Range,aj as _isBetween,ai as _isClickEvent,M as _isDomSupported,C as _isPointInArea,S as _limitValue,aN as _longestText,aP as _lookup,B as _lookupByKey,V as _measureText,aT as _merger,aU as _mergerIf,ay as _normalizeAngle,y as _parseObjectDataRadialScale,aq as _pointInLine,ak as _readValueToProps,A as _rlookupByKey,w as _scaleRangesChanged,aG as _setMinAndMaxByKey,aW as _splitKey,ao as _steppedInterpolation,ar as _steppedLineTo,aB as _textX,a1 as _toLeftRightCenter,al as _updateBezierControlPoints,au as addRoundedRectPath,aJ as almostEquals,aI as almostWhole,Q as callback,af as clearCanvas,Y as clipArea,aS as clone,c as color,j as createContext,ad as debounce,h as defined,aE as distanceBetweenPoints,at as drawPoint,aD as drawPointLegend,F as each,e as easingEffects,O as finiteOrDefault,a$ as fontString,o as formatNumber,D as getAngleFromPoint,aR as getHoverColor,G as getMaximumSize,z as getRelativePosition,az as getRtlAdapter,a_ as getStyle,b as isArray,g as isFinite,a7 as isFunction,k as isNullOrUndef,x as isNumber,i as isObject,aQ as isPatternOrGradient,l as listenArrayEvents,aM as log10,a4 as merge,ab as mergeIf,aH as niceNum,aF as noop,aA as overrideTextDirection,J as readUsedSize,Z as renderText,r as requestAnimFrame,a as resolve,f as resolveObjectKey,aC as restoreTextDirection,ae as retinaScale,ag as setsEqual,s as sign,aY as splineCurve,aZ as splineCurveMonotone,K as supportsEventListenerOptions,L as throttled,U as toDegrees,n as toDimension,a0 as toFont,aX as toFontString,b0 as toLineHeight,E as toPadding,m as toPercentage,t as toRadians,av as toTRBL,aw as toTRBLCorners,ac as uid,$ as unclipArea,u as unlistenArrayEvents,v as valueOrDefault}from"./chunks/helpers.segment.js";import"@kurkle/color";

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/index.d.ts

@@ -0,0 +1,12 @@
+export * from './controllers/index.js';
+export * from './core/index.js';
+export * from './elements/index.js';
+export * from './platform/index.js';
+export * from './plugins/index.js';
+export * from './scales/index.js';
+import * as controllers from './controllers/index.js';
+import * as elements from './elements/index.js';
+import * as plugins from './plugins/index.js';
+import * as scales from './scales/index.js';
+export { controllers, elements, plugins, scales, };
+export declare const registerables: (typeof controllers | typeof elements | typeof plugins | typeof scales)[];

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/index.umd.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @namespace Chart
+ */
+import Chart from './core/core.controller.js';
+export default Chart;

EgwCoreLib.BlazorTest/wwwroot/lib/Chart.js/types.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Temporary entry point of the types at the time of the transition.
+ * After transition done need to remove it in favor of index.ts
+ */
+export * from './index.js';
+/**
+ * Explicitly re-exporting to resolve the ambiguity.
+ */
+export { BarController, BubbleController, DoughnutController, LineController, PieController, PolarAreaController, RadarController, ScatterController, Animation, Animations, Chart, DatasetController, Interaction, Scale, Ticks, defaults, layouts, registry, ArcElement, BarElement, LineElement, PointElement, BasePlatform, BasicPlatform, DomPlatform, Decimation, Filler, Legend, SubTitle, Title, Tooltip, CategoryScale, LinearScale, LogarithmicScale, RadialLinearScale, TimeScale, TimeSeriesScale, PluginOptionsByType, ElementOptionsByType, ChartDatasetProperties, UpdateModeEnum, registerables } from './types/index.js';
+export * from './types/index.js';

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;
   }