{% stories Breadcrumb with {
  "title": "Molecules/Breadcrumb",
  "parameters": {
    "componentSubtitle": "Bootstrap Breadcrumb Component",
    "docs": {
      "description": {
        "component": "Breadcrumb trail items that indicate the current page location within a navigational hierarchy that automatically adds separators via CSS."
      },
      "story": {
        "inline": true
      }
    }
  },
  "argTypes": {
    "breadcrumb": {
      "name": "Breadcrumb",
      "description": "Breadcrumb trail items",
      "defaultValue": {},
      "control": "object"
    },
    "divider": {
      "name": "Divider",
      "description": "Dividers are automatically added in CSS through ::before and content. They can be changed by modifying a local CSS custom property --bs-breadcrumb-divider, or through the $breadcrumb-divider Sass variable — and $breadcrumb-divider-flipped for its RTL counterpart, if needed.",
      "defaultValue": "",
      "control": "text"
    },
    "breadcrumb_utility_classes": {
      "name": "Utility Classes",
      "description": "An array of utility classes that can be used to add extra Bootstrap utility classes or custom classes to this component.",
      "control": "object",
      "defaultValue": []
    },
    "attributes": {
      "name": "Attributes",
      "description": "HTML attributes for the breadcrumb nav element.",
      "control": "object",
      "defaultValue": {}
    },
    "items_attributes": {
      "name": "Items Attributes",
      "description": "HTML attributes for the Breadcrumb trail items element.",
      "control": "object",
      "defaultValue": {}
    }
  }
} %}

{% story Breadcrumb with {
  "name": "Breadcrumb",
  "args": {
    "breadcrumb": {
      "0": {"url": "#", "text": "Home"},
      "1": {"url": "#", "text": "Library"},
      "2": {"text": "Book"}
    },
    "divider": "\\F285",
    "breadcrumb_utility_classes": []
  }
} %}
{{ include('vartheme_bs5:breadcrumb') }}
{% endstory %}

{% endstories %}
