Skip to content

Commit 8e30b8e

Browse files
Anu6isAnu6is
committed
- use Mud component so we don't have to maintain possible future style changed
- remove unused methods
1 parent f65689c commit 8e30b8e

3 files changed

Lines changed: 81 additions & 92 deletions

File tree

‎src/Components/MudStaticRadio.razor‎

Lines changed: 43 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -3,57 +3,28 @@
33
@typeparam T
44
@inherits MudRadio<T>
55

6-
<div class="mud-input-control mud-input-control-boolean-input mud-input-with-content">
7-
<div class="mud-input-control-input-container">
8-
<label class="mud-radio mud-input-content-placement-end" __internal_stoppropagation_onclick="">
9-
<span class="mud-button-root mud-icon-button mud-ripple mud-ripple-radio mud-default-text hover:mud-default-hover"
10-
tabindex="0"
11-
@onclick:stopPropagation="true">
12-
<input type="radio"
13-
class="mud-radio-input"
14-
tabindex="-1"
15-
role="radio"
16-
name="@ParentGroup?.GroupName"
17-
value="@Value"
18-
id="@($"static-radio-{_elementId}")"
19-
checked="@IsChecked" />
20-
21-
<MudIcon Size="Size"
22-
Color="HasErrors ? Color.Error : Color"
23-
Icon="@(IsChecked ? CheckedIcon : UncheckedIcon)"
24-
id="@($"radio-svg-{_elementId}")" />
6+
<MudInputControl Class="@Classname" Style="@Style" Error="@HasErrors" ErrorText="@GetErrorText()" Required="@Required">
7+
<InputContent>
8+
<label class="@LabelClassname" style="@Style" id="@_elementId" @onclick:stopPropagation="@StopClickPropagation">
9+
<span tabindex="0" class="@IconClassname">
10+
<input id="@($"static-radio-{_elementId}")" tabindex="-1" @attributes="UserAttributes" type="radio" role="radio"
11+
class="mud-radio-input" checked="@IsChecked" name="@ParentGroup?.Name" disabled="@GetDisabledState()" value="@Value"
12+
aria-checked="@(IsChecked.ToString().ToLower())" aria-disabled="@(GetDisabledState().ToString().ToLower())" @onclick:preventDefault="@GetReadOnlyState()" />
13+
<MudIcon id="@($"radio-svg-{_elementId}")" Disabled="@Disabled" Icon="@(IsChecked ? CheckedIcon : UncheckedIcon)" Color="HasErrors ? Color.Error : Color.Inherit" Size="@Size" />
2514
</span>
26-
27-
<p class="mud-typography mud-typography-body1">
28-
@ChildContent
29-
</p>
15+
@if (!string.IsNullOrEmpty(Label))
16+
{
17+
<MudText Color="HasErrors ? Color.Error : Color.Inherit">@Label</MudText>
18+
}
19+
@if (ChildContent is not null)
20+
{
21+
<MudText Color="HasErrors ? Color.Error : Color.Inherit">
22+
@ChildContent
23+
</MudText>
24+
}
3025
</label>
31-
</div>
32-
</div>
33-
34-
<script>
35-
(function() {
36-
const radio = document.getElementById('static-radio-@_elementId');
37-
const svg = document.getElementById('radio-svg-@_elementId');
38-
39-
const checkedIcon = '@(CheckedIcon)';
40-
const uncheckedIcon = '@(UncheckedIcon)';
41-
42-
if (radio && svg) {
43-
const handleChange = () => {
44-
svg.innerHTML = radio.checked ? checkedIcon : uncheckedIcon;
45-
};
46-
47-
radio.addEventListener('change', handleChange);
48-
49-
document.addEventListener('change', (e) => {
50-
if (e.target.type === 'radio' && e.target.name === radio.name && e.target !== radio) {
51-
handleChange();
52-
}
53-
});
54-
}
55-
})();
56-
</script>
26+
</InputContent>
27+
</MudInputControl>
5728

5829
@code {
5930
[CascadingParameter]
@@ -84,12 +55,28 @@
8455

8556
base.OnParametersSet();
8657
}
58+
}
8759

88-
private async Task SelectValue()
89-
{
90-
if (ParentGroup is not null)
91-
{
92-
await ParentGroup.SetValue(Value);
60+
<script>
61+
(function() {
62+
const radio = document.getElementById('static-radio-@_elementId');
63+
const svg = document.getElementById('radio-svg-@_elementId');
64+
65+
const checkedIcon = '@(CheckedIcon)';
66+
const uncheckedIcon = '@(UncheckedIcon)';
67+
68+
if (radio && svg) {
69+
const handleChange = () => {
70+
svg.innerHTML = radio.checked ? checkedIcon : uncheckedIcon;
71+
};
72+
73+
radio.addEventListener('change', handleChange);
74+
75+
document.addEventListener('change', (e) => {
76+
if (e.target.type === 'radio' && e.target.name === radio.name && e.target !== radio) {
77+
handleChange();
78+
}
79+
});
9380
}
94-
}
95-
}
81+
})();
82+
</script>

‎src/Components/MudStaticRadioGroup.razor‎

Lines changed: 20 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,41 @@
11
@namespace MudBlazor.StaticInput
2+
@using MudBlazor.Interfaces
23

34
@typeparam T
45
@inherits MudRadioGroup<T>
56

6-
<MudInputControl Class="@Classname"
7-
Style="@Style"
8-
Error="@HasErrors"
9-
ErrorText="@GetErrorText()"
10-
Required="@Required">
7+
<MudInputControl Class="@Classname" Style="@Style" Error="@HasErrors" ErrorText="@GetErrorText()" Required="@Required">
118
<InputContent>
12-
<CascadingValue Value="this">
13-
<div class="mud-input-control mud-input-control-boolean-input">
14-
<div class="mud-input-control-input-container">
15-
<div class="mud-radio-group" role="radiogroup">
16-
@ChildContent
17-
</div>
18-
</div>
19-
</div>
9+
<CascadingValue Value="this" IsFixed="false">
10+
<CascadingValue TValue="IForm" Value="null">
11+
<CascadingValue TValue="bool" Name="ParentDisabled" Value="@GetDisabledState()">
12+
<CascadingValue TValue="bool" Name="ParentReadOnly" Value="@GetReadOnlyState()">
13+
<div role="radiogroup" @attributes="UserAttributes" class="@GetInputClass()" style="@InputStyle" required="@Required"
14+
aria-required="@Required.ToString().ToLowerInvariant()">
15+
@ChildContent
16+
</div>
17+
</CascadingValue>
18+
</CascadingValue>
19+
</CascadingValue>
2020
</CascadingValue>
2121
</InputContent>
2222
</MudInputControl>
2323

2424
@code {
25+
[CascadingParameter(Name = "ParentDisabled")]
26+
private bool ParentIsDisabled { get; set; }
27+
28+
[CascadingParameter(Name = "ParentReadOnly")]
29+
private bool ParentIsReadOnly { get; set; }
30+
2531
[Parameter]
2632
public Expression<Func<T?>>? ValueExpression { get; set; }
2733

2834
public string GroupName { get; private set; } = Guid.NewGuid().ToString();
2935

3036
protected override void OnInitialized()
3137
{
32-
if (For != null)
38+
if (For is not null)
3339
{
3440
string expression = For.ToString();
3541
int index = expression.LastIndexOf(").", StringComparison.Ordinal);
@@ -46,16 +52,4 @@
4652

4753
base.OnInitialized();
4854
}
49-
50-
internal async Task SetValue(T? newValue)
51-
{
52-
if (Value?.Equals(newValue) != true)
53-
{
54-
Value = newValue;
55-
56-
await ValueChanged.InvokeAsync(newValue);
57-
58-
StateHasChanged();
59-
}
60-
}
6155
}

‎src/Components/MudStaticRadioGroup.razor.cs‎

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,22 @@
11
using Microsoft.AspNetCore.Components;
2+
using MudBlazor.Utilities;
23

3-
namespace MudBlazor.StaticInput
4+
namespace MudBlazor.StaticInput;
5+
6+
public partial class MudStaticRadioGroup<T> : MudRadioGroup<T>
47
{
5-
public partial class MudStaticRadioGroup<T> : MudRadioGroup<T>
6-
{
7-
/**********************************************
8-
* Hide these inherited properties to prevent *
9-
* consumers from modifying them directly. *
10-
**********************************************/
11-
protected new T? Value { get; set; }
12-
protected new EventCallback<T?> ValueChanged { get; set; }
13-
}
8+
/**********************************************
9+
* Hide these inherited properties to prevent *
10+
* consumers from modifying them directly. *
11+
**********************************************/
12+
protected new T? Value { get; set; }
13+
protected new EventCallback<T?> ValueChanged { get; set; }
14+
15+
private string GetInputClass() =>
16+
new CssBuilder("mud-radio-group")
17+
.AddClass(InputClass)
18+
.Build();
19+
20+
internal bool GetDisabledState() => Disabled || ParentIsDisabled;
21+
internal bool GetReadOnlyState() => ReadOnly || ParentIsReadOnly;
1422
}

0 commit comments

Comments
 (0)