.gitignore

@@ -431,8 +431,3 @@ FodyWeavers.xsd
 **.Runner/**
 
 **.DS_Store
-/src/Connected.Components/Models/Alert/AlertOptions.cs
-/src/Connected.Components/Components/DatePicker.razor.cs
-/src/Connected.Components/Components/FormWizard.razor
-/src/Connected.Components/Components/FormWizard.razor.cs
-/src/Connected.Components.Showcase.Runner/Program.cs

src/Connected.Components.Showcase.Runner/Connected.Components.Showcase.Runner.csproj

@@ -22,9 +22,4 @@
 		<Watch Remove="..\..\src\**\bin\**" />
 	</ItemGroup>
 
-
-	<ItemGroup>
-	  <Watch Remove="Program.cs" />
-	</ItemGroup>
-
 </Project>

src/Connected.Components.Showcase.Runner/Pages/Democomp.razor

@@ -944,7 +944,7 @@
             <!-- TO DO when modal is open add class to body .scroll-disabled-->
             
             <!-- Button trigger modal -->
-            <button type="button" class="btn btn-primary" @onclick="ToggleModal" data-bs-target="#staticBackdrop">
+            <button type="button" class="btn btn-primary" @onclick="ToggleNav" data-bs-target="#staticBackdrop">
             Launch backdrop modal
             </button>
 
@@ -960,7 +960,7 @@
                     ssss
                 </div>
                 <div class="modal-footer">
-                                <button type="button" class="btn btn-secondary" @onclick="ToggleModal">Close</button>
+                    <button type="button" class="btn btn-secondary" @onclick="ToggleNav">Close</button>
                     <button type="button" class="btn btn-core">Understood</button>
                 </div>
                 </div>
@@ -1168,13 +1168,6 @@
         NavClosed = string.IsNullOrWhiteSpace(NavClosed) ? "show" : "";
     }
 
-    private string ModalShown { get; set; } = "";
-
-    private void ToggleModal()
-    {
-        ModalShown = string.IsNullOrWhiteSpace(ModalShown) ? "show" : "";
-    }
-
 
     private string NextSlide { get; set; } = "";
 

src/Connected.Components.Showcase.Runner/Pages/Index.razor

@@ -5,23 +5,6 @@
 
 <h1 style="text-align:center;">Component Sandbox</h1>
 
-<Grid>
-    @for (int i = 0; i < 5; i++)
-    {
-        int num = i;
-        <GridRow>
-            <GridRowContent>
-                Fixed content @num.ToString()
-            </GridRowContent>
-            <GridRowContent Collapsable=true>
-                Collapsable content @num.ToString()
-            </GridRowContent>
-        </GridRow>
-    }
-</Grid>
-
-<p>Izbran datum je: @date</p>
-
 <FormWizard Id="Wizard1">
     <FormWizardStep Name="Step1">
         Step1

src/Connected.Components/Components/DatePicker.razor

@@ -1,8 +1,15 @@
 @using System.Globalization;
 
+      
+
 @if (loaded)
 {
     <div id="picker">
+
+        <!-- DatePicker input !can be edited manualy -->
+        @* <div class="inline-block"><input type="text" value="@SelectedDate.ToString(Format)" /><i class='bx bx-calendar' @onclick="(() => Shown = !Shown)"></i></div> *@
+
+
         <div class="form-group">
             <input type="text" value="@SelectedDate.ToString(Format)" required="required" /><span class="highlight"></span><span class="bar"></span>
             <label class="label-animated">Select date</label>
@@ -10,7 +17,7 @@
             <div class="input-error-text">At least 6 characters required</div>
             <span class="input-glyph-wraper">
                 <span class="input-glyph">
-                    <span class="input-glyph button" @onclick="TogglePicker">
+                    <span class="input-glyph button" @onclick="(() => Shown = !Shown)">
                         <Glyph SVG="@Icons.Material.Filled.CalendarMonth" class="icon-root svg-icon" />
                     </span>
                     <span class="input-glyph error">
@@ -22,101 +29,149 @@
 
 
         @if (Shown)
-        {
+        { 
             <!-- DatePicker header -->
             <div class="picker-container">
-                <div id="picker-header">
+            <div id="picker-header">
-
+                @* <div class="text-medium">
-                    <div class="picker-header-label">Select date</div>
+                    @SelectedDate.Year.ToString()
-                    <div class="picker-header-title">
+                </div> *@
-                        @SelectedDate.ToString("ddd, " + Format)
+                <div class="picker-header-label">Select date</div>
-                    </div>
+                <div class="picker-header-title">
-                </div>
+                    @SelectedDate.ToString("ddd, " + Format)
-                <div class="picker-divider"></div>
-                <!-- DatePicker body -->
-                <div id="picker-body">
-                    @switch (Selecting)
-                    {
-                        case Selecting.Years:
-                            {
-
-                                <div class="picker-menu">
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick(false))" />
-                                    </button>
-                                    <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Months)>@SelectedDate.ToString("yyyy")</div>
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick())" />
-                                    </button>
-                                </div>
-                                <div class="picker-grid-col-3 gap-3">
-                                    @for (int i = SelectedDate.Year - 7; i < SelectedDate.Year + 8; i++)
-                                    {
-                                        int y = i;
-                                        <button @onclick="@(()=>SetYear(y))" type="button" class="item @YearChipClass(y)">@i.ToString()</button>
-                                    }
-                                </div>
-                                break;
-                            }
-                        case Selecting.Months:
-                            {
-                                <div class="picker-menu">
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick(false))" />
-                                    </button>
-                                    <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Years)>@SelectedDate.ToString("MMMM yyyy")</div>
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick())" />
-                                    </button>
-                                </div>
-                                <div class="picker-grid-col-3 gap-3">
-                                    @for (int i = 1; i <= @DateTimeFormatInfo.CurrentInfo.MonthNames.Length - 1; i++)
-                                    {
-                                        int m = i;
-                                        <button @onclick="@(()=>SetMonth(m))" type="button" class="item @MonthChipClass(i)">@DateTimeFormatInfo.CurrentInfo.GetMonthName(i).Substring(0,3)</button>
-                                    }
-                                </div>
-                                break;
-                            }
-                        case (Selecting.Days):
-                            {
-                                <div class="picker-menu">
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick(false))" />
-                                    </button>
-                                    <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Months)>@SelectedDate.ToString("MMMM yyyy")</div>
-                                    <button class="btn btn-icon-alt ">
-                                        <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" Click="(()=>NavBarClick())" />
-                                    </button>
-                                </div>
-                                <div class="picker-grid-col-7 gap-3">
-                                    @for (int i = 0; i < 7; i++)
-
-                                    {
-                                        <div class="days">@CalendarStart.AddDays(i).ToString("ddd").Substring(0,1)</div>
-                                    }
-
-                                    @foreach (var Date in ShowingDates)
-                                    {
-                                        <button class="item @DateChipClass(Date)" @onclick="@(()=>SetDate(Date))">
-                                            @Date.Day.ToString()
-                                        </button>
-                                        CalendarStart = CalendarStart.AddDays(1);
-                                    }
-                                </div>
-                                break;
-
-                            }
-                    }
-                </div>
-                <!-- Bottom bar -->
-                <div class="btn-content  justify-flex-end my-0">
-                    <button type="button" class="btn btn-sm btn-secondary" @onclick="(()=>ClosePicker())">Cancel</button>
-                    <button type="button" class="btn btn-sm  btn-core" @onclick="(()=>ClosePicker(false))">OK</button>
-                </div>
-                <div>
                 </div>
             </div>
+            <div class="picker-divider"></div>
+            <!-- DatePicker body -->
+            <div id="picker-body">
+                @switch (Selecting)
+                {
+                    case Selecting.Years:
+                        {
+                  
+                            <div class="picker-menu">
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                                <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Months)>@SelectedDate.ToString("yyyy")</div>
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                            </div>
+                            <div class="picker-grid-col-3 gap-3">
+                                @for (int i = SelectedDate.Year - 7; i < SelectedDate.Year + 8; i++)
+                                {
+                                    int y = i;
+                                    @* <a href="#" @onclick="@(()=>SetYear(y))">
+                                        <div class="chip-group-content d-inline-flex bg-core py-1 m-1 b-1 b-r-3 text-dark" style="width:30%;">
+                                            <div class="chip-leading-icon"></div>
+                                            <div class="chip-label">@i.ToString()</div>
+                                            <div class="chip-cta-icon"></div>
+                                        </div>
+
+                                    </a>
+                                    if (SelectedDate.Year - i % 3 == 0)
+                                    {
+                                        <br />
+                                    } *@
+                                <button @onclick="@(()=>SetYear(y))" type="button" class="item">@i.ToString()</button>
+                                }
+                            </div>
+                            break;
+                        }
+                    case Selecting.Months:
+                        {
+             
+
+                            <div class="picker-menu">
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                                <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Years)>@SelectedDate.ToString("MMMM yyyy")</div>
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                            </div>
+                            <div class="picker-grid-col-3 gap-3">
+                                @for (int i = 1; i <= @DateTimeFormatInfo.CurrentInfo.MonthNames.Length - 1; i++)
+                                {
+                                    int m = i;
+                                    @* <a href="#" @onclick="@(()=>SetMonth(m))">
+
+                                        <div class="chip-group-content d-inline-flex bg-core @MonthChipClass(m) py-1 m-1 b-1 b-r-3 text-dark" style="width:30%;">
+                                            <div class="chip-leading-icon"></div>
+                                            <div class="chip-label">@DateTimeFormatInfo.CurrentInfo.GetMonthName(i).Substring(0,3)</div>
+                                            <div class="chip-cta-icon"></div>
+                                        </div>
+
+                                    </a>
+                                
+                                
+                                    if (i % 3 == 0)
+                                    {
+                                        <br />
+                                    } *@
+                                <button @onclick="@(()=>SetMonth(m))" type="button" class="item">@DateTimeFormatInfo.CurrentInfo.GetMonthName(i).Substring(0,3)</button>
+
+                                }
+                             </div>
+                            break;
+                        }
+                    case (Selecting.Days):
+                        {
+                            <div class="picker-menu">
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowLeft" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                                <div class="text-semibold" @onclick=@(()=>Selecting = Selecting.Months)>@SelectedDate.ToString("MMMM yyyy")</div>
+                                <button class="btn btn-icon-alt "> 
+                                     <Glyph SVG="@Icons.Material.Filled.KeyboardArrowRight" class="icon-root svg-icon icon-size-md" />
+                                </button> 
+                            </div>
+                            <div class="picker-grid-col-7 gap-3">
+                                @for (int i = 0; i < 7; i++)
+                            
+                                {
+                                
+                                    @* <div class="@DayNamesRowClass">@CalendarStart.AddDays(i).ToString("ddd").Substring(0,1)</div> *@
+                                    <div class="days">@CalendarStart.AddDays(i).ToString("ddd").Substring(0,1)</div>
+                                
+                                }
+                            
+                                @foreach (var Date in ShowingDates)
+                                {
+                                    <button class="item @DateChipStyle(Date)" @onclick="@(()=>SetDate(Date))">
+                                        @* <div class="chip-leading-icon d-inline-block p-1 m-1 @DateChipStyle(Date)" style="width:30px; height:30px; text-align:center">
+                                            @Date.Day.ToString()
+                                        </div> *@
+
+                                        
+                                            @Date.Day.ToString()
+                                        
+                                    </button>
+                                    @if (CalendarStart.DayOfWeek.Equals(DayOfWeek.Sunday))
+                                    {
+                                        @* <br /> *@
+                                    }
+
+                                    CalendarStart = CalendarStart.AddDays(1);
+                                }
+                            </div>
+                            break;
+                       
+                        }
+                         
+                }
+            </div>
+            <!-- Bottom bar -->
+                <div class="btn-content  justify-flex-end my-0">                                    
+                    <button type="button" class="btn btn-sm btn-secondary">Cancel</button>
+                    <button type="button" class="btn btn-sm  btn-core">OK</button>
+                </div>
+            <div>
+                
+            </div>
+        </div>
         }
     </div>
-}
+}

src/Connected.Components/Components/DatePicker.razor.cs

@@ -1,4 +1,5 @@
-using Microsoft.AspNetCore.Components;
+using Connected.Utilities;
+using Microsoft.AspNetCore.Components;
 
 namespace Connected.Components;
 public partial class DatePicker
@@ -17,8 +18,6 @@ public partial class DatePicker
 	[Parameter]
 	public DateTime SelectedDate { get; set;  } = DateTime.Today;
 
-	private DateTime _InitialDate {  get; set; }
-
 	[Parameter]
 	public DateTime? SelectedEndDate { get; set; } = null;
 
@@ -33,9 +32,6 @@ public partial class DatePicker
 	[Parameter]
 	public bool UseDateRange { get; set; } = false;
 
-	[Parameter]
-	public bool ShowBottomBar { get; set; } = false;
-
 	[Parameter]
 	public string Format { get; set; } = "dd.MM.yyyy";
 
@@ -82,6 +78,48 @@ public partial class DatePicker
 		StateHasChanged();
 	}
 
+	private string DayNamesRowClass
+	{
+		get
+		{
+			return new CssBuilder()
+				.AddClass("chip-leading-icon")
+				.AddClass("d-inline-block")
+				.AddClass("m-1")
+				.AddClass("bg-danger")
+				.AddClass("text-small")
+				.AddClass("text-white")
+				.Build();
+		}
+	}
+	private string ChipFirstRowStyle
+	{
+		get
+		{
+			return new StyleBuilder()
+				.AddStyle("width", "30px")
+				.AddStyle("height", "30px")
+				.AddStyle("text-align", "center")
+				.Build();
+		}
+	}
+	/*
+	 @for (int i=0;i<7; i++)
+            {
+                <div class="chip-leading-icon d-inline-block p-1 bg-danger text-small text-light" style="width:30px; height:30px; text-align:center">@calendarStart.AddDays(i).ToString("ddd").Substring(0,1)</div>
+            }
+            @while (calendarStart.CompareTo(calendarEnd) < 0)
+            {
+                <a href="#" @onclick="@(()=>SetDate(calendarStart))"><div class="chip-leading-icon d-inline-block p-1 @ChipStyle(calendarStart)" style="width:30px; height:30px; text-align:center">@calendarStart.Day.ToString()</div></a>
+                @if (calendarStart.DayOfWeek.Equals(DayOfWeek.Sunday))
+                {
+                    <br />
+                }
+                calendarStart = calendarStart.AddDays(1);
+            } 
+	 
+	 */
+
 	public void SetStartStop()
 	{
 		CalendarStart = SelectedDate;
@@ -112,7 +150,7 @@ public partial class DatePicker
 		}
 	}
 
-	public string DateChipClass(DateTime date)
+	public string DateChipStyle(DateTime date)
 	{
 		string result = "";
 		if (date.Month.CompareTo(SelectedDate.Month) < 0 || date.Month.CompareTo(SelectedDate.Month) > 0) return "d-none";
@@ -130,66 +168,38 @@ public partial class DatePicker
 	public string MonthChipClass(int month)
 	{
 		if (month.CompareTo(SelectedDate.Month) == 0)
-			return "active";
+			return "bg-info text-light";
 		else
-			return "";
+			return "bg-core text-dark";
 	}
 
 	public string YearChipClass(int year)
 	{
 		if (year.CompareTo(SelectedDate.Year) == 0)
-			return "active";
+			return "bg-info text-light";
 		else
-			return "";
+			return "bg-core text-dark";
 	}
 
 	protected override async Task OnInitializedAsync()
 	{
 		SelectedDate = DateTime.Today;
-		_InitialDate=SelectedDate;
 		SetStartStop();
 		loaded = true;
 		await base.OnInitializedAsync();
 	}
 
-	private async Task ClosePicker(bool resetDate=true)
+	private string NavBarClass
 	{
-		if (resetDate)
+		get
-			SelectedDate=_InitialDate;
-		Shown = false;
-		await SelectedDateChanged.InvokeAsync(SelectedDate);
-	}
-
-	private void TogglePicker()
-	{
-		_InitialDate=SelectedDate;
-		Shown = !Shown;
-	}
-
-	private async Task NavBarClick(bool forward = true)
-	{
-		int multiplier = 1;
-		if (!forward) multiplier = -1;
-		switch (Selecting)
 		{
-			case Selecting.Years:
+			return new CssBuilder("text-justify")
-				{
+				.AddClass("text-md-justify")
-					SelectedDate=SelectedDate.AddYears(8 * multiplier);
+				//.AddClass("bg-warning")
-					break;
+				.AddClass("text-small")
-				}
+				.AddClass("text-dark")
-			case Selecting.Months:
+				.Build();
-				{
-					SelectedDate = SelectedDate.AddYears(1 * multiplier);
-					break;
-				}
-			case Selecting.Days: 
-				{
-					SelectedDate = SelectedDate.AddMonths(1*multiplier);
-					break;
-				}
 		}
-		SetStartStop();
-		await InvokeAsync(StateHasChanged);
 	}
 
 }

src/Connected.Components/Components/FormWizard.razor

@@ -6,7 +6,7 @@
         </div>
 
         <div class="btn-box text-right my-5 d-flex justify-space-between">
-            <button type="button" href="#" class="btn btn-secondary" aria-pressed="true" disabled="@WizardFinished" @onclick="CancelClick">Cancel</button>
+            <button type="button" href="#" class="btn btn-secondary" aria-pressed="true" disabled="@WizardFinished">Cancel</button>
             <div>
                 <button type="button" @onclick="PreviousSlide" class="btn btn-core mr-2" aria-pressed="true" disabled="@WizardFinished"><i class='bx bx-chevron-left'></i>@PreviousBtnText</button>
                 <button type="button" @onclick="NextSlide" class="btn btn-core mr-2" aria-pressed="true" disabled="@WizardFinished">@NextBtnText<i class='bx bx-chevron-right'></i></button>

src/Connected.Components/Components/FormWizard.razor.cs

@@ -1,7 +1,8 @@
 using Connected.Enums;
 using Connected.Utilities;
 using Microsoft.AspNetCore.Components;
-using System.Reflection.Metadata;
+using System.ComponentModel.DataAnnotations;
+using System.Text;
 
 namespace Connected.Components;
 public partial class FormWizard
@@ -15,26 +16,11 @@ public partial class FormWizard
 	[Parameter]
 	public RenderFragment? ChildContent { get; set; }
 
-	/// <summary>
-	/// Steps of type FormWizardStep
-	/// </summary>
 	[Parameter]
 	public List<FormWizardStep> Steps { get; set; } = new();
 
-	/// <summary>
+	[Parameter, EditorRequired]
-	/// EventCallback for 'Finish' button click
+	public string Id { get; set; }
-	/// </summary>
-	[Parameter]
-	public EventCallback OnFinishedClick { get; set; }
-
-	/// <summary>
-	/// EventCallback for 'Cancel' button click
-	/// </summary>
-	[Parameter]
-	public EventCallback OnCancelClick { get; set; }
-
-	[Parameter]
-	public string Id { get; set; } = Guid.NewGuid().ToString();
 
 	private string NextBtnText = "Next";
 	private string PreviousBtnText = "Previous";
@@ -44,10 +30,10 @@ public partial class FormWizard
 	private FinishedState FinishedState { get; set; } = FinishedState.Unfinished;
 
 	[Parameter]
-	public int ActiveIndex
+	public int ActiveIndex 
 	{
-		get
+		get 
-		{
+		{ 
 			return _activeStepIndex;
 		}
 		set
@@ -56,7 +42,7 @@ public partial class FormWizard
 			{
 				_activeStepIndex = value;
 			}
-		}
+		} 
 	}
 	private int _activeStepIndex = 0;
 
@@ -64,7 +50,7 @@ public partial class FormWizard
 	{
 		get
 		{
-			if (ActiveIndex > 0)
+			if (ActiveIndex>0)
 				return ActiveIndex - 1;
 			return ActiveIndex;
 		}
@@ -76,11 +62,10 @@ public partial class FormWizard
 		{
 			try
 			{
-				if (ActiveIndex < StepCount - 1)
+				if (ActiveIndex < StepCount-1)
 					return ActiveIndex + 1;
 				return ActiveIndex;
-			}
+			} catch
-			catch
 			{
 				return ActiveIndex;
 			}
@@ -95,17 +80,38 @@ public partial class FormWizard
 		}
 	}
 
-	private async Task NextSlide()
+	private void NextSlide()
 	{
 		if (NextBtnText.ToLower().Equals("finish"))
 		{
 			FinishedState = FinishedState.Finished;
 			Steps[ActiveIndex].Completed = true;
 			WizardFinished = true;
-			await OnFinishedClick.InvokeAsync();
 		}
 		if (FinishedState.Equals(FinishedState.Unfinished))
 		{
+			/*if (ActiveIndex < StepCount)
+			{
+				Steps[ActiveIndex].Completed = true;
+				ResetValuesForChild(ActiveIndex);
+				if (ActiveIndex < StepCount)
+					ResetValuesForChild(NextIndex);
+				if (ActiveIndex > 0)
+					ResetValuesForChild(PreviousIndex);
+
+				ActiveIndex = NextIndex;
+				Steps[ActiveIndex].Active = true;
+				Steps[PreviousIndex].IsPrevious = true;
+				if (ActiveIndex != NextIndex)
+					Steps[NextIndex].IsNext = true;
+				else Steps[NextIndex].IsNext = false;
+
+				if (ActiveIndex == NextIndex)
+					NextBtnText = "Finish";
+				else
+					NextBtnText = "Next";
+				StateHasChanged();
+			}*/
 			Steps[ActiveIndex].Completed = true;
 			Steps[ActiveIndex].Active = false;
 			Steps[PreviousIndex].IsPrevious = false;
@@ -126,6 +132,7 @@ public partial class FormWizard
 	{
 		if (ActiveIndex > 0)
 		{
+			//Steps[ActiveIndex].Completed = true;
 			Steps[ActiveIndex].Active = false;
 			Steps[PreviousIndex].IsPrevious = false;
 			Steps[ActiveIndex].IsNext = false;
@@ -139,18 +146,13 @@ public partial class FormWizard
 			else
 				NextBtnText = "Next";
 		}
-		if (ActiveIndex == 0)
+		if (ActiveIndex==0)
 		{
 			ResetAllChildren();
 			Steps[ActiveIndex].Active = true;
 		}
 	}
 
-	private async Task CancelClick()
-	{
-		await OnCancelClick.InvokeAsync();
-	}
-
 	[Parameter]
 	public string Class { get; set; } = string.Empty;
 
@@ -199,22 +201,21 @@ public partial class FormWizard
 		ResetAllChildren();
 		Steps[ActiveIndex].Active = true;
 
-		if (ActiveIndex != 0)
+		if (ActiveIndex!=0)
 		{
 			Steps[ActiveIndex].IsNext = true;
-			Steps[PreviousIndex].IsPrevious = true;
+			Steps[PreviousIndex].IsPrevious= true;
 		}
 		StateHasChanged();
 	}
 
-	/*protected override async Task OnParametersSetAsync()
+	protected override async Task OnParametersSetAsync()
 	{
-		if (Steps is null) Steps = new();
+		if (Steps is not null)
-			Steps.Clear();
+		Steps.Clear();
-		InitializeSteps();
 
 		await base.OnParametersSetAsync();
-	}*/
+	}
 
 	protected override async Task OnAfterRenderAsync(bool firstRender)
 	{

src/Connected.Components/Components/FormWizardStep.razor.cs

@@ -9,11 +9,8 @@ public partial class FormWizardStep
 	[CascadingParameter]
 	public FormWizard Parent { get; set; }
 
-	/// <summary>
+	[Parameter, EditorRequired]
-	/// Unique name of the step (used for properly identifying steps)
+	public string Name { get; set; }
-	/// </summary>
-	[Parameter]
-	public string? Id { get; set; } = Guid.NewGuid().ToString();
 
 	/// <summary>
 	/// Text shown inside the button
@@ -49,7 +46,7 @@ public partial class FormWizardStep
 		get
 		{
 			return new CssBuilder("dot")
-				.AddClass("completed", Completed)
+				.AddClass("completed",Completed)
 				.AddClass("next", Active)
 				.Build();
 		}
@@ -65,7 +62,7 @@ public partial class FormWizardStep
 		get
 		{
 			return new StyleBuilder()
-				.AddStyle("display", "none", (!Active && !IsNext && !IsPrevious)) //Workarround for more than 2 steps where steps didnt hide after
+				.AddStyle("display","none", (!Active && !IsNext && !IsPrevious)) //Workarround for more than 2 steps where steps didnt hide after
 				.AddStyle(Style)
 				.Build();
 		}
@@ -91,17 +88,10 @@ public partial class FormWizardStep
 
 	#region Lifecycle
 
-	private bool ItemExists()
-	{
-		if (Parent.Steps.Where(step => step.Id.Equals(this.Id)).Count() > 0) return true;
-		return false;
-	}
 
-
+	protected override async Task OnInitializedAsync()
-	protected override async Task OnParametersSetAsync()
 	{
-		if (!ItemExists())
+		Parent.Steps.Add(this);
-			Parent.Steps.Add(this);
 		await base.OnInitializedAsync();
 	}
 

src/Connected.Components/Components/Grid.razor

@@ -1,5 +0,0 @@
-<CascadingValue Value="this">
-    <div class="@GridClass">
-        @ChildContent
-    </div>
-</CascadingValue>

src/Connected.Components/Components/Grid.razor.cs

@@ -1,41 +0,0 @@
-using Connected.Utilities;
-using Microsoft.AspNetCore.Components;
-
-namespace Connected.Components;
-public partial class Grid: ComponentBase
-{
-	public List<GridRow> Rows { get; set; } = new();
-	
-	[Parameter]
-	public RenderFragment? ChildContent { get; set; }
-
-	[Parameter]
-	public bool Dense { get; set; } = true;
-
-	[Parameter]
-	public bool ContainsImage { get; set; } = true;
-
-	[Parameter]
-	public bool ShowSelect { get; set; } = true;
-
-	[Parameter]
-	public bool Collapsable { get; set; } = true;
-
-	[Parameter]
-	public string Class { get; set; } = string.Empty;
-
-	private string GridClass
-	{
-		get
-		{
-			return new CssBuilder("data-grid")
-				.AddClass("dense", Dense)
-				.AddClass("image", ContainsImage)
-				.AddClass("select", ShowSelect)
-				.AddClass("collapse", Collapsable)
-				.AddClass(Class)
-				.Build();
-		}
-	}
-
-}

src/Connected.Components/Components/GridRow.razor

@@ -1,23 +0,0 @@
-<CascadingValue Value="this">
-    <div class="@GridRowClass" id="@Guid.NewGuid()">
-        <div class="data-grid-select" >
-            <label class="toggle-group m-0" for="@SwitchButtonId">
-                <input class="toggle-input" id="@SwitchButtonId" name="toggle" type="checkbox" @onchange="(args=>SwitchButtonChange(args))">
-                <div class="toggle-fill"></div>
-            </label>
-        </div>
-
-        <div class="data-grid-img">
-            <img class="img-fluid" src="https://source.unsplash.com/random?face" />
-        </div>
-
-        <!-- Row content -->
-        <div class="data-grid-container">
-            @ChildContent
-        </div>
-
-        <div class="data-grid-collapse-cta" @onclick="ToggleNav">
-            <Glyph SVG="@Icons.Material.Filled.KeyboardArrowDown" class="icon-root svg-icon icon-size-md" />
-        </div>
-    </div>
-</CascadingValue>

src/Connected.Components/Components/GridRow.razor.cs

@@ -1,58 +0,0 @@
-using Connected.Utilities;
-using Microsoft.AspNetCore.Components;
-
-namespace Connected.Components;
-public partial class GridRow : ComponentBase
-{
-
-	[CascadingParameter]
-	public Grid Parent { get; set; }
-
-	public List<GridRowContent> Children { get; set; }
-
-	[Parameter]
-	public RenderFragment? ChildContent { get; set; }
-
-	[Parameter]
-	public bool CollapsedItemShown { get; set; } = false;
-
-	private void ToggleNav()
-	{
-		CollapsedItemShown = !CollapsedItemShown;
-	}
-
-	[Parameter]
-	public string Class { get; set; } = string.Empty;
-
-	[Parameter]
-	public GridRowTemplate? Template { get; set; } = null;
-
-	private string GridRowClass
-	{
-		get
-		{
-			return new CssBuilder("data-grid-row-content")
-				.AddClass("show",CollapsedItemShown)
-				.AddClass(Class)
-				.Build();
-		}
-	}
-
-	[Parameter]
-	public EventCallback<ChangeEventArgs> SwitchButtonChangeEvent { get; set; }
-
-	private async Task SwitchButtonChange(ChangeEventArgs args)
-	{
-		await SwitchButtonChangeEvent.InvokeAsync(args);
-	}
-
-	private string SwitchButtonId = Guid.NewGuid().ToString();
-
-	protected override async Task OnInitializedAsync()
-	{
-		if (Parent.Rows is null) Parent.Rows = new();
-		Parent.Rows.Add(this);
-		await base.OnInitializedAsync();
-	}
-
-}

src/Connected.Components/Components/GridRowContent.razor

@@ -1,3 +0,0 @@
-<div class="@GeneratedRowContentClass">
-    @ChildContent
-</div>

src/Connected.Components/Components/GridRowContent.razor.cs

@@ -1,53 +0,0 @@
-using Connected.Utilities;
-using Microsoft.AspNetCore.Components;
-
-namespace Connected.Components;
-public partial class GridRowContent : ComponentBase
-{
-	[CascadingParameter]
-	public GridRow? Parent { get; set; }
-
-	/// <summary>
-	/// Text shown inside the button
-	/// Options: any string variable
-	/// Default: string.Empty
-	/// </summary>
-	[Parameter]
-	public RenderFragment? ChildContent { get; set; }
-
-	/// <summary>
-	/// Disabled or enabled.
-	/// Default: false
-	/// </summary>
-	[Parameter]
-	public bool Collapsable { get; set; } = false;
-
-	private string GeneratedRowContentClass
-	{
-		get
-		{
-			CssBuilder cssBuilder = new CssBuilder("row");
-
-			cssBuilder.AddClass("collapsed", Collapsable);
-
-			if (Parent is not null)
-			{
-				cssBuilder.AddClass("show", (Collapsable ? Parent.CollapsedItemShown : false));
-			}
-
-			return cssBuilder.Build();
-		}
-	}
-
-	protected override async Task OnInitializedAsync()
-	{
-
-		if (Parent is not null)
-		{
-			if (Parent.Children is null) Parent.Children = new();
-			Parent.Children.Add(this);
-		}
-		await base.OnInitializedAsync();
-	}
-}
-

src/Connected.Components/Enums/Color.cs

@@ -5,7 +5,7 @@ namespace Connected;
 public enum Color
 {
 	[Description("core")]
-	Core,
+   Core,
 
 	[Description("primary")]
 	Primary,

src/Connected.Components/Enums/ThemeProvider.cs

@@ -1,23 +0,0 @@
-using System.ComponentModel;
-
-namespace Connected;
-
-public enum Theme
-{
-	[Description("")]
-	Default,
-
-	[Description("dark")]
-   Dark,
-
-	[Description("light")]
-	Light,
-
-	[Description("pink")]
-	Pink
-}
-
-public static class ThemeProvider
-{
-	public static Theme theme { get; set; } = Theme.Default;
-}

src/Connected.Components/Utilities/GridRowTemplate.cs

@@ -1,5 +0,0 @@
-namespace Connected.Utilities;
-public class GridRowTemplate
-{
-	public Position ImagePosition { get; set; } = Position.Left;
-}

src/connected.components/Models/Alert/AlertOptions.cs

@@ -1,21 +0,0 @@
-namespace Connected.Models.Alert;
-public class AlertOptions
-{
-	Severity Severity { get; set; } = Severity.Info;
-	public bool ShowHeader { get; set; } = true;
-	public bool Cancelable { get; set; } = true;
-
-	public AlertOptions()
-	{
-		Severity = Severity.Info;
-		ShowHeader = true;
-		Cancelable = true;
-	}
-
-	public AlertOptions(Severity severity, bool showHeader, bool cancelable)
-	{
-		Severity = severity;
-		ShowHeader = showHeader;
-		Cancelable = cancelable;
-	}
-}