using Connected.Annotations;
using Connected.Extensions;
using Connected.Utilities;
using Microsoft.AspNetCore.Components;

namespace Connected.Components;
public partial class Container : UIComponent
{
	protected string Classname =>
	new CssBuilder("container")
	  .AddClass($"container-fixed", Fixed)
	  .AddClass($"container-maxwidth-{MaxWidth.ToDescriptionString()}", !Fixed)
	  .AddClass(Class)
	.Build();

	/// <summary>
	/// Set the max-width to match the min-width of the current breakpoint. This is useful if you'd prefer to design for a fixed set of sizes instead of trying to accommodate a fully fluid viewport. It's fluid by default.
	/// </summary>
	[Parameter]
	[Category(CategoryTypes.Container.Behavior)]
	public bool Fixed { get; set; } = false;

	/// <summary>
	/// Determine the max-width of the container. The container width grows with the size of the screen. Set to false to disable maxWidth.
	/// </summary>
	[Parameter]
	[Category(CategoryTypes.Container.Behavior)]
	public MaxWidth MaxWidth { get; set; } = MaxWidth.Large;

	/// <summary>
	/// Child content of component.
	/// </summary>
	[Parameter]
	[Category(CategoryTypes.Container.Behavior)]
	public RenderFragment ChildContent { get; set; }
}