fix(ui): render active breadcrumb pages

2026-08-25 16:21:53 +05:30
parent 027873459d
commit 1ff2c3339c
5 changed files with 43 additions and 3 deletions
@@ -7,6 +7,7 @@ component Breadcrumb {
 label: string = "Breadcrumb"
    items: unknown[] = []
    active: string = ""
+    activeIcon: string = "icon-[lucide--file-text]"
    separator: string = "chevron"
    showHome: boolean = false
    homeLabel: string = "Home"
@@ -99,6 +100,30 @@ label: string = "Breadcrumb"
            {/if}
          </li>
        {/each}
+
+        {#if active && !items.some((item) => active === (item.value || item.label || item.title))}
+          <li class="wrn-breadcrumb__item" data-current="true">
+            {#if showHome || items.length > 0}
+              <span class="wrn-breadcrumb__separator" aria-hidden="true">
+                {#if separator === "slash"}
+                  <span>/</span>
+                {:else if separator === "dot"}
+                  <span>•</span>
+                {:else if separator === "arrow"}
+                  <span>→</span>
+                {:else}
+                  <span class="icon-[lucide--chevron-right] wrn-breadcrumb__separator-icon"></span>
+                {/if}
+              </span>
+            {/if}
+            <span class="wrn-breadcrumb__current" aria-current="page">
+              {#if activeIcon}
+                <span class='{activeIcon} wrn-breadcrumb__icon' aria-hidden="true"></span>
+              {/if}
+              <span class="wrn-breadcrumb__label">{active}</span>
+            </span>
+          </li>
+        {/if}
      </ol>
    </nav>
  }