Skip to content

Commit 9729c29

Browse files
mckaragozmckaragoz
authored
StepperExtended & Input Disabled State (#390)
1 parent 8905a0d commit 9729c29

14 files changed

Lines changed: 127 additions & 117 deletions

File tree

‎CodeBeam.MudBlazor.Extensions.Docs/Pages/ApiPage.razor‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -56,8 +56,8 @@
5656
typeof(MudSignaturePad),
5757
typeof(MudSpeedDial),
5858
typeof(MudSplitter),
59-
typeof(MudStepper),
60-
typeof(MudStep),
59+
typeof(MudStepperExtended),
60+
typeof(MudStepExtended),
6161
typeof(MudSwitchM3<bool>),
6262
typeof(MudTeleport),
6363
typeof(MudTextFieldExtended<string>),

‎CodeBeam.MudBlazor.Extensions.Docs/Pages/Components/Stepper/Examples/StepperExample1.razor‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55

66
<MudGrid Class="cursor-default">
77
<MudItem xs="12" sm="8" Class="d-flex align-center">
8-
<MudStepper @ref="_stepper" Class="mud-width-full" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical" Color="_color" Variant="_variant"
8+
<MudStepperExtended @ref="_stepper" Class="mud-width-full" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical" Color="_color" Variant="_variant"
99
DisableAnimation="_disableAnimation" DisablePreviousButton="_disablePreviousButton" DisableNextButton="_disableNextButton"
1010
DisableSkipButton="_disableSkipButton" DisableStepResultIndicator="_disableStepResultIndicator" HeaderBadgeView="_headerBadgeView"
1111
HeaderTextView="_headerTextView" PreventStepChangeAsync="new Func<StepChangeDirection, int, Task<bool>>(CheckChange)" LocalizedStrings="GetLocalizedStrings()"
@@ -21,7 +21,7 @@
2121
}
2222
</StaticContent>
2323
<ChildContent>
24-
<MudStep Icon="@Icons.Material.Filled.Approval" Title="Customer Info" StatusChanged="StatusChanged">
24+
<MudStepExtended Icon="@Icons.Material.Filled.Approval" Title="Customer Info" StatusChanged="StatusChanged">
2525
<ChildContent>
2626
<MudForm @ref="_form">
2727
<MudStack>
@@ -31,15 +31,15 @@
3131
</MudStack>
3232
</MudForm>
3333
</ChildContent>
34-
</MudStep>
35-
<MudStep Title="Booking Spec." Icon="@Icons.Material.Filled.MoreVert" Optional="true">
34+
</MudStepExtended>
35+
<MudStepExtended Title="Booking Spec." Icon="@Icons.Material.Filled.MoreVert" Optional="true">
3636
<ChildContent>
3737
<MudCheckBox T="bool" Label="Early Check-in" Color="_color" />
3838
<MudCheckBox T="bool" Label="Late Check-out" Color="_color" />
3939
<MudCheckBox T="bool" Label="Twin Bed" Color="_color" />
4040
</ChildContent>
41-
</MudStep>
42-
<MudStep Icon="@Icons.Material.Filled.Money" Title="Payment">
41+
</MudStepExtended>
42+
<MudStepExtended Icon="@Icons.Material.Filled.Money" Title="Payment">
4343
<ChildContent>
4444
<MudForm @ref="_form2">
4545
<MudStack>
@@ -51,18 +51,18 @@
5151
</MudStack>
5252
</MudForm>
5353
</ChildContent>
54-
</MudStep>
54+
</MudStepExtended>
5555

5656
@if (_addResultStep)
5757
{
58-
<MudStep Icon="@Icons.Material.Filled.Alarm" Title="Result Step" IsResultStep="true">
58+
<MudStepExtended Icon="@Icons.Material.Filled.Alarm" Title="Result Step" IsResultStep="true">
5959
<ChildContent>
6060
<div class="d-flex flex-column align-center justify-center" style="height: 200px">
6161
<MudIconButton Icon="@Icons.Material.Filled.DoneAll" Size="Size.Large" Variant="Variant.Filled" Color="Color.Success" />
6262
<MudText>Your reservation successfully completed.</MudText>
6363
</div>
6464
</ChildContent>
65-
</MudStep>
65+
</MudStepExtended>
6666
}
6767
</ChildContent>
6868
<ActionContent>
@@ -72,7 +72,7 @@
7272
}
7373
@* <MudSpacer /> *@
7474
</ActionContent>
75-
</MudStepper>
75+
</MudStepperExtended>
7676
</MudItem>
7777

7878
<MudItem xs="12" sm="4" Style="box-shadow: rgba(240, 46, 170, 0.4) -3px 3px;">
@@ -129,9 +129,9 @@
129129
</MudGrid>
130130

131131
@code {
132-
MudStepper? _stepper = new();
133-
MudForm? _form;
134-
MudForm? _form2;
132+
MudStepperExtended? _stepper = new();
133+
MudForm? _form = new();
134+
MudForm? _form2 = new();
135135
bool _checkValidationBeforeComplete = false;
136136
bool _linear;
137137
bool _mobileView;

‎CodeBeam.MudBlazor.Extensions.Docs/Pages/Components/Stepper/Examples/StepperExample2.razor‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,11 @@
55

66
<MudGrid Class="cursor-default">
77
<MudItem xs="12" sm="8" Class="d-flex align-center">
8-
<MudStepper @ref="_stepper" Class="mud-width-full" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical"
8+
<MudStepperExtended @ref="_stepper" Class="mud-width-full" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical"
99
PreventStepChangeAsync="new Func<StepChangeDirection, int, Task<bool>>(CheckChange)" Variant="Variant.Filled" Color="Color.Secondary"
1010
MobileView="_mobileView" Loading="_loading" HeaderTextView="HeaderTextView.All">
1111
<ChildContent>
12-
<MudStep Icon="@Icons.Material.Filled.Approval" Title="Customer Info" StatusChanged="StatusChanged" Order="_infoStepOrder">
12+
<MudStepExtended Icon="@Icons.Material.Filled.Approval" Title="Customer Info" StatusChanged="StatusChanged" Order="_infoStepOrder">
1313
<ChildContent>
1414
<MudForm @ref="_form">
1515
<MudStack>
@@ -19,15 +19,15 @@
1919
</MudStack>
2020
</MudForm>
2121
</ChildContent>
22-
</MudStep>
23-
<MudStep Title="Booking Spec." Icon="@Icons.Material.Filled.MoreVert" Optional="true" Order="_optionsStepOrder">
22+
</MudStepExtended>
23+
<MudStepExtended Title="Booking Spec." Icon="@Icons.Material.Filled.MoreVert" Optional="true" Order="_optionsStepOrder">
2424
<ChildContent>
2525
<MudCheckBox T="bool" Label="Early Check-in" />
2626
<MudCheckBox T="bool" Label="Late Check-out" />
2727
<MudCheckBox T="bool" Label="Twin Bed" />
2828
</ChildContent>
29-
</MudStep>
30-
<MudStep Icon="@Icons.Material.Filled.Money" Title="Payment" Order="_paymentStepOrder">
29+
</MudStepExtended>
30+
<MudStepExtended Icon="@Icons.Material.Filled.Money" Title="Payment" Order="_paymentStepOrder">
3131
<ChildContent>
3232
<MudForm @ref="_form2">
3333
<MudStack>
@@ -39,21 +39,21 @@
3939
</MudStack>
4040
</MudForm>
4141
</ChildContent>
42-
</MudStep>
42+
</MudStepExtended>
4343

4444
@if (_addResultStep)
4545
{
46-
<MudStep Icon="@Icons.Material.Filled.Alarm" Title="Result Step" IsResultStep="true">
46+
<MudStepExtended Icon="@Icons.Material.Filled.Alarm" Title="Result Step" IsResultStep="true">
4747
<ChildContent>
4848
<div class="d-flex flex-column align-center justify-center" style="height: 200px">
4949
<MudIconButton Icon="@Icons.Material.Filled.DoneAll" Size="Size.Large" Variant="Variant.Filled" Color="Color.Success" />
5050
<MudText>Your reservation successfully completed.</MudText>
5151
</div>
5252
</ChildContent>
53-
</MudStep>
53+
</MudStepExtended>
5454
}
5555
</ChildContent>
56-
</MudStepper>
56+
</MudStepperExtended>
5757
</MudItem>
5858

5959
<MudItem xs="12" sm="4" Style="box-shadow: rgba(240, 46, 170, 0.4) -3px 3px;">
@@ -71,7 +71,7 @@
7171
</MudGrid>
7272

7373
@code {
74-
MudStepper? _stepper;
74+
MudStepperExtended? _stepper = new();
7575
MudForm _form = new();
7676
MudForm _form2 = new();
7777
bool _checkValidationBeforeComplete = false;

‎CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66

77
<MudGrid Class="cursor-default">
88
<MudItem xs="12" sm="8">
9-
<MudStepper @ref="_stepper" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical" Color="_color" Variant="_variant"
9+
<MudStepperExtended @ref="_stepper" ContentStyle="min-height: 400px" Linear="_linear" Vertical="_vertical" Color="_color" Variant="_variant"
1010
DisableAnimation="_disableAnimation" DisablePreviousButton="_disablePreviousButton" DisableNextButton="_disableNextButton"
1111
DisableSkipButton="_disableSkipButton" DisableStepResultIndicator="_disableStepResultIndicator" HeaderTextView="_headerTextView"
1212
PreventStepChangeAsync="new Func<StepChangeDirection, int, Task<bool>>(CheckChange)" LocalizedStrings="GetLocalizedStrings()"
@@ -21,21 +21,21 @@
2121
}
2222
</StaticContent>
2323
<ChildContent>
24-
<MudStep Title="Customer Info" StatusChanged="StatusChanged">
24+
<MudStepExtended Title="Customer Info" StatusChanged="StatusChanged">
2525
<MudForm @ref="_form">
2626
<MudStack>
2727
<MudTextField T="string" Label="Name" Variant="_variant" Required="true" />
2828
<MudTextField T="string" Label="Last Name" Variant="_variant" />
2929
<MudTextField T="string" Label="Adress" Variant="_variant" />
3030
</MudStack>
3131
</MudForm>
32-
</MudStep>
33-
<MudStep Title="Booking Spec." Optional="true">
32+
</MudStepExtended>
33+
<MudStepExtended Title="Booking Spec." Optional="true">
3434
<MudCheckBox T="bool" Label="Early Check-in" Color="_color" />
3535
<MudCheckBox T="bool" Label="Late Check-out" Color="_color" />
3636
<MudCheckBox T="bool" Label="Twin Bed" Color="_color" />
37-
</MudStep>
38-
<MudStep Title="Payment">
37+
</MudStepExtended>
38+
<MudStepExtended Title="Payment">
3939
<MudForm @ref="_form2">
4040
<MudStack>
4141
<MudTextField T="string" Label="Card Number" Variant="_variant" Required="true" />
@@ -45,16 +45,16 @@
4545
</MudStack>
4646
</MudStack>
4747
</MudForm>
48-
</MudStep>
48+
</MudStepExtended>
4949

5050
@if (_addResultStep)
5151
{
52-
<MudStep Title="Result Step" IsResultStep="true">
52+
<MudStepExtended Title="Result Step" IsResultStep="true">
5353
<div class="d-flex flex-column align-center justify-center" style="height: 200px">
5454
<MudIconButton Icon="@Icons.Material.Filled.DoneAll" Size="Size.Large" Variant="Variant.Filled" Color="Color.Success" />
5555
<MudText>Your reservation successfully completed.</MudText>
5656
</div>
57-
</MudStep>
57+
</MudStepExtended>
5858
}
5959
</ChildContent>
6060
<ActionContent>
@@ -64,7 +64,7 @@
6464
}
6565
<MudSpacer />
6666
</ActionContent>
67-
</MudStepper>
67+
</MudStepperExtended>
6868
</MudItem>
6969

7070
<MudItem xs="12" sm="4" Style="box-shadow: rgba(240, 46, 170, 0.4) -3px 3px;">
@@ -100,7 +100,7 @@
100100
</MudGrid>
101101

102102
@code {
103-
MudStepper _stepper = new();
103+
MudStepperExtended _stepper = new();
104104
MudForm _form = new();
105105
MudForm _form2 = new();
106106
bool _checkValidationBeforeComplete = false;

0 commit comments

Comments
 (0)