Drawer - classes, Grid, Item - rework

src/Connected.Components/Components/Button/ButtonBase.cs

@@ -12,6 +12,21 @@ public abstract class ButtonBase : UIComponent
 	/// </summary>
 	[Parameter]
 	public EventCallback<MouseEventArgs> Clicked { get; set; }
+
+	protected async Task OnClick(MouseEventArgs e)
+	{
+		if (Disabled)
+			return;
+
+		if (Clicked.HasDelegate)
+			await Clicked.InvokeAsync(e);
+
+		if (Command?.CanExecute(CommandParameters) ?? false)
+			Command.Execute(CommandParameters);
+
+		Activateable?.Activate(this, e);
+	}
+
 	#endregion
 
 	#region Content placeholders
@@ -64,17 +79,5 @@ public abstract class ButtonBase : UIComponent
 	/// </summary>
 	protected bool PreventOnClickPropagation => string.Compare(HtmlTag, "button", true) == 0;
 
-	protected async Task OnClick(MouseEventArgs e)
-	{
-		if (Disabled)
-			return;
 	
-		if (Clicked.HasDelegate)
-			await Clicked.InvokeAsync(e);
-
-		if (Command?.CanExecute(CommandParameters) ?? false)
-			Command.Execute(CommandParameters);
-
-		Activateable?.Activate(this, e);
-	}
 }

src/Connected.Components/Components/Drawer/Drawer.razor.cs

@@ -163,7 +163,7 @@ public partial class Drawer : UIComponent, IDisposable, INavigationEventReceiver
 			  .AddClass($"drawer--initial", _initial)
 			  .AddClass($"drawer-{Breakpoint.ToDescription()}")
 			  .AddClass($"drawer-clipped-{_clipMode.ToDescription()}")
-			  //.AddClass($"theme-{Color.ToDescription()}", Color != ThemeColor.Default)
+			  .AddClass($"theme-{Color.ToDescription()}", Color != ThemeColor.Default)
 			  .AddClass($"elevation-{Elevation}")
 			  .AddClass($"drawer-{Variant.ToDescription()}")
 			  .AddClass(ClassList);
@@ -237,13 +237,13 @@ public partial class Drawer : UIComponent, IDisposable, INavigationEventReceiver
 	[Parameter]
 	public Anchor Anchor { get; set; } = Anchor.Start;
 
-	/*
+	
 	/// <summary>
 	/// The color of the component. It supports the theme colors.
 	/// </summary>
 	[Parameter]
 	public ThemeColor Color { get; set; } = ThemeColor.Default;
-	*/
+	
 
 	/// <summary>
 	/// Variant of the drawer. It specifies how the drawer will be displayed.

src/Connected.Components/Components/Drawer/DrawerContainer.razor.cs

@@ -73,7 +73,9 @@ public partial class DrawerContainer : UIComponent
 		get
 		{
 			return new CssBuilder()
-			  .AddClass(ClassList);
+				.AddClass(GetDrawerClass(FindLeftDrawer()))
+				.AddClass(GetDrawerClass(FindRightDrawer()))
+				.AddClass(ClassList);
 		}
 	}
 

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

@@ -5,30 +5,7 @@
 @inherits UIComponent
 
 <CascadingValue Value="this" IsFixed="true">
-    <div @attributes="CustomAttributes" class="@Classname">
+    <div @attributes="CustomAttributes" class="@CompiledClassList.Build()">
         @ChildContent
     </div>
 </CascadingValue>
-
-@code {
-
-    protected string Classname =>
-    new CssBuilder("grid")
-      .AddClass($"grid-spacing-xs-{Spacing.ToString()}")
-      .AddClass($"justify-{Justify.ToDescription()}")
-      .AddClass(AdditionalClassList)
-    .Build();
-
-    [Parameter]
-    [Category(CategoryTypes.Grid.Behavior)]
-    public int Spacing { set; get; } = 3;
-    
-    [Parameter]
-    [Category(CategoryTypes.Grid.Behavior)]
-    public Justify Justify { get; set; } = Justify.FlexStart;
-    
-    [Parameter]
-    [Category(CategoryTypes.Grid.Behavior)]
-    public RenderFragment ChildContent { get; set; }
-
-}

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

@@ -0,0 +1,49 @@
+using Connected.Utilities;
+using Connected.Extensions;
+using Microsoft.AspNetCore.Components;
+
+namespace Connected.Components;
+public partial class Grid
+{
+
+	#region Event callbacks
+	#endregion
+
+	#region Content placeholders
+	#endregion
+
+	#region Styling properties
+
+	private CssBuilder CompiledClassList
+	{
+		get
+		{
+			return new CssBuilder("grid")
+			.AddClass($"grid-spacing-xs-{Spacing.ToString()}")
+			.AddClass($"justify-{Justify.ToDescription()}")
+			.AddClass(ClassList);
+		}
+	}
+
+	[Parameter]
+	public int Spacing { set; get; } = 3;
+
+	[Parameter]
+	public Justify Justify { get; set; } = Justify.FlexStart;
+
+	[Parameter]
+	public RenderFragment ChildContent { get; set; }
+
+	/// <summary>
+	/// A space separated list of class names, added on top of the default class list.
+	/// </summary>
+	[Parameter]
+	public string? ClassList { get; set; }
+
+	#endregion
+
+	#region Lifecycle
+	#endregion
+
+
+}

src/Connected.Components/Components/Grid/Item.razor

@@ -1,48 +1,8 @@
 @namespace Connected.Components
-@using Connected.Annotations;
-@using Connected.Utilities
-@using Connected.Extensions
+
 @inherits UIComponent
 
-<div @attributes="CustomAttributes" class="@Classname">
+<div @attributes="CustomAttributes" class="@CompiledClassList.Build()">
     @ChildContent
 </div>
 
-@code { 
-    protected string Classname =>
-    new CssBuilder("grid-item")
-        .AddClass($"grid-item-xs-{xs.ToString()}", xs != 0)
-        .AddClass($"grid-item-sm-{sm.ToString()}", sm != 0)
-        .AddClass($"grid-item-md-{md.ToString()}", md != 0)
-        .AddClass($"grid-item-lg-{lg.ToString()}", lg != 0)
-        .AddClass($"grid-item-xl-{xl.ToString()}", xl != 0)
-        .AddClass($"grid-item-xxl-{xxl.ToString()}", xxl != 0)
-      .AddClass(AdditionalClassList)
-    .Build();
-
-    [CascadingParameter]
-    private Grid Parent { get; set; }
-
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int xs { get; set; }
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int sm { get; set; }
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int md { get; set; }
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int lg { get; set; }
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int xl { get; set; }
-    [Parameter] [Category(CategoryTypes.Item.Behavior)] public int xxl { get; set; }
-
-    // ToDo false,auto,true on all sizes.
-
-    [Parameter]
-    [Category(CategoryTypes.Item.Behavior)]
-    public RenderFragment ChildContent { get; set; }
-
-    protected override void OnInitialized()
-    {
-        // NOTE: we can't throw here, the component must be able to live alone for the docs API to infer default parameters
-        //if (Parent == null)
-        //    throw new ArgumentNullException(nameof(Parent), "Item must exist within a Grid");
-        base.OnInitialized();
-    }
-
-}
-

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

@@ -0,0 +1,76 @@
+using Connected.Utilities;
+using Microsoft.AspNetCore.Components;
+
+namespace Connected.Components;
+public partial class Item
+{
+
+	#region Event callbacks
+	#endregion
+
+	#region Content placeholders
+
+	[CascadingParameter]
+	private Grid Parent { get; set; }
+
+	[Parameter] public int xs { get; set; }
+	[Parameter] public int sm { get; set; }
+	[Parameter] public int md { get; set; }
+	[Parameter] public int lg { get; set; }
+	[Parameter] public int xl { get; set; }
+	[Parameter] public int xxl { get; set; }
+
+	[Parameter]
+	public RenderFragment ChildContent { get; set; }
+
+	#endregion
+
+	#region Styling properties
+
+	private CssBuilder CompiledClassList
+	{
+		get
+		{
+			return new CssBuilder("grid-item")
+			  .AddClass($"grid-item-xs-{xs.ToString()}", xs != 0)
+			  .AddClass($"grid-item-sm-{sm.ToString()}", sm != 0)
+			  .AddClass($"grid-item-md-{md.ToString()}", md != 0)
+			  .AddClass($"grid-item-lg-{lg.ToString()}", lg != 0)
+			  .AddClass($"grid-item-xl-{xl.ToString()}", xl != 0)
+			  .AddClass($"grid-item-xxl-{xxl.ToString()}", xxl != 0)
+			  .AddClass(ClassList);
+		}
+	}
+
+	/// <summary>
+	/// A space separated list of class names, added on top of the default class list.
+	/// </summary>
+	[Parameter]
+	public string? ClassList { get; set; }
+
+	#endregion
+
+	#region Lifecycle
+
+	protected override void OnInitialized()
+	{
+		// NOTE: we can't throw here, the component must be able to live alone for the docs API to infer default parameters
+		//if (Parent == null)
+		//    throw new ArgumentNullException(nameof(Parent), "Item must exist within a Grid");
+		base.OnInitialized();
+
+	#endregion
+
+	
+
+	
+
+	// ToDo false,auto,true on all sizes.
+
+	
+
+	
+	}
+
+	
+}