Skip to content

Commit 66e04d3

Browse files
marcoatribeirobasicondoadmin
marcoatribeiro
and
basicondoadmin
authored
Implemented possibility of adding AdornmentStart to PasswordField (#271)
* Added Align and Color properties to MudTextM3 * Added other properties and fixed class settings * Implemented possibility of adding AdornmentStart to PasswordField --------- Co-authored-by: Marco <[email protected]>
1 parent 134f0f2 commit 66e04d3

File tree

3 files changed

+120
-47
lines changed

3 files changed

+120
-47
lines changed

‎CodeBeam.MudBlazor.Extensions/Components/PasswordField/MudPasswordField.razor‎

Lines changed: 97 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -19,50 +19,103 @@
1919
ForId="@FieldId">
2020
<InputContent>
2121
<CascadingValue Name="Standalone" Value="false" IsFixed="true">
22-
<MudInputExtended T="string"
23-
@ref="InputReference"
24-
@attributes="UserAttributes"
25-
InputType="@_passwordInput"
26-
Lines="@Lines"
27-
Style="@Style"
28-
Variant="@Variant"
29-
TextUpdateSuppression="@TextUpdateSuppression"
30-
Value="@Text"
31-
ValueChanged="(s) => SetTextAsync(s)"
32-
Placeholder="@Placeholder"
33-
Disabled=@Disabled
34-
DisableUnderLine="@DisableUnderLine"
35-
ReadOnly="@ReadOnly"
36-
MaxLength="@MaxLength"
37-
AdornmentAriaLabel="@AdornmentAriaLabel"
38-
Error="@Error"
39-
ErrorId="@ErrorId"
40-
Immediate="@Immediate"
41-
Margin="@Margin"
42-
OnBlur="@OnBlurredAsync"
43-
OnKeyDown="@InvokeKeyDown"
44-
OnInternalInputChanged="OnChange"
45-
OnKeyPress="@InvokeKeyPress"
46-
OnKeyUp="@InvokeKeyUp"
47-
KeyDownPreventDefault="KeyDownPreventDefault"
48-
KeyPressPreventDefault="KeyPressPreventDefault"
49-
KeyUpPreventDefault="KeyUpPreventDefault"
50-
HideSpinButtons="true"
51-
Clearable="@Clearable"
52-
OnClearButtonClick="@OnClearButtonClick"
53-
Pattern="@Pattern">
54-
<AdornmentEnd>
55-
@if (CustomAdornment != null)
56-
{
57-
@CustomAdornment
58-
}
59-
else
60-
{
61-
<MudIconButton Icon="@_passwordIcon" Color="@AdornmentColor" Size="@IconSize" OnClick="AdornmentClick" tabindex="@(AdornmentTabStop ? 0 : -1)"></MudIconButton>
62-
}
63-
</AdornmentEnd>
64-
65-
</MudInputExtended>
22+
@if (AdornmentStart != null)
23+
{
24+
<MudInputExtended T="string"
25+
@ref="InputReference"
26+
@attributes="UserAttributes"
27+
InputType="@_passwordInput"
28+
Lines="@Lines"
29+
Style="@Style"
30+
Variant="@Variant"
31+
TextUpdateSuppression="@TextUpdateSuppression"
32+
Value="@Text"
33+
ValueChanged="(s) => SetTextAsync(s)"
34+
Placeholder="@Placeholder"
35+
Disabled=@Disabled
36+
DisableUnderLine="@DisableUnderLine"
37+
ReadOnly="@ReadOnly"
38+
MaxLength="@MaxLength"
39+
Adornment="@Adornment"
40+
AdornmentAriaLabel="@AdornmentAriaLabel"
41+
Error="@Error"
42+
ErrorId="@ErrorId"
43+
Immediate="@Immediate"
44+
Margin="@Margin"
45+
OnBlur="@OnBlurredAsync"
46+
OnKeyDown="@InvokeKeyDown"
47+
OnInternalInputChanged="OnChange"
48+
OnKeyPress="@InvokeKeyPress"
49+
OnKeyUp="@InvokeKeyUp"
50+
KeyDownPreventDefault="KeyDownPreventDefault"
51+
KeyPressPreventDefault="KeyPressPreventDefault"
52+
KeyUpPreventDefault="KeyUpPreventDefault"
53+
HideSpinButtons="true"
54+
Clearable="@Clearable"
55+
OnClearButtonClick="@OnClearButtonClick"
56+
Pattern="@Pattern">
57+
<AdornmentStart>
58+
@AdornmentStart
59+
</AdornmentStart>
60+
<AdornmentEnd>
61+
@if (CustomAdornment != null)
62+
{
63+
@CustomAdornment
64+
}
65+
else
66+
{
67+
<MudIconButton Icon="@_passwordIcon" Color="@AdornmentColor" Size="@IconSize" OnClick="AdornmentClick" tabindex="@(AdornmentTabStop ? 0 : -1)"></MudIconButton>
68+
}
69+
</AdornmentEnd>
70+
</MudInputExtended>
71+
}
72+
else
73+
{
74+
<MudInputExtended T="string"
75+
@ref="InputReference"
76+
@attributes="UserAttributes"
77+
InputType="@_passwordInput"
78+
Lines="@Lines"
79+
Style="@Style"
80+
Variant="@Variant"
81+
TextUpdateSuppression="@TextUpdateSuppression"
82+
Value="@Text"
83+
ValueChanged="(s) => SetTextAsync(s)"
84+
Placeholder="@Placeholder"
85+
Disabled=@Disabled
86+
DisableUnderLine="@DisableUnderLine"
87+
ReadOnly="@ReadOnly"
88+
MaxLength="@MaxLength"
89+
Adornment="@Adornment"
90+
AdornmentAriaLabel="@AdornmentAriaLabel"
91+
Error="@Error"
92+
ErrorId="@ErrorId"
93+
Immediate="@Immediate"
94+
Margin="@Margin"
95+
OnBlur="@OnBlurredAsync"
96+
OnKeyDown="@InvokeKeyDown"
97+
OnInternalInputChanged="OnChange"
98+
OnKeyPress="@InvokeKeyPress"
99+
OnKeyUp="@InvokeKeyUp"
100+
KeyDownPreventDefault="KeyDownPreventDefault"
101+
KeyPressPreventDefault="KeyPressPreventDefault"
102+
KeyUpPreventDefault="KeyUpPreventDefault"
103+
HideSpinButtons="true"
104+
Clearable="@Clearable"
105+
OnClearButtonClick="@OnClearButtonClick"
106+
Pattern="@Pattern">
107+
<AdornmentEnd>
108+
@if (CustomAdornment != null)
109+
{
110+
@CustomAdornment
111+
}
112+
else
113+
{
114+
<MudIconButton Icon="@_passwordIcon" Color="@AdornmentColor" Size="@IconSize" OnClick="AdornmentClick" tabindex="@(AdornmentTabStop ? 0 : -1)"></MudIconButton>
115+
}
116+
</AdornmentEnd>
117+
</MudInputExtended>
118+
}
66119
</CascadingValue>
67120
</InputContent>
68121
</MudInputControl>

‎CodeBeam.MudBlazor.Extensions/Components/PasswordField/MudPasswordField.razor.cs‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,11 @@ public partial class MudPasswordField<T> : MudDebouncedInput<T>
5151
/// </summary>
5252
[Parameter] public EventCallback<MouseEventArgs> OnClearButtonClick { get; set; }
5353

54+
/// <summary>
55+
/// RenderFragment for start adornment.
56+
/// </summary>
57+
[Parameter] public RenderFragment AdornmentStart { get; set; }
58+
5459
/// <summary>
5560
/// RenderFragment for end adornment.
5661
/// </summary>

‎ComponentViewer.Docs/Pages/Examples/PasswordFieldExample1.razor‎

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,31 @@
11
<MudGrid>
22
<MudItem xs="12" sm="8" Class="d-flex align-center">
3-
<MudPasswordField @bind-Value="@_password" @bind-PasswordMode="@_passwordMode" Variant="Variant.Outlined" IconSize="_size" />
3+
@if (_adornmentStart)
4+
{
5+
<MudPasswordField @bind-Value="@_password" @bind-PasswordMode="@_passwordMode" Variant="Variant.Outlined" IconSize="_size">
6+
<AdornmentStart>
7+
<MudIcon Icon="@Icons.Material.Filled.Key"/>
8+
</AdornmentStart>
9+
</MudPasswordField>
10+
}
11+
else
12+
{
13+
<MudPasswordField @bind-Value="@_password" @bind-PasswordMode="@_passwordMode" Variant="Variant.Outlined" IconSize="_size" />
14+
}
415
</MudItem>
516

617
<MudItem xs="12" sm="4">
7-
<MudSwitchM3 @bind-Checked="_passwordMode" Color="Color.Secondary">Password Mode</MudSwitchM3>
8-
<MudSelectExtended @bind-Value="_size" ItemCollection="Enum.GetValues<Size>()" Label="Icon Size" Variant="Variant.Outlined" />
18+
<MudStack>
19+
<MudSwitchM3 @bind-Checked="_passwordMode" Color="Color.Secondary">Password Mode</MudSwitchM3>
20+
<MudSwitchM3 @bind-Checked="_adornmentStart" Color="Color.Secondary">Adornment Start</MudSwitchM3>
21+
<MudSelectExtended @bind-Value="_size" ItemCollection="Enum.GetValues<Size>()" Label="Icon Size" Variant="Variant.Outlined"/>
22+
</MudStack>
923
</MudItem>
1024
</MudGrid>
1125

1226
@code{
1327
string _password = "asdf";
1428
bool _passwordMode;
29+
bool _adornmentStart;
1530
Size _size = Size.Medium;
1631
}

0 commit comments

Comments
 (0)