'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-ca0e0765.js');

const breadcrumbCss = ":root{--ifx-font-family:\"Source Sans 3\";font-family:var(--ifx-font-family, sans-serif)}:host{display:flex}.breadcrumb{list-style:none;padding:0px;margin:0px;display:flex;flex-direction:row;font-family:var(--ifx-font-family);font-size:0.875rem;align-items:flex-start}";

const Breadcrumb = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
  }
  componentDidLoad() {
    const element = this.el.shadowRoot.firstChild;
    this.addEventListenersToHandleCustomFocusState(element);
  }
  addEventListenersToHandleCustomFocusState(element) {
    if (!element) {
      console.error('element not found');
      return;
    }
    element.tabIndex = -1;
    const slot = element.querySelector('slot');
    if (slot) {
      const assignedNodes = slot.assignedNodes();
      for (let i = 0; i < assignedNodes.length; i++) {
        const node = assignedNodes[i];
        if (node.nodeName === 'IFX-BREADCRUMB-ITEM') {
          const breadcrumbLabel = node;
          if (!breadcrumbLabel.hasAttribute('url')) {
            breadcrumbLabel.tabIndex = -1;
            breadcrumbLabel.addEventListener('focus', () => {
              if (breadcrumbLabel.hasAttribute('url')) {
                breadcrumbLabel.blur();
              }
            });
          }
        }
      }
    }
  }
  render() {
    return (index.h("nav", { "aria-label": "Page navigation breadcrumb" }, index.h("ol", { class: "breadcrumb" }, index.h("slot", null))));
  }
  get el() { return index.getElement(this); }
};
Breadcrumb.style = breadcrumbCss;

exports.ifx_breadcrumb = Breadcrumb;

//# sourceMappingURL=ifx-breadcrumb.cjs.entry.js.map