✨ add IsTouched event callback (#24)

Fixes: #24
Spillgebees · Dec 20, 2023 · d73191b · d73191b
1 parent 47ca3a2
commit d73191b
Show file tree

Hide file tree

Showing 3 changed files with 37 additions and 0 deletions.
diff --git a/...lgebees.Blazor.RichTextEditor.Samples.Shared/Examples/IsTouchedEventCallbackExample.razor b/...lgebees.Blazor.RichTextEditor.Samples.Shared/Examples/IsTouchedEventCallbackExample.razor
@@ -0,0 +1,31 @@
+<div>
+    <h3>
+        <code class="hljs">IsTouched</code> event callback example
+    </h3>
+    <CodeSnippet Code="@Code">
+        <Component>
+            <CodeSnippet Code="@_content"
+                         CodeFormat="CodeFormat.Html"
+                         Summary="Show HTML">
+                <Component>
+                    <RichTextEditor @bind-Content="@_content"
+                                    IsTouchedChanged="(value => _isTouched = value)" />
+
+                    <div class="container items-center border-2 border-dashed border-stone-500 p-4 mt-2">
+                        @((MarkupString)_isTouchedContent)
+                    </div>
+                </Component>
+            </CodeSnippet>
+        </Component>
+    </CodeSnippet>
+</div>
+
+@code {
+    private const string Code =
+@"<RichTextEditor @bind-Content=""@_content""
+                IsTouchedChanged=""@(value => _isTouched = value)"" />";
+    private string _content = "<b>Have I been touched? \ud83d\ude48</b>";
+
+    private bool _isTouched;
+    private string _isTouchedContent => $"<p>Have I been touched? <strong>{_isTouched}</strong></p>";
+}
diff --git a/...gebees.Blazor.RichTextEditor.Samples.Shared/Pages/RichTextEditorExamplesPageContent.razor b/...gebees.Blazor.RichTextEditor.Samples.Shared/Pages/RichTextEditorExamplesPageContent.razor
@@ -22,6 +22,8 @@
                 <PassiveRichTextEditorExample />
 
                 <ToolbarPositionExample />
+
+                <IsTouchedEventCallbackExample />
             </div>
 
             <a href="other"

diff --git a/src/Spillgebees.Blazor.RichTextEditor/Components/BaseRichTextEditor.razor.cs b/src/Spillgebees.Blazor.RichTextEditor/Components/BaseRichTextEditor.razor.cs
@@ -73,6 +73,9 @@ public string? Text
     [Parameter]
     public bool IsTouched { get; set; }
 
+    [Parameter]
+    public EventCallback<bool> IsTouchedChanged { get; set; }
+
     /// <summary>
     /// <para>
     /// Uses <see cref="Spillgebees.Blazor.RichTextEditor.Components.Toolbar.ToolbarOptions.BasicToolbarOptions"/> by default.
@@ -158,6 +161,7 @@ public virtual Task OnContentChangedAsync(TextChangeEvent args)
         if (args.Source == EventSource.User)
         {
             IsTouched = true;
+            IsTouchedChanged.InvokeAsync(IsTouched).AndForget(Logger.Value);
         }
         return Task.CompletedTask;
     }