diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index ae1d7aa3..b9ceef8e 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -53,6 +53,11 @@ + @if (Loading) + { + + } + @StaticContent
@ChildContent diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 6e92609c..3e52a40c 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -103,6 +103,18 @@ protected string GetDashClassname(MudStep step) [Parameter] public bool MobileView { get; set; } + /// + /// If true, a linear loading indicator shows under the header. + /// + [Parameter] + public bool Loading { get; set; } + + /// + /// A static content that always show with all steps. + /// + [Parameter] + public RenderFragment StaticContent { get; set; } + /// /// If true, action buttons have icons instead of text to gain more space. /// @@ -156,9 +168,13 @@ protected string GetDashClassname(MudStep step) [Parameter] public EventCallback ActiveStepChanged { get; set; } + [Obsolete("Use PreventStepChangeAsync instead.")] [Parameter] public Func PreventStepChange { get; set; } + [Parameter] + public Func> PreventStepChangeAsync { get; set; } + List _steps = new(); List _allSteps = new(); public List Steps @@ -219,6 +235,16 @@ public async Task SetActiveIndex(int count, bool firstCompleted = false, bool sk return; } + if (PreventStepChangeAsync != null) + { + var result = await PreventStepChangeAsync.Invoke(stepChangeDirection); + if (result == true) + { + return; + } + } + + int backupActiveIndex = ActiveIndex; if (_animate != null) { @@ -297,6 +323,15 @@ public async Task CompleteStep(int index, bool moveToNextStep = true) { return; } + + if (PreventStepChangeAsync != null) + { + var result = await PreventStepChangeAsync.Invoke(stepChangeDirection); + if (result == true) + { + return; + } + } } Steps[index].SetStatus(StepStatus.Completed); @@ -320,6 +355,15 @@ public async Task SkipStep(int index, bool moveToNextStep = true) { return; } + + if (PreventStepChangeAsync != null) + { + var result = await PreventStepChangeAsync.Invoke(stepChangeDirection); + if (result == true) + { + return; + } + } } Steps[index].SetStatus(StepStatus.Skipped); diff --git a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor index 26cf4225..2fb2342d 100644 --- a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor +++ b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor @@ -8,8 +8,17 @@ + PreventStepChangeAsync="new Func>(CheckChange)" LocalizedStrings="GetLocalizedStrings()" + MobileView="_mobileView" IconActionButtons="_iconActionButtons" Loading="_loading"> + + @if (_showStaticContent) + { + + ST + This is a static content which shows with each step. + + } + @@ -71,6 +80,7 @@ + @foreach (Variant item in Enum.GetValues()) { @@ -113,8 +123,10 @@ bool _customLocalization = false; Color _color = Color.Primary; int _activeIndex = 0; + bool _loading; + bool _showStaticContent = false; - private bool CheckChange(StepChangeDirection direction) + private async Task CheckChange(StepChangeDirection direction) { if (_checkValidationBeforeComplete == true) { @@ -125,12 +137,22 @@ } if (_stepper.GetActiveIndex() == 0) { - _form.Validate(); + _loading = true; + StateHasChanged(); + await Task.Delay(1000); + await _form.Validate(); + _loading = false; + StateHasChanged(); return !_form.IsValid; } else if (_stepper.GetActiveIndex() == 2) { - _form2.Validate(); + _loading = true; + StateHasChanged(); + await Task.Delay(1000); + await _form2.Validate(); + _loading = false; + StateHasChanged(); return !_form2.IsValid; } else