diff --git a/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ButtonExample.razor b/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ButtonExample.razor new file mode 100644 index 0000000..ad9c628 --- /dev/null +++ b/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ButtonExample.razor @@ -0,0 +1,28 @@ +@page "/button" +@using Connected.Components; +@using Connected.Enums; +@using Connected.Models.Modal; +@using Connected.Models; +@using Connected.Services; +@using Connected.Utilities; + +

BUTTON EXAMPLE

+ + + + + +

Text:

@text

+ +@code { + string text = "Some random text"; + + string Hello = "Hello my friend"; + + private void TextChange(string new_text="Some random text.. but new") + { + text = new_text; + StateHasChanged(); + } + +} \ No newline at end of file diff --git a/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ModalDialogExample.razor b/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ModalDialogExample.razor new file mode 100644 index 0000000..5d187f9 --- /dev/null +++ b/src/Connected.Components.Showcase.Runner/Pages/ComponentsExamples/ModalDialogExample.razor @@ -0,0 +1,92 @@ +@page "/modal" +@using Connected.Components; +@using Connected.Enums; +@using Connected.Models.Modal; +@using Connected.Models; +@using Connected.Services; +@using Connected.Utilities; + +@inject ModalDialogService modalDialog; + + +

MODAL DIALOG EXAMPLE

+ + + + +

Modal result: @test_modal_result

+ +

Value: @value.ToString()

+ + +@code { + int value = 0; + + string test_modal_result = string.Empty; + + ModalOptions options = new ModalOptions(); + + + public void OpenModalDialog() + { + modalDialog.ShowDialog( + /* + MODAL TITLE + * + */ + "Title", + + /* + MODAL CONTENT !!!starting with @ + * + */ + @
+
Change the number input aand watch the value variable behind the modal change
+ +
, + + /* + MODAL BUTTONS WITH ACTIONS + * + */ + new List() + { + new ModalButton( + new Event(ChangeText, new object[]{"OK clicked"}), //event triggered on button click + "OK", //button text + ModalButtonType.OkButton, //button type: OK, Cancel, Regular + true //close modal on click + ), + new ModalButton( + new Event(ChangeText, new object[]{"Cancel clicked"}), //event triggered on button click - first parameter = method name, second parameter = method parameters --> array of objects + "Cancel", //button text + ModalButtonType.CancelButton, //button type: OK, Cancel, Regular + true //close modal on click + ), + new ModalButton( + new Event(ChangeText, new object[]{"Regular clicked"}), //event triggered on button click - first parameter = method name, second parameter = method parameters --> array of objects + "Click me", //button text + ModalButtonType.RegularButton, //button type: OK, Cancel, Regular + true //close modal on click + ) + }, + + /* + MODAL OPTIONS + * + */ + new ModalOptions(false,true,false)); //modal dialog options - optional + } + + private void ChangeValue(int val) + { + value = val; + StateHasChanged(); + } + + public void ChangeText(string some_parameter) + { + test_modal_result = some_parameter; + StateHasChanged(); + } +} \ No newline at end of file diff --git a/src/Connected.Components.Showcase.Runner/Pages/Index.razor b/src/Connected.Components.Showcase.Runner/Pages/Index.razor index 9ed0882..057b2b3 100644 --- a/src/Connected.Components.Showcase.Runner/Pages/Index.razor +++ b/src/Connected.Components.Showcase.Runner/Pages/Index.razor @@ -1,49 +1,20 @@ @page "/" -@using Connected.Models; @using Connected.Components; +@using Connected.Enums; +@using Connected.Models.Modal; +@using Connected.Models; +@using Connected.Services; +@using Connected.Utilities; +

Component Example page

-

Component Sandbox

- - - @for (int i = 0; i < 5; i++) - { - int num = i; - - - Fixed content @num.ToString() - - - Collapsable content @num.ToString() - - - } - - -

Izbran datum je: @date

+ - - - Step1 - - - Step2 - - - Step3 - - - Step4 - - - - - -

Selected date is @date.ToString()

@code { - DateTime date = DateTime.Today; + } \ No newline at end of file diff --git a/src/Connected.Components/Components/Link.razor b/src/Connected.Components/Components/Link.razor index b4863c4..f07b8c7 100644 --- a/src/Connected.Components/Components/Link.razor +++ b/src/Connected.Components/Components/Link.razor @@ -3,4 +3,4 @@ href="@Url" target="@_target"> @Text - + \ No newline at end of file diff --git a/src/Connected.Components/Components/Link.razor.cs b/src/Connected.Components/Components/Link.razor.cs index dfdd460..ca0a8d7 100644 --- a/src/Connected.Components/Components/Link.razor.cs +++ b/src/Connected.Components/Components/Link.razor.cs @@ -1,13 +1,14 @@ using Connected.Enums; using Connected.Utilities; using Microsoft.AspNetCore.Components; +using static Connected.Colors; namespace Connected.Components; public partial class Link { /// /// URL of the link - /// Options: Any valid web page adress + /// Options: Any valid URL adress /// Default: string.Empty /// [Parameter, EditorRequired] @@ -49,7 +50,9 @@ public partial class Link { get { - return new CssBuilder() + return new CssBuilder("btn") + .AddClass("btn-sm") + .AddClass("btn-link-core") .AddClass(Class) .Build(); } diff --git a/src/Connected.Components/Components/ModalDialog.razor.cs b/src/Connected.Components/Components/ModalDialog.razor.cs index 9c41215..0bc8114 100644 --- a/src/Connected.Components/Components/ModalDialog.razor.cs +++ b/src/Connected.Components/Components/ModalDialog.razor.cs @@ -44,6 +44,7 @@ public partial class ModalDialog : IDisposable StateHasChanged(); } + public void CloseModal(ModalButton? button) { if (button is not null) diff --git a/src/Connected.Components/Components/ReturnModal.razor b/src/Connected.Components/Components/ReturnModal.razor new file mode 100644 index 0000000..b9498dc --- /dev/null +++ b/src/Connected.Components/Components/ReturnModal.razor @@ -0,0 +1,22 @@ +@typeparam ReturnType + +@using Connected.Models.Modal; +@if (Visible) +{ + +} \ No newline at end of file diff --git a/src/Connected.Components/Components/ReturnModal.razor.cs b/src/Connected.Components/Components/ReturnModal.razor.cs new file mode 100644 index 0000000..c0c4f11 --- /dev/null +++ b/src/Connected.Components/Components/ReturnModal.razor.cs @@ -0,0 +1,71 @@ +using Connected.Models.Modal; +using Microsoft.AspNetCore.Components; +using Microsoft.AspNetCore.Components.Web; + +namespace Connected.Components; +public partial class ReturnModal +{ + [Parameter] + public bool Visible { get; set; } = false; + + [Parameter] + public EventCallback VisibleChanged { get; set; } + + [Parameter] + public string Title { get; set; } = string.Empty; + + [Parameter] + public RenderFragment? ChildContent { get; set; } + protected bool OverlayClickToClose { get; set; } = true; + + private ReturnType initialValue { get; set; } + + [Parameter] + public ReturnType Value { get; set; } = default; + + [Parameter] + public EventCallback ValueChanged { get; set; } + + protected ModalOptions? ModalOptions { get; set; } + + public async Task CloseModal(bool returnResult = false) + { + Visible = false; + VisibleChanged.InvokeAsync(Visible); + Title = ""; + ChildContent = null; + StateHasChanged(); + if (!returnResult) + await ValueChanged.InvokeAsync(initialValue); + else + initialValue = Value; + } + + + public void CheckEscape(KeyboardEventArgs args) + { + if (!ModalOptions.DisableEscKey) + { + var key = args.Key.ToLower(); + if (key.Equals("escape")) + { + CloseModal(); + } + } + } + + public void CloseIfEnabled(MouseEventArgs args) + { + CloseModal(); + } + + public void PreventClose(MouseEventArgs args) + { + OverlayClickToClose = false; + } + + protected override async Task OnInitializedAsync() + { + initialValue = Value; + } +} \ No newline at end of file diff --git a/src/Connected.Components/Models/Modal/ModalOptions.cs b/src/Connected.Components/Models/Modal/ModalOptions.cs index 4f2443f..efba56e 100644 --- a/src/Connected.Components/Models/Modal/ModalOptions.cs +++ b/src/Connected.Components/Models/Modal/ModalOptions.cs @@ -5,6 +5,21 @@ public class ModalOptions public bool DisableBackdropClick { get; set; } = false; public bool NoHeader { get; set; } = false; + public ModalOptions() + { + } + public ModalOptions(ModalOptions options) + { + DisableBackdropClick = options.DisableBackdropClick; + NoHeader = options.NoHeader; + DisableEscKey = options.DisableEscKey; + } + public ModalOptions(bool disableEscKey, bool disableBackdropClick, bool noHeader) + { + DisableEscKey = disableEscKey; + DisableBackdropClick = disableBackdropClick; + NoHeader = noHeader; + } } diff --git a/src/Connected.Components/Services/ModalDialogService.cs b/src/Connected.Components/Services/ModalDialogService.cs index 5b988ef..581050b 100644 --- a/src/Connected.Components/Services/ModalDialogService.cs +++ b/src/Connected.Components/Services/ModalDialogService.cs @@ -1,6 +1,6 @@ -using Connected.Components; -using Connected.Models.Modal; +using Connected.Models.Modal; using Microsoft.AspNetCore.Components; +using System.ComponentModel; namespace Connected.Services; public class ModalDialogService @@ -8,15 +8,22 @@ public class ModalDialogService public event Action, ModalOptions> OnShow; public event Action OnClose; - public void ShowDialog(string title, RenderFragment content, List buttons, ModalOptions options) + public void ShowDialog(string title, RenderFragment Content, List buttons, ModalOptions options) { - OnShow?.Invoke(title, content, buttons, options); + var body = Content; + OnShow?.Invoke(title, body, buttons, options); } - public void ShowDialog(string title, MarkupString contentMarkup, List buttons, ModalOptions options) + public void ShowDialog(string title, MarkupString content, List buttons, ModalOptions options) { - var content = new RenderFragment(x => x.AddContent(1, contentMarkup)); - OnShow?.Invoke(title, content, buttons, options); + var body = new RenderFragment(x => x.AddContent(1, content)); + OnShow?.Invoke(title, body, buttons, options); + } + + public void ShowDialog(string title, MarkupString content, List buttons) + { + var body = new RenderFragment(x => x.AddContent(1, content)); + OnShow?.Invoke(title, body, buttons, new ModalOptions()); } public void Close() diff --git a/src/Connected.Components/Utilities/Helper.cs b/src/Connected.Components/Utilities/Helper.cs index 4771980..ca038bb 100644 --- a/src/Connected.Components/Utilities/Helper.cs +++ b/src/Connected.Components/Utilities/Helper.cs @@ -1,4 +1,5 @@ -using System; +using Microsoft.AspNetCore.Components; +using System; using System.Collections.Generic; using System.ComponentModel; using System.Linq; @@ -159,4 +160,17 @@ public static class Helper return false; } } + + public static RenderFragment HtmlString(string raw) + { + return builder => { + builder.AddContent(0, raw); + }; + } + + public static MarkupString HtmlMarkup(string raw) + { + return (MarkupString)raw; + } + }