import { _ as _applyDecoratedDescriptor, a as _initializerDefineProperty, b as _defineProperty } from '../_rollupPluginBabelHelpers-9wjJaosZ.js';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import { macroCondition, dependencySatisfies, importSync } from '@embroider/macros';
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { fn } from '@ember/helper';
import { on } from '@ember/modifier';
import didInsert from '@ember/render-modifiers/modifiers/did-insert';
import { throttle } from '@ember/runloop';
import optional from 'ember-composable-helpers/helpers/optional';
import sub from 'ember-math-helpers/helpers/sub';
import { modifier } from 'ember-modifier';
import { eq, and, not } from 'ember-truth-helpers';
import classNames from '../helpers/class-names.js';
import useState from '../helpers/use-state.js';
import { getBreakpoint } from '../utils/breakpoint.js';
import EuiIcon from './eui-icon.js';
import EuiImage from './eui-inner-text.js';
import EuiLink from './eui-link.js';
import EuiPopoverComponent from './eui-popover.js';

var _class, _descriptor;
let cached = macroCondition(dependencySatisfies('ember-source', '>= 4.1.0-alpha.0')) ? importSync('@glimmer/tracking').cached : importSync('ember-cached-decorator-polyfill').cached;
const responsiveDefault = {
  xs: 1,
  s: 2,
  m: 4
};
const onWindowResizeModifier = modifier((_ele, _pos, {
  functionToCallOnWindowResize
}) => {
  window.addEventListener('resize', functionToCallOnWindowResize);
  return () => {
    window.removeEventListener('resize', functionToCallOnWindowResize);
  };
});
const limitedBreadcrumbs = (max, breadcrumbs) => {
  const breadcrumbsAtStart = [];
  const breadcrumbsAtEnd = [];
  const limit = Math.min(max, breadcrumbs.length);
  const start = Math.floor(limit / 2);
  const overflowBreadcrumbs = breadcrumbs.slice(start, start + breadcrumbs.length - limit);
  if (overflowBreadcrumbs.length && overflowBreadcrumbs[overflowBreadcrumbs.length - 1]) {
    overflowBreadcrumbs[overflowBreadcrumbs.length - 1]['aria-current'] = 'false';
  }
  for (let i = 0; i < limit; i++) {
    // We'll alternate with displaying breadcrumbs at the end and at the start, but be biased
    // towards breadcrumbs the end so that if max is an odd number, we'll have one more
    // breadcrumb visible at the end than at the beginning.
    const isEven = i % 2 === 0;

    // We're picking breadcrumbs from the front AND the back, so we treat each iteration as a
    // half-iteration.
    const normalizedIndex = Math.floor(i * 0.5);
    const indexOfBreadcrumb = isEven ? breadcrumbs.length - 1 - normalizedIndex : normalizedIndex;
    const breadcrumb = breadcrumbs[indexOfBreadcrumb];
    if (isEven && breadcrumb) {
      breadcrumbsAtEnd.unshift(breadcrumb);
    } else if (breadcrumb) {
      breadcrumbsAtStart.push(breadcrumb);
    }
  }
  if (max < breadcrumbs.length) {
    breadcrumbsAtStart.push({
      ellipsis: true
    });
  }
  return {
    breadcrumbs: [...breadcrumbsAtStart, ...breadcrumbsAtEnd],
    overflowBreadcrumbs
  };
};
let EuiBreadcrumbs = setComponentTemplate(precompileTemplate(`
    <nav
      {{onWindowResizeModifier
        functionToCallOnWindowResize=this.functionToCallOnWindowResize
      }}
      class={{classNames
        "euiBreadcrumbs"
        (if this.truncate "euiBreadcrumbs--truncate")
      }}
      ...attributes
    >
      <ol class="euiBreadcrumbs__list">

        {{#each this.limitedBreadcrumbs.breadcrumbs as |breadcrumb index|}}

          {{#if breadcrumb.ellipsis}}
            {{#let (useState false) as |popOverState|}}
              <li class="euiBreadcrumb euiBreadcrumb--collapsed">
                <EuiPopover
                  @isOpen={{popOverState.value}}
                  @closePopover={{fn popOverState.setState false}}
                >
                  <:button>
                    <EuiLink
                      class="euiBreadcrumb__content"
                      @color="subdued"
                      aria-label="See collapsed breadcrumbs"
                      title="See collapsed breadcrumbs"
                      {{on "click" (fn popOverState.setState true)}}
                    >
                      &hellip;<EuiIcon @type="arrowDown" @size="s" />
                    </EuiLink>
                  </:button>
                  <:content>
                    <EuiBreadcrumbs
                      class="euiBreadcrumbs__inPopover"
                      @breadcrumbs={{this.limitedBreadcrumbs.overflowBreadcrumbs}}
                      @responsive={{false}}
                      @truncate={{false}}
                      @max={{0}}
                    />
                  </:content>
                </EuiPopover>

              </li>

            {{/let}}
          {{else}}
            <EuiInnerText as |setInnerTextRef innerText|>
              {{#let
                (eq index (sub this.limitedBreadcrumbs.breadcrumbs.length 1))
                (if (eq innerText "") undefined innerText)
                as |isLastBreadcrumb title|
              }}
                <li
                  class={{classNames
                    "euiBreadcrumb"
                    (if isLastBreadcrumb "euiBreadcrumb--last")
                    (if breadcrumb.truncate "euiBreadcrumb--truncate")
                  }}
                >
                  {{#if (and (not breadcrumb.href) (not breadcrumb.onClick))}}
                    <span
                      {{didInsert setInnerTextRef}}
                      title={{title}}
                      class={{classNames
                        "euiBreadcrumb__content"
                        breadcrumb.className
                      }}
                      aria-current={{if isLastBreadcrumb "page" undefined}}
                    >
                      {{breadcrumb.text}}
                    </span>
                  {{else}}
                    <EuiLink
                      {{didInsert setInnerTextRef}}
                      @color={{if
                        breadcrumb.color
                        breadcrumb.color
                        (if isLastBreadcrumb "text" "subdued")
                      }}
                      @href={{breadcrumb.href}}
                      title={{title}}
                      class={{classNames
                        "euiBreadcrumb__content"
                        breadcrumb.className
                      }}
                      {{on "click" (optional breadcrumb.onClick)}}
                      aria-current={{if isLastBreadcrumb "page" undefined}}
                    >
                      {{breadcrumb.text}}
                    </EuiLink>
                  {{/if}}

                </li>
              {{/let}}
            </EuiInnerText>
          {{/if}}

        {{/each}}

      </ol>
    </nav>
  `, {
  strictMode: true,
  scope: () => ({
    classNames,
    onWindowResizeModifier,
    useState,
    EuiPopover: EuiPopoverComponent,
    fn,
    EuiLink,
    on,
    EuiIcon,
    EuiBreadcrumbs,
    EuiInnerText: EuiImage,
    eq,
    sub,
    and,
    not,
    didInsert,
    optional
  })
}), (_class = class EuiBreadcrumbs extends Component {
  constructor(owner, args) {
    super(owner, args);
    _initializerDefineProperty(this, "currentBreakpoint", _descriptor, this);
    _defineProperty(this, "functionToCallOnWindowResize", () => {
      throttle(() => {
        const newBreakpoint = getBreakpoint(window.innerWidth);
        if (newBreakpoint !== this.currentBreakpoint) {
          this.currentBreakpoint = newBreakpoint;
        }
      }, 50);
    });
    this.currentBreakpoint = getBreakpoint(typeof window === 'undefined' ? -Infinity : window.innerWidth);
  }
  get responsiveObject() {
    return typeof this.args.responsive === 'object' ? this.args.responsive : responsiveDefault;
  }
  get max() {
    if (this.args.max === null) {
      return null;
    }
    return this.args.max ?? 5;
  }
  get truncate() {
    return this.args.truncate ?? true;
  }
  get calculatedMax() {
    // The max property collapses any breadcrumbs past the max quantity.
    // This is the same behavior we want for responsiveness.
    // So calculate the max value based on the combination of `max` and `responsive`
    let calculatedMax = this.max;

    // Set the calculated max to the number associated with the currentBreakpoint key if it exists
    if (this.args.responsive && this.responsiveObject[this.currentBreakpoint]) {
      calculatedMax = this.responsiveObject[this.currentBreakpoint];
    }

    // Final check is to make sure max is used over a larger breakpoint value
    if (this.max && calculatedMax) {
      calculatedMax = this.max < calculatedMax ? this.max : calculatedMax;
    }
    return calculatedMax;
  }
  get limitedBreadcrumbs() {
    const calculatedMax = this.calculatedMax;
    return calculatedMax ? limitedBreadcrumbs(calculatedMax, this.args.breadcrumbs) : {
      breadcrumbs: this.args.breadcrumbs,
      overflowBreadcrumbs: []
    };
  }
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "currentBreakpoint", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _applyDecoratedDescriptor(_class.prototype, "limitedBreadcrumbs", [cached], Object.getOwnPropertyDescriptor(_class.prototype, "limitedBreadcrumbs"), _class.prototype)), _class));

export { EuiBreadcrumbs as default };
//# sourceMappingURL=eui-breadcrumbs.js.map
