56 lines
2.6 KiB
C#
56 lines
2.6 KiB
C#
namespace Htmx.ApiDemo.Templates.Components;
|
|
|
|
/// <summary>
|
|
/// shadcn-style Dialog using the native HTML <dialog> 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);
|
|
}
|