Abp nav tag helper Refactored

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavItemTagHelper.cs

@@ -2,12 +2,10 @@
 {
     public class AbpNavItemTagHelper : AbpTagHelper<AbpNavItemTagHelper, AbpNavItemTagHelperService>
     {
-        public bool? Active { get; set; } 
+        public bool? Active { get; set; }
 
-        public bool? Disabled { get; set; }
+        public bool? Dropdown { get; set; }
 
-        public string Href { get; set; }
-        
         public AbpNavItemTagHelper(AbpNavItemTagHelperService tagHelperService)
             : base(tagHelperService)
         {

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavItemTagHelperService.cs

@@ -1,64 +1,34 @@
-using System.Collections.Generic;
+using Microsoft.AspNetCore.Razor.TagHelpers;
-using System.Text.Encodings.Web;
-using System.Threading.Tasks;
-using Microsoft.AspNetCore.Razor.TagHelpers;
 using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
 
 namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
 {
     public class AbpNavItemTagHelperService : AbpTagHelperService<AbpNavItemTagHelper>
     {
-        private readonly HtmlEncoder _encoder;
+        public override void Process(TagHelperContext context, TagHelperOutput output)
-
-        public AbpNavItemTagHelperService(HtmlEncoder encoder)
-        {
-            _encoder = encoder;
-        }
-
-        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
-        {
-            output.TagName = "a";
-            output.TagMode = TagMode.StartTagAndEndTag;
-            output.Attributes.Add("href",TagHelper.Href);
-            SetClasses(context, output);
-
-            output.Content.SetHtmlContent(await output.GetChildContentAsync());
-
-            var list = GetValueFromContext<List<NavItem>>(context, NavItemContents);
-
-            list.Add(new NavItem
-            {
-                Html = SurroundTagWithNavItem(context, output,RenderTagHelperOutput(output, _encoder)),
-                Active = TagHelper.Active??false
-            });
-
-            output.SuppressOutput();
-        }
-
-        protected virtual void SetClasses(TagHelperContext context, TagHelperOutput output)
         {
-            output.Attributes.AddClass("nav-link");
+            output.TagName = "li";
+            output.Attributes.AddClass("nav-item");
 
-            SetDisabledClass(context, output);
+            SetDropdownClass(context, output);
             SetActiveClass(context, output);
         }
 
-        protected virtual void SetDisabledClass(TagHelperContext context, TagHelperOutput output)
+
+        protected virtual void SetDropdownClass(TagHelperContext context, TagHelperOutput output)
         {
-            if (TagHelper.Disabled ?? false)
+            if (TagHelper.Dropdown ?? false)
             {
-                output.Attributes.AddClass("disabled");
+                output.Attributes.AddClass("dropdown");
             }
         }
 
         protected virtual void SetActiveClass(TagHelperContext context, TagHelperOutput output)
         {
-            output.Attributes.AddClass(AbpNavItemActivePlaceholder);
+            if (TagHelper.Active ?? false)
-        }
+            {
-
+                output.Attributes.AddClass("active");
-        protected virtual string SurroundTagWithNavItem(TagHelperContext context, TagHelperOutput output, string html)
+            }
-        {
-            return "<li class=\"nav-item "+ AbpNavItemResponsiveAlignPlaceholder +" " + AbpNavItemResponsiveFlexPlaceholder + "\">" + html + "</li>";
         }
     }
 }

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavLinkTagHelper.cs

@@ -0,0 +1,20 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    [HtmlTargetElement(Attributes = "abp-nav-link")]
+    public class AbpNavLinkTagHelper : AbpTagHelper<AbpNavLinkTagHelper, AbpNavLinkTagHelperService>
+    {
+        public bool? Active { get; set; } 
+
+        public bool? Disabled { get; set; }
+
+        public string Href { get; set; }
+        
+        public AbpNavLinkTagHelper(AbpNavLinkTagHelperService tagHelperService)
+            : base(tagHelperService)
+        {
+
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavLinkTagHelperService.cs

@@ -0,0 +1,52 @@
+using System.Collections.Generic;
+using System.Text.Encodings.Web;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
+{
+    public class AbpNavLinkTagHelperService : AbpTagHelperService<AbpNavLinkTagHelper>
+    {
+        private readonly HtmlEncoder _encoder;
+
+        public AbpNavLinkTagHelperService(HtmlEncoder encoder)
+        {
+            _encoder = encoder;
+        }
+
+        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+        {
+            output.TagName = "a";
+            output.TagMode = TagMode.StartTagAndEndTag;
+            output.Attributes.Add("href",TagHelper.Href??"");
+            SetClasses(context, output);
+        }
+
+        protected virtual void SetClasses(TagHelperContext context, TagHelperOutput output)
+        {
+            output.Attributes.AddClass("nav-link");
+
+            SetDisabledClass(context, output);
+            SetActiveClass(context, output);
+
+            output.Attributes.RemoveAll("abp-nav-link");
+        }
+
+        protected virtual void SetDisabledClass(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.Disabled ?? false)
+            {
+                output.Attributes.AddClass("disabled");
+            }
+        }
+
+        protected virtual void SetActiveClass(TagHelperContext context, TagHelperOutput output)
+        {
+            if (TagHelper.Active??false)
+            {
+                output.Attributes.AddClass("active");
+            }
+        }
+    }
+}

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavTagHelper.cs

@@ -6,8 +6,6 @@
 
         public NavStyle NavStyle { get; set; } = NavStyle.Default;
 
-        public bool? Responsive { get; set; }
-
         public AbpNavTagHelper(AbpNavTagHelperService tagHelperService)
             : base(tagHelperService)
         {

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Nav/AbpNavTagHelperService.cs

@@ -9,75 +9,13 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Nav
 {
     public class AbpNavTagHelperService : AbpTagHelperService<AbpNavTagHelper>
     {
-        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+        public override void Process(TagHelperContext context, TagHelperOutput output)
         {
             output.TagName = "ul";
             output.TagMode = TagMode.StartTagAndEndTag;
             output.Attributes.AddClass("nav");
             SetAlign(context, output);
             SetNavStyle(context, output);
-            SetResponsiveness(context, output);
-
-            var list = InitilizeFormGroupContentsContext(context, output);
-
-            await output.GetChildContentAsync();
-
-
-            SetInnerList(context, output, list);
-        }
-
-        protected virtual void SetInnerList(TagHelperContext context, TagHelperOutput output, List<NavItem> list)
-        {
-            SetFirstOneActiveIfThereIsNotAny(context, output, list);
-
-            var html = new StringBuilder("");
-
-            foreach (var navItem in list)
-            {
-                var htmlPart = SetPlaceHolderClassesIfActiveAndGetHtml(navItem);
-
-                html.AppendLine(htmlPart);
-            }
-
-            output.Content.SetHtmlContent(html.ToString());
-        }
-
-        protected virtual string SetPlaceHolderClassesIfActiveAndGetHtml(NavItem item)
-        {
-            var html = item.Html;
-
-            html = item.Active ?
-                item.Html.Replace(AbpNavItemActivePlaceholder, " active") :
-                item.Html.Replace(AbpNavItemActivePlaceholder, "");
-
-            html = TagHelper.Responsive?? false? html.Replace(AbpNavItemResponsiveFlexPlaceholder, "flex-sm-fill").Replace(AbpNavItemResponsiveAlignPlaceholder, "text-sm-center") :
-                html.Replace(AbpNavItemResponsiveFlexPlaceholder, "").Replace(AbpNavItemResponsiveAlignPlaceholder, ""); 
-
-            return html;
-        }
-
-        protected virtual void SetFirstOneActiveIfThereIsNotAny(TagHelperContext context, TagHelperOutput output, List<NavItem> list)
-        {
-            if (list.Count > 0 && !list.Any(bc => bc.Active))
-            {
-                list.FirstOrDefault().Active = true;
-            }
-        }
-
-        protected virtual void SetResponsiveness(TagHelperContext context, TagHelperOutput output)
-        {
-            if (TagHelper.Responsive??false)
-            {
-                output.Attributes.AddClass("flex-sm-row");
-                output.Attributes.AddClass("flex-column");
-            }
-        }
-
-        protected virtual List<NavItem> InitilizeFormGroupContentsContext(TagHelperContext context, TagHelperOutput output)
-        {
-            var items = new List<NavItem>();
-            context.Items[NavItemContents] = items;
-            return items;
         }
 
         protected virtual void SetAlign(TagHelperContext context, TagHelperOutput output)

src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.csproj

@@ -14,9 +14,5 @@
   <ItemGroup>
     <ProjectReference Include="..\Volo.Abp.AspNetCore.Mvc.UI\Volo.Abp.AspNetCore.Mvc.UI.csproj" />
   </ItemGroup>
-  
-  <ItemGroup>
-    <Folder Include="TagHelpers\Navbar\" />
-  </ItemGroup>
 
 </Project>

test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Navs.cshtml

@@ -13,22 +13,38 @@
 <div class="demo-with-code">
     <div class="demo-area">
 
-        <abp-nav  nav-style="Pill" responsive="true" align="Center">
+        <abp-nav nav-style="Pill" align="Center">
-            <abp-nav-item href="#">Active</abp-nav-item>
+            <abp-nav-item>
-            <abp-nav-item href="#">Longer nav link</abp-nav-item>
+                <a abp-nav-link Active="true" href="#">Active</a>
-            <abp-nav-item href="#">Link</abp-nav-item>
+            </abp-nav-item>
-            <abp-nav-item href="#" disabled="true">Disabled</abp-nav-item>
+            <abp-nav-item >
+                <a abp-nav-link  href="#">Longer nav link</a>
+            </abp-nav-item>
+            <abp-nav-item >
+                <a abp-nav-link  href="#">link</a>
+            </abp-nav-item>
+            <abp-nav-item >
+                <a abp-nav-link disabled="true" href="#">disabled</a>
+            </abp-nav-item>
         </abp-nav>
 
     </div>
     <div class="code-area">
         <pre>
-&lt;abp-nav  nav-style=&quot;Pill&quot; responsive=&quot;true&quot; align=&quot;Center&quot;&gt;
+        &lt;abp-nav nav-style=&quot;Pill&quot; align=&quot;Center&quot;&gt;
-     &lt;abp-nav-item href=&quot;#&quot;&gt;Active&lt;/abp-nav-item&gt;
+            &lt;abp-nav-item&gt;
-     &lt;abp-nav-item href=&quot;#&quot;&gt;Longer nav link&lt;/abp-nav-item&gt;
+                &lt;a abp-nav-link Active=&quot;true&quot; href=&quot;#&quot;&gt;Active&lt;/a&gt;
-     &lt;abp-nav-item href=&quot;#&quot;&gt;Link&lt;/abp-nav-item&gt;
+            &lt;/abp-nav-item&gt;
-     &lt;abp-nav-item href=&quot;#&quot; disabled=&quot;true&quot;&gt;Disabled&lt;/abp-nav-item&gt;
+            &lt;abp-nav-item &gt;
-&lt;/abp-nav&gt;
+                &lt;a abp-nav-link  href=&quot;#&quot;&gt;Longer nav link&lt;/a&gt;
+            &lt;/abp-nav-item&gt;
+            &lt;abp-nav-item &gt;
+                &lt;a abp-nav-link  href=&quot;#&quot;&gt;link&lt;/a&gt;
+            &lt;/abp-nav-item&gt;
+            &lt;abp-nav-item &gt;
+                &lt;a abp-nav-link disabled=&quot;true&quot; href=&quot;#&quot;&gt;disabled&lt;/a&gt;
+            &lt;/abp-nav-item&gt;
+        &lt;/abp-nav&gt;
 </pre>
     </div>
 </div>