Add non-interactive state in BitBreadcrumb (bitfoundation#9040)

Cyrus-Sushiant · Oct 31, 2024 · 7d3b240 · 7d3b240
1 parent 1c571cb
commit 7d3b240
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 2 deletions.
diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor
@@ -67,7 +67,7 @@
                             }
                         </a>
                     }
-                    else
+                    else if (OnItemClick.HasDelegate)
                     {
                         <button type="button"
                                 aria-current="@(GetIsSelected(item) ? "page" : null)"
@@ -93,6 +93,30 @@
                             }
                         </button>
                     }
+                    else 
+                    {
+                        <span aria-current="@(GetIsSelected(item) ? "page" : null)"
+                              style="@GetStyles(item, false)"
+                              class="bit-brc-itm bit-brc-noc @GetClasses(item, false)">
+                            @if (template is not null)
+                            {
+                                @template(item)
+                            }
+                            else if (ItemTemplate is not null)
+                            {
+                                @ItemTemplate(item)
+                            }
+                            else
+                            {
+                                var iconName = GetIconName(item);
+                                @if (iconName.HasValue())
+                                {
+                                    <i style="@Styles?.ItemIcon" class="bit-icon bit-icon--@iconName @Classes?.ItemIcon" />
+                                }
+                                <span style="@Styles?.ItemText" class="@Classes?.ItemText">@GetItemText(item)</span>
+                            }
+                        </span>
+                    }
                 }
             </li>
 
@@ -148,7 +172,7 @@
                             }
                         </a>
                     }
-                    else
+                    else if (OnItemClick.HasDelegate)
                     {
                         <button type="button"
                                 aria-current="@(GetIsSelected(item) ? "page" : null)"
@@ -174,6 +198,30 @@
                             }
                         </button>
                     }
+                    else
+                    {
+                        <span aria-current="@(GetIsSelected(item) ? "page" : null)"
+                              style="@GetStyles(item, true)"
+                              class="bit-brc-ofi bit-brc-noc @GetClasses(item, true)">
+                              @if (overflowTemplate is not null)
+                              {
+                                  @overflowTemplate(item)
+                              }
+                              else if (OverflowTemplate is not null)
+                              {
+                                  @OverflowTemplate(item)
+                              }
+                              else
+                              {
+                                  var iconName = GetIconName(item);
+                                  @if (iconName.HasValue())
+                                  {
+                                      <i style="@Styles?.OverflowItemIcon" class="bit-icon bit-icon--@iconName @Classes?.OverflowItemIcon" />
+                                  }
+                                  <span style="@Styles?.OverflowItemText" class="@Classes?.OverflowItemText">@GetItemText(item)</span>
+                              }
+                        </span>
+                    }
                 </li>
             }
         </ul>

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.razor.cs
@@ -176,6 +176,7 @@ private async Task HandleOnItemClick(TItem item)
     {
         if (IsEnabled is false) return;
         if (GetIsEnabled(item) is false) return;
+        if (OnItemClick.HasDelegate is false) return;
 
         await OnItemClick.InvokeAsync(item);
 

diff --git a/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scss b/src/BlazorUI/Bit.BlazorUI/Components/Navs/Breadcrumb/BitBreadcrumb.scss
@@ -145,6 +145,16 @@
     }
 }
 
+.bit-brc-noc {
+    cursor: default;
+
+    @media (hover: hover) {
+        &:hover {
+            background-color: inherit;
+        }
+    }
+}
+
 .bit-brc-ovl {
     top: 0;
     left: 0;