import { _ as _applyDecoratedDescriptor, a as _initializerDefineProperty } from '../_rollupPluginBabelHelpers-9wjJaosZ.js';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { hash, concat } from '@ember/helper';
import { action } from '@ember/object';
import { focusTrap } from 'ember-focus-trap';
import onKey from 'ember-keyboard/modifiers/on-key';
import { not } from 'ember-truth-helpers';
import { tabbable } from 'tabbable';
import randomId from '../-private/random-id.js';
import { argOrDefaultDecorator } from '../helpers/arg-or-default.js';
import ResizeObserver from '../modifiers/resize-observer.js';
import { cascadingMenuKeys } from '../utils/accesibility/cascading-menu-keys.js';
import EuiPopoverComponent from './eui-popover.js';

var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9;
let EuiInputPopoverComponent = setComponentTemplate(precompileTemplate(`
    {{#let (randomId) as |id|}}
      <EuiPopover
        class="euiInputPopover
          {{if this.fullWidth 'euiInputPopover--fullWidth'}}"
        @ownFocus={{false}}
        @buttonRef={{this.didInsertInput}}
        @panelRef={{this.didInsertPanel}}
        @anchorPosition={{this.anchorPosition}}
        @panelPaddingSize={{this.panelPaddingSize}}
        @attachToAnchor={{this.attachToAnchor}}
        @display={{this.display}}
        @closePopover={{@closePopover}}
        @isOpen={{@isOpen}}
        ...attributes
      >
        <:button>
          <div {{resizeObserver onResize=this.onResize}}>
            {{yield to="input"}}
          </div>
        </:button>
        <:content>
          <div
            id={{id}}
            {{onKey "_all" this.onKeyDown}}
            {{focusTrap
              isActive=(not this.disableFocusTrap)
              focusTrapOptions=(hash
                clickOutsideDeactivates=true
                returnFocusOnDeactivate=false
                fallbackFocus=(concat "#" id)
              )
            }}
          >
            {{yield to="content"}}
          </div>
        </:content>
      </EuiPopover>
    {{/let}}
  `, {
  strictMode: true,
  scope: () => ({
    randomId,
    EuiPopover: EuiPopoverComponent,
    resizeObserver: ResizeObserver,
    onKey,
    focusTrap,
    not,
    hash,
    concat
  })
}), (_dec = argOrDefaultDecorator('downLeft'), _dec2 = argOrDefaultDecorator(true), _dec3 = argOrDefaultDecorator('block'), _dec4 = argOrDefaultDecorator('s'), _dec5 = argOrDefaultDecorator(false), _dec6 = argOrDefaultDecorator(false), (_class = class EuiInputPopoverComponent extends Component {
  constructor(...args) {
    super(...args);
    // Defaults
    _initializerDefineProperty(this, "anchorPosition", _descriptor, this);
    _initializerDefineProperty(this, "attachToAnchor", _descriptor2, this);
    _initializerDefineProperty(this, "display", _descriptor3, this);
    _initializerDefineProperty(this, "panelPaddingSize", _descriptor4, this);
    _initializerDefineProperty(this, "fullWidth", _descriptor5, this);
    _initializerDefineProperty(this, "disableFocusTrap", _descriptor6, this);
    //State
    _initializerDefineProperty(this, "panel", _descriptor7, this);
    _initializerDefineProperty(this, "input", _descriptor8, this);
    _initializerDefineProperty(this, "inputWidth", _descriptor9, this);
  }
  ///

  didInsertPanel(panel) {
    this.panel = panel;
    this.setPanelWidth();
  }
  didInsertInput(input) {
    this.input = input;
    this.onResize();
  }
  setPanelWidth(width) {
    const {
      panel,
      inputWidth
    } = this;
    const newWidth = width || inputWidth;
    if (panel && !!newWidth) {
      panel.style.width = `${newWidth}px`;
      this.args.onPanelResize?.(newWidth);
    }
  }
  onResize() {
    const {
      input
    } = this;
    if (input) {
      const width = input.getBoundingClientRect().width;
      this.inputWidth = width;
      this.setPanelWidth(width);
    }
  }
  onKeyDown(event) {
    const {
      panel
    } = this;
    if (panel && event.key === cascadingMenuKeys.TAB) {
      const tabbableItems = tabbable(panel).filter(el => {
        return Array.from(el.attributes).map(el => el.name).indexOf('data-focus-guard') < 0;
      });
      if (this.args.disableFocusTrap || tabbableItems.length && tabbableItems[tabbableItems.length - 1] === document.activeElement) {
        this.args.closePopover?.();
      }
    }
  }
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "anchorPosition", [_dec], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "attachToAnchor", [_dec2], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "display", [_dec3], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "panelPaddingSize", [_dec4], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "fullWidth", [_dec5], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor6 = _applyDecoratedDescriptor(_class.prototype, "disableFocusTrap", [_dec6], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor7 = _applyDecoratedDescriptor(_class.prototype, "panel", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return null;
  }
}), _descriptor8 = _applyDecoratedDescriptor(_class.prototype, "input", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return null;
  }
}), _descriptor9 = _applyDecoratedDescriptor(_class.prototype, "inputWidth", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _applyDecoratedDescriptor(_class.prototype, "didInsertPanel", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didInsertPanel"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "didInsertInput", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didInsertInput"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setPanelWidth", [action], Object.getOwnPropertyDescriptor(_class.prototype, "setPanelWidth"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onResize", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onResize"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "onKeyDown", [action], Object.getOwnPropertyDescriptor(_class.prototype, "onKeyDown"), _class.prototype)), _class)));

export { EuiInputPopoverComponent as default };
//# sourceMappingURL=eui-input-popover.js.map
