diff --git a/DotnetViewComponents/ViewComponents/ButtonViewComponent.cs b/DotnetViewComponents/ViewComponents/ButtonViewComponent.cs new file mode 100644 index 0000000000..d03162ec02 --- /dev/null +++ b/DotnetViewComponents/ViewComponents/ButtonViewComponent.cs @@ -0,0 +1,37 @@ +namespace DotnetViewComponents.ViewComponents +{ + using Microsoft.AspNetCore.Mvc; + using DotnetViewComponents.ViewModels; + + /// + /// Represents a view component for rendering a button. + /// + public class ButtonViewComponent : ViewComponent + { + /// + /// Invokes the button view component with the specified parameters. + /// + /// The text to be displayed on the button. + /// The asp-controller to dynamically set the controller path of the link. + /// The asp-action to dynamically set the action path of the link.. + /// The asp-all-route-data to dynamically set the extra parameters to the path of the link. + /// The url for the link. + /// The style attributes for the button.The style attributes for the button. + /// The styling class for the button. Receives predefined styles from . Defaults to if no input is passed to it. + /// Indicates whether to prevent double-clicking the button. Defaults to false. + /// An that renders the button view. + public IViewComponentResult Invoke( + string text, + string style, + string styling = ButtonStyle.PRIMARY, + string aspController = null, + string aspAction = null, + Dictionary aspRouteData = null, + bool preventDoubleClick = false) + { + var model = new ButtonViewModel(text, aspController, aspAction, aspRouteData, styling, style, preventDoubleClick); + + return View(model); + } + } +} diff --git a/DotnetViewComponents/ViewModels/ButtonViewModel.cs b/DotnetViewComponents/ViewModels/ButtonViewModel.cs new file mode 100644 index 0000000000..583bc333c9 --- /dev/null +++ b/DotnetViewComponents/ViewModels/ButtonViewModel.cs @@ -0,0 +1,78 @@ +namespace DotnetViewComponents.ViewModels +{ + public class ButtonViewModel + { + /// + /// Initializes a new instance of the class. + /// + /// The text to be displayed on the button. + /// The asp-controller to dynamically set the controller path of the link. + /// The asp-action to dynamically set the action path of the link.. + /// The asp-all-route-data to dynamically set the extra parameters to the path of the link. + /// The url for the link. + /// The style attributes for the button. + /// The styling class for the button. Defaults to . + /// Indicates whether to prevent double-clicking the button. Defaults to false. + public ButtonViewModel( + string text, + string aspController, + string aspAction, + Dictionary aspRouteData, + string styling, + string style, + bool preventDoubleClick) + { + Text = text; + AspController = aspController; + AspAction = aspAction; + AspRouteData = aspRouteData; + Styling = styling; + Style = style; + PreventDoubleClick = preventDoubleClick; + } + + /// + /// Gets or sets the text displayed on the button. + /// + public string Text { get; set; } + + /// + /// Gets or sets the asp-controller of the link. + /// + public string AspController { get; set; } + + /// + /// Gets or sets the as-action of the link. + /// + public string AspAction { get; set; } + + /// + /// Gets or sets the asp-all-route-data of the link. + /// + public Dictionary AspRouteData { get; set; } + + /// + /// Gets or sets the styling for the button. + /// + public string Styling { get; set; } + + /// + /// Gets or sets the style attributes on the button. + /// + public string Style { get; set; } + + /// + /// Gets or sets a value indicating whether to prevent double-clicking the button. + /// + public bool PreventDoubleClick { get; set; } + + } + + public static class ButtonStyle + { + public const string PRIMARY = "nhsuk-button"; + public const string SECONDARY = "nhsuk-button nhsuk-button--secondary"; + public const string REVERSE = "nhsuk-button nhsuk-button--reverse"; + public const string WARNING = "nhsuk-button nhsuk-button--warning"; + } +} diff --git a/DotnetViewComponents/Views/Shared/Components/Button/Default.cshtml b/DotnetViewComponents/Views/Shared/Components/Button/Default.cshtml new file mode 100644 index 0000000000..6562500906 --- /dev/null +++ b/DotnetViewComponents/Views/Shared/Components/Button/Default.cshtml @@ -0,0 +1,19 @@ +@using DotnetViewComponents.ViewModels +@model ButtonViewModel + +@{ + var isLink = !String.IsNullOrWhiteSpace(Model.AspController); + var tagType = isLink ? "a" : "button"; + var canSubmit = isLink ? "role=\"button\"" : "type =\"submit\""; + var undecorate = isLink ? "text-decoration: none;" : ""; + var url = Url.Action(Model.AspAction, Model.AspController, Model.AspRouteData); + var href = isLink ? $"href=\"{url}\"" : ""; + var preventDoubleClick = @Model.PreventDoubleClick ? "data-prevent-double-click=true" : ""; + + var buttonOpening = $"<{tagType} class=\"{Model.Styling}\" data-module=\"nhsuk-button\" {href} {preventDoubleClick} {canSubmit} style=\"{undecorate}{Model.Style}\">"; + var buttonClosing = $""; +} + +@Html.Raw(buttonOpening) + @Model.Text +@Html.Raw(buttonClosing)