# Breadcrumbs

## Overview

A navigation component that helps visualize a page's location within a site's hierarchical structure. It also allows moving between its levels.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FBDbN3fW6hnjFKgB1JwZW%2FCleanShot%202025-07-14%20at%2014.09.52%402x-min.png?alt=media&#x26;token=02e0e000-1815-4b4f-9506-e51b15c2966c" alt=""><figcaption></figcaption></figure>

### Properties

| Name    | Type                  | Description               |
| ------- | --------------------- | ------------------------- |
| `name`  | `string`              | Component name            |
| `items` | `breadcrumbItemApi[]` | Array of breadcrumb items |

### Methods

<table><thead><tr><th width="132.171875">Name</th><th width="180.35546875">Parameters</th><th width="100.7421875">Returns</th><th>Description</th></tr></thead><tbody><tr><td><code>setItems</code></td><td><code>data: object[]</code></td><td><code>void</code></td><td>Set breadcrumb items</td></tr><tr><td><code>setActive</code></td><td><code>number: boolean</code></td><td><code>void</code></td><td>Set active status for an item at given index</td></tr></tbody></table>

### Triggers

| Name                | Description                                        |
| ------------------- | -------------------------------------------------- |
| **On Init**         | Triggered when the component is initialized        |
| **On Click**        | Triggered when a breadcrumb link is clicked        |
| **On Double Click** | Triggered when a breadcrumb link is double-clicked |