public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "nav";
output.TagMode = TagMode.StartTagAndEndTag;
output.AddClass("s-breadcrumbs");
output.Attributes.SetAttribute("aria-label", "breadcrumb");
var ctx = new BreadcrumbsContext();
context.Items.Add(nameof(BreadcrumbsTagHelper), ctx);
await output.GetChildContentAsync();
var svgIcon = await SvgTagHelper.RenderAsync(_config, DividerIcon, "s-breadcrumbs--divider");
for (var i = 0; i < ctx.Crumbs.Count; i++)
{
var crumb = ctx.Crumbs[i];
output.Content.AppendHtml("<div class=\"s-breadcrumbs--item\">")
.AppendHtml(crumb);
if (i != ctx.Crumbs.Count - 1)
{
output.Content.AppendHtml(svgIcon);
}
output.Content.AppendHtml("</div>");
}
}
public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "div";
output.TagMode = TagMode.StartTagAndEndTag;
output.AddClass("s-avatar");
string sizeClass;
switch (Size)
{
case AvatarSize.Small:
sizeClass = "s-avatar__sm";
break;
case AvatarSize.Medium:
sizeClass = "s-avatar__md";
break;
case AvatarSize.Large:
sizeClass = "s-avatar__lg";
break;
case AvatarSize.XLarge:
sizeClass = "s-avatar__xl";
break;
case AvatarSize.XXLarge:
sizeClass = "s-avatar__xxl";
break;
default:
sizeClass = null;
break;
}
if (sizeClass != null)
{
output.AddClass(sizeClass);
}
if (!string.IsNullOrWhiteSpace(Image))
{
// override the styles entirely to avoid potential conflicts
output.Attributes.SetAttribute("style", $"background-image: url('{Image}')");
}
if (Letter != default)
{
output.Content.AppendHtml(@"<div class=""s-avatar--letter"">" + Letter + "</div>");
}
if (!string.IsNullOrWhiteSpace(BadgeIcon))
{
var content = await SvgTagHelper.RenderAsync(_config, BadgeIcon, "native s-avatar--badge");
output.Content.AppendHtml(content);
}
}
public static async Task <string> RenderAsync(SvgTagHelperConfiguration config, string iconName, string classes)
{
var svg = new SvgTagHelper(config)
{
Name = iconName
};
TagHelperAttributeList attributes = null;
if (!string.IsNullOrEmpty(classes))
{
attributes = new TagHelperAttributeList();
attributes.SetAttribute("class", classes);
}
var content = await svg.RenderTagHelperAsync(attributes);
return(content);
}
public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
{
output.TagName = "aside";
output.TagMode = TagMode.StartTagAndEndTag;
var uniqueId = "id_" + Guid.NewGuid().ToString("N");
var ctx = new ModalContext {
UniqueId = uniqueId
};
context.Items.Add(nameof(ModalTagHelper), ctx);
await output.GetChildContentAsync();
var clearSvg = await SvgTagHelper.RenderAsync(_config, "ClearSm", null);
output.AddClass("s-modal");
// set a11y attributes
output.Attributes.SetAttribute("tabindex", -1);
output.Attributes.SetAttribute("role", "dialog");
output.Attributes.SetAttribute("aria-labelledby", uniqueId + "title");
output.Attributes.SetAttribute("aria-describedby", uniqueId + "description");
// set the visibility
output.Attributes.SetAttribute("aria-hidden", Shown ? "false" : "true");
output.Content.AppendHtml($@"
<div class=""s-modal--dialog"" role=""document"">
<h1 class=""s-modal--header"" id=""{uniqueId}-title"">{Title}</h1>
{ctx.Body}
{ctx.Footer}
<a href=""#"" class=""s-modal--close s-btn s-btn__muted"" aria-label=""Close"" data-action=""s-modal#hide"">{clearSvg}</a>
</div>
");
}
