{
  "tag": "ed-breadcrumb",
  "kind": "component",
  "summary": "A trail of links showing where the current page sits in a hierarchy, so users can jump back up to a parent\nlevel.",
  "status": "experimental",
  "since": "1.0",
  "docs": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/breadcrumb/",
  "usage": "https://test-apps.eurodata.de/a/eurodata-ui/docs/components/breadcrumb/usage/",
  "playwright": "getByTestId('…')",
  "dependencies": [
    "ed-breadcrumb-item",
    "ed-icon"
  ],
  "use": [
    "Arriving on a deep page from a link, search result or notification and needing to see where it sits",
    "Pages where the global navigation does not make the user's current location apparent",
    "Moving through nested records — a client, its accounts, a document inside a project — and wanting to jump back up a level"
  ],
  "notFor": [
    {
      "when": "Sequential or wizard-like flows — a breadcrumb implies a freely navigable hierarchy, which contradicts an ordered process",
      "instead": "[Wizard](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/wizard) with its built-in step indicator"
    },
    {
      "when": "Switching between sibling views of the same record",
      "instead": "a [Tab Group](https://test-apps.eurodata.de/a/eurodata-ui/docs/components/tab-group)"
    }
  ],
  "rules": [
    {
      "id": "breadcrumb/secondary-aid",
      "rule": "Use breadcrumbs as a secondary navigation aid only — they complement primary navigation but never replace it. Pair them with a sidebar, menu, or search; a page without a sidebar, search, or main menu cannot use breadcrumbs as its only orientation mechanism."
    },
    {
      "id": "breadcrumb/true-hierarchy",
      "rule": "Use it only in true hierarchies with 3 or more levels — never in flat structures of 1–2 levels, single-page tools, flat content collections, or dashboards with no drill-down.",
      "why": "Below 3 levels there is no navigational value to expose; breadcrumbs add visual clutter without navigational benefit."
    },
    {
      "id": "breadcrumb/one-line",
      "rule": "Keep the trail on one line — collapse middle items if it overflows, and never let it wrap uncontrolled onto further lines. The title variant's designed second line (the current page as heading) is the one exception.",
      "check": "error"
    },
    {
      "id": "breadcrumb/labels",
      "rule": "Write every label as a short, human-readable noun or title that matches the page heading it points to exactly — never database IDs, slugs, internal codes, or technical jargon."
    },
    {
      "id": "breadcrumb/no-skipped-levels",
      "rule": "Never skip hierarchy levels to create shorter labels."
    },
    {
      "id": "breadcrumb/identifiers-in-full",
      "rule": "Show important identifiers (names, dates, record titles) in full. Use a tooltip when a label must be truncated, and never truncate a meaningful identifier without that tooltip fallback.",
      "check": "warning"
    },
    {
      "id": "breadcrumb/landmark-label",
      "rule": "Provide the accessible name for the navigation landmark (`label`) every time.",
      "check": "error",
      "covered": true
    },
    {
      "id": "breadcrumb/title-variant",
      "rule": "Use the title or inline-title variant when the trail should double as the page heading, instead of rendering a separate heading next to it."
    },
    {
      "id": "breadcrumb/keep-on-mobile",
      "rule": "Never remove breadcrumbs on mobile to save space.",
      "check": "error"
    }
  ],
  "api": {
    "attributes": [
      {
        "name": "label",
        "property": "label",
        "type": "string",
        "default": "''",
        "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users."
      },
      {
        "name": "variant",
        "property": "variant",
        "type": "'inline' | 'inline-title' | 'title'",
        "default": "'inline'",
        "description": "The breadcrumb's visual variant."
      },
      {
        "name": "dir",
        "property": "dir",
        "type": "string"
      },
      {
        "name": "lang",
        "property": "lang",
        "type": "string"
      }
    ],
    "properties": [],
    "methods": [],
    "events": [],
    "slots": [
      {
        "name": "",
        "description": "One or more breadcrumb items to display."
      },
      {
        "name": "separator",
        "description": "The separator to use between breadcrumb items. Works best with `<ed-icon>`."
      }
    ],
    "cssProperties": [],
    "parts": [
      {
        "name": "base",
        "description": "The component's base wrapper."
      }
    ],
    "states": []
  },
  "import": "import '@eurodata/eurodata-ui/dist/components/breadcrumb/breadcrumb.js';",
  "react": {
    "component": "EdBreadcrumb",
    "import": "import EdBreadcrumb from '@eurodata/eurodata-ui/dist/react/breadcrumb/index.js';"
  }
}
