Created more components

2026-05-04 18:58:48 +05:00
parent fb1cb8e834
commit 40a7d9018c
52 changed files with 2526 additions and 11 deletions
@@ -0,0 +1,55 @@
+namespace Htmx.ApiDemo.Templates.Components;
+
+/// <summary>
+/// shadcn-style Dialog using the native HTML &lt;dialog&gt; element.
+/// Open with data-dialog-open="id" on any button; close with data-dialog-close or .dialog-close.
+/// JS wiring is in components.js.
+/// </summary>
+public sealed class Dialog : DialogBase
+{
+    private readonly byte[] _idData;
+    private readonly byte[] _headerData;
+    private readonly byte[] _contentData;
+    private readonly byte[] _footerData;
+
+    public Dialog(
+        string id,
+        string content,
+        string title       = "",
+        string description = "",
+        string footer      = "")
+    {
+        _idData      = id.ToUtf8Bytes();
+        _contentData = content.ToUtf8Bytes();
+
+        _headerData = (string.IsNullOrEmpty(title) && string.IsNullOrEmpty(description))
+            ? []
+            : BuildHeader(id, title, description);
+
+        _footerData = string.IsNullOrEmpty(footer)
+            ? []
+            : $"""<div class="flex justify-end gap-2">{footer}</div>""".ToUtf8Bytes();
+    }
+
+    private static byte[] BuildHeader(string id, string title, string description)
+    {
+        var sb = new System.Text.StringBuilder();
+        sb.Append("""<div class="flex items-start justify-between gap-4">""");
+        sb.Append("""<div class="flex flex-col gap-1.5">""");
+        if (!string.IsNullOrEmpty(title))
+            sb.Append($"""<h2 class="text-lg font-semibold leading-none tracking-tight">{title}</h2>""");
+        if (!string.IsNullOrEmpty(description))
+            sb.Append($"""<p class="text-sm text-muted-foreground">{description}</p>""");
+        sb.Append("</div>");
+        sb.Append("""<button type="button" data-dialog-close class="dialog-close rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2" aria-label="Close">""");
+        sb.Append("""<svg class="h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>""");
+        sb.Append("</button>");
+        sb.Append("</div>");
+        return sb.ToString().ToUtf8Bytes();
+    }
+
+    protected override void RenderId(HtmxRenderContext ctx)      => ctx.Writer.WriteUtf8(_idData);
+    protected override void RenderHeader(HtmxRenderContext ctx)  => ctx.Writer.WriteUtf8(_headerData);
+    protected override void RenderContent(HtmxRenderContext ctx) => ctx.Writer.WriteUtf8(_contentData);
+    protected override void RenderFooter(HtmxRenderContext ctx)  => ctx.Writer.WriteUtf8(_footerData);
+}