Connected/Connected.Components
14
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request 'Checkbox - working example -- NumberInput,TextInput - InputAttributes initialization moved to InputBase class' (#8) from features/rewrite/checkbox into features/rewrite/main

Browse Source 
Reviewed-on: #8
This commit is contained in:
Matija Koželj 2023-02-17 09:46:18 +00:00
commit 42d67dee07
14 changed files with 169 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/Connected.Components.Showcase.Runner/Pages/Index.razor
View File

@ -6,13 +6,21 @@
<p>SelectedValue: @SelectedValue.ToString()</p>
<SimpleSelect
Items="@items"
Label="Simple select"
@bind-Value=@SelectedValue
/>
<RadioGroup Name="Group1">
<Radio Id="radio1" Label="Group 1, Radio 1"></Radio>
<Radio Id="radio2" Label="Group 1, Radio 2"></Radio>
<Radio Id="radio3" Label="Group 1, Radio 3"></Radio>
<Radio Id="radio4" Label="Group 1, Radio 4"></Radio>
<Radio Id="radio5" Label="Group 1, Radio 5" Disabled=true></Radio>
</RadioGroup>
<RadioGroup Name="Group2" Disabled=true>
<Radio Id="radio21" Label="Group 2, Radio 1"></Radio>
<Radio Id="radio22" Label="Group 2, Radio 2"></Radio>
<Radio Id="radio23" Label="Group 2, Radio 3"></Radio>
<Radio Id="radio24" Label="Group 2, Radio 4"></Radio>
<Radio Id="radio25" Label="Group 2, Radio 5"></Radio>
</RadioGroup>
@code {
int SelectedValue;

13
src/Connected.Components/Components/CheckBox.razor Normal file
View File

@ -0,0 +1,13 @@
@using Connected.Models;
@inherits InputBase;
<div class="checkbox-group">
@if (Checked)
{
<input id="@Id" name="checkbox" type="checkbox" @onchange="OnChange" @attributes=@InputAttributes checked>
} else {
<input id="@Id" name="checkbox" type="checkbox" @onchange="OnChange" @attributes=@InputAttributes>
}
<label for="@Id" class="checkbox-label">@Label</label>
</div>

21
src/Connected.Components/Components/CheckBox.razor.cs Normal file
View File

@ -0,0 +1,21 @@
using Connected.Models;
using Microsoft.AspNetCore.Components;
namespace Connected.Components;
public partial class CheckBox: InputBase
{
[Parameter]
public bool Checked { get; set; } = false;
[Parameter, EditorRequired]
public string Id { get; set; }
[Parameter]
public EventCallback<bool> CheckedChange { get; set; }
public async Task OnChange(ChangeEventArgs args)
{
Checked = (bool)args.Value;
CheckedChange.InvokeAsync(Checked);
}
}

9
src/Connected.Components/Components/CheckBoxGroup.razor Normal file
View File

@ -0,0 +1,9 @@
@using Connected.Models;
@inherits InputBase;
<div>
<div class="container">
@ChildContent
</div>
</div>

11
src/Connected.Components/Components/CheckBoxGroup.razor.cs Normal file
View File

@ -0,0 +1,11 @@
using Microsoft.AspNetCore.Components;
namespace Connected.Components;
public partial class CheckBoxGroup
{
[Parameter, EditorRequired]
public string Id { get; set; }
[Parameter]
public RenderFragment ChildContent { get; set; }
}

11
src/Connected.Components/Components/NumberInput.razor.cs
View File

@ -228,5 +228,14 @@ public partial class NumberInput<NumberType>:InputBase where NumberType : INumbe
await base.OnParametersSetAsync();
}
#endregion
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
if (Required)
{
if (!InputAttributes.ContainsKey("required")) InputAttributes.Add("required", true);
}
}
#endregion
}

8
src/Connected.Components/Components/Radio.razor Normal file
View File

@ -0,0 +1,8 @@
@using Connected.Models;
@inherits InputBase;
<div class="radio-group">
<input id="@Id" name="@ParentRadioGroup.Name" type="radio" @onchange="OnChange" @attributes=@InputAttributes>
<label for="@Id" class="radio-label">@Label</label>
</div>

31
src/Connected.Components/Components/Radio.razor.cs Normal file
View File

@ -0,0 +1,31 @@
using Connected.Models;
using Microsoft.AspNetCore.Components;
namespace Connected.Components;
public partial class Radio: InputBase
{
[CascadingParameter]
public RadioGroup? ParentRadioGroup { get; set; }
[Parameter]
public bool Checked { get; set; } = false;
[Parameter, EditorRequired]
public string Id { get; set; }
[Parameter]
public EventCallback<bool> CheckedChange { get; set; }
public async Task OnChange(ChangeEventArgs args)
{
Checked = (bool)args.Value;
CheckedChange.InvokeAsync(Checked);
}
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
if (ParentRadioGroup.Disabled) Disabled = true;
if (!InputAttributes.ContainsKey("disabled"))
InputAttributes.Add("disabled", Disabled);
}
}

15
src/Connected.Components/Components/RadioGroup.razor Normal file
View File

@ -0,0 +1,15 @@
@using Connected.Models;
@inherits InputBase;
<CascadingValue Value="this">
<div>
@if (!string.IsNullOrEmpty(Name))
{
<h5>@Name</h5>
}
<div class="container">
@ChildContent
</div>
</div>
</CascadingValue>

12
src/Connected.Components/Components/RadioGroup.razor.cs Normal file
View File

@ -0,0 +1,12 @@
using Microsoft.AspNetCore.Components;
namespace Connected.Components;
public partial class RadioGroup
{
[Parameter, EditorRequired]
public string Name { get; set; }
[Parameter]
public RenderFragment ChildContent { get; set; }
}

4
src/Connected.Components/Components/SimpleSelect.razor
View File

@ -7,7 +7,6 @@
@if (Items is not null)
{
<div class="@InputFieldClassList">
<select type="textarea" style="height:0px;" @attributes=@InputAttributes>
</select>
@if (IsLabel)
@ -42,8 +41,7 @@
<input type="text"
placeholder="Enter search string..."
class="dropdown-item"
@bind-value="@SearchText"
/>
@bind-value="@SearchText" />
}
@foreach (ValueType item in Items)
{

36
src/Connected.Components/Components/SimpleSelect.razor.cs
View File

@ -29,30 +29,13 @@ public partial class SimpleSelect<ValueType> : InputBase
}
}
private string DropDownClass { get; set; } = "drop-down";
bool DropDownClicked = false;
public void DropDownClassToggle()
{
DropDownClicked = !DropDownClicked;
if (DropDownClicked)
{
DropDownClass = "";
} else
{
DropDownClass = "drop-down";
}
StateHasChanged();
}
private async Task SetSelectedItem(ValueType item)
{
//DropDownClassToggle();
await ValueChanged.InvokeAsync(item);
}
private async Task FilterItems()
private void FilterItems()
{
if (string.IsNullOrEmpty(_searchText))
{
@ -76,13 +59,18 @@ public partial class SimpleSelect<ValueType> : InputBase
protected override async Task OnParametersSetAsync()
{
if (base.InputAttributes is null) base.InputAttributes = new();
if (base.Required)
{
if (base.InputAttributes.ContainsKey("required")) base.InputAttributes.Add("required", true);
}
OriginalItems = Items;
if (_searchText.Length>0) await FilterItems();
if (_searchText.Length>0) FilterItems();
await base.OnParametersSetAsync();
}
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
if (Required)
{
if (InputAttributes.ContainsKey("required")) InputAttributes.Add("required", true);
}
}
}

15
src/Connected.Components/Components/TextInput.razor.cs
View File

@ -56,14 +56,13 @@ public partial class TextInput: InputBase
}
protected override async Task OnParametersSetAsync()
{
if (base.InputAttributes is null) base.InputAttributes = new();
if (base.Required)
{
if (base.InputAttributes.ContainsKey("required")) base.InputAttributes.Add("required", true);
}
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
}
if (Required)
{
if (!InputAttributes.ContainsKey("required")) InputAttributes.Add("required", true);
}
}
}

7
src/Connected.Components/Models/InputBase.cs
View File

@ -1,7 +1,5 @@
using Connected.Utilities;
using Microsoft.AspNetCore.Components;
using static Connected.Colors;
using static System.Net.Mime.MediaTypeNames;
namespace Connected.Models;
public class InputBase : ComponentBase
@ -124,4 +122,9 @@ public class InputBase : ComponentBase
[Parameter]
public string Placeholder { get; set; } = string.Empty;
protected override async Task OnInitializedAsync()
{
if (InputAttributes is null) InputAttributes = new();
}
}