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 { concat } from '@ember/helper';
import { on } from '@ember/modifier';
import { action } from '@ember/object';
import didInsert from '@ember/render-modifiers/modifiers/did-insert';
import { notEq, eq, and, not } from 'ember-truth-helpers';
import randomId from '../-private/random-id.js';
import argOrDefault, { argOrDefaultDecorator } from '../helpers/arg-or-default.js';
import classNames from '../helpers/class-names.js';
import validatableControl from '../modifiers/validatable-control.js';
import EuiButtonEmpty from './eui-button-empty.js';
import EuiIcon from './eui-icon.js';
import EuiLoadingSpinner from './eui-loading-spinner.js';
import EuiProgress from './eui-progress.js';

var _dec, _dec2, _dec3, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6;

/**
 * You can find more typing on the template
 */
let EuiFilePickerComponent = setComponentTemplate(precompileTemplate(`
    {{#let
      (classNames
        (if @compressed "euiFilePicker--compressed")
        (if @fullWidth "euiFilePicker--fullWidth")
        (if @isInvalid "euiFilePicker--isInvalid")
        (if @isLoading "euiFilePicker--isLoading")
        display=this.display
        componentName="EuiFilePicker"
      )
      (argOrDefault @id (randomId))
      as |classes inputId|
    }}
      {{#let
        (if inputId (concat inputId "-filePicker__prompt") (randomId))
        (notEq this.promptText null)
        (eq this.display "default")
        as |promptId isOverridingInitialPrompt normalFormControl|
      }}
        <div
          class="{{classes}}
            {{if this.isHoveringDrop 'euiFilePicker__showDrop'}}
            {{if isOverridingInitialPrompt 'euiFilePicker--hasFiles'}}"
        >
          <div class="euiFilePicker__wrap">
            <input
              type="file"
              id={{inputId}}
              name={{@name}}
              class="euiFilePicker__input"
              disabled={{@disabled}}
              aria-describedby={{promptId}}
              multiple={{@multiple}}
              {{on "dragover" this.showDrop}}
              {{on "dragleave" this.hideDrop}}
              {{on "drop" this.hideDrop}}
              {{on "change" this.handleChange}}
              {{didInsert this.didInsertInput}}
              {{validatableControl @isInvalid}}
              ...attributes
            />
            <div class="euiFilePicker__prompt" id={{promptId}}>
              <EuiIcon
                @iconClasses="euiFilePicker__icon"
                @type="importAction"
                @size={{if true "m" "l"}}
                aria-hidden="true"
              />
              <div class="euiFilePicker__promptText">
                {{if this.promptText this.promptText this.initialPromptText}}
              </div>
              {{#if (and @isLoading normalFormControl)}}
                <EuiLoadingSpinner class="euiFilePicker__loadingSpinner" />
              {{else if isOverridingInitialPrompt}}
                {{#if normalFormControl}}
                  <button
                    type="button"
                    aria-label="Clear selected files"
                    class="euiFilePicker__clearButton"
                    {{on "click" this.removeFiles}}
                  >
                    <EuiIcon
                      @iconClasses="euiFilePicker__clearIcon"
                      @type="cross"
                    />
                  </button>
                {{else}}
                  <EuiButtonEmpty
                    aria-label="Clear selected files"
                    class="euiFilePicker__clearButton"
                    @size="xs"
                    {{on "click" this.removeFiles}}
                  >
                    Remove
                  </EuiButtonEmpty>
                {{/if}}
              {{/if}}
              {{#if (and (not normalFormControl) @isLoading)}}
                <EuiProgress @size="xs" @color="accent" position="absolute" />
              {{/if}}
            </div>
          </div>
        </div>
      {{/let}}
    {{/let}}
  `, {
  strictMode: true,
  scope: () => ({
    classNames,
    argOrDefault,
    randomId,
    concat,
    notEq,
    eq,
    on,
    didInsert,
    validatableControl,
    EuiIcon,
    and,
    EuiLoadingSpinner,
    EuiButtonEmpty,
    not,
    EuiProgress
  })
}), (_dec = argOrDefaultDecorator('Select or drag and drop a file'), _dec2 = argOrDefaultDecorator(false), _dec3 = argOrDefaultDecorator(''), (_class = class EuiFilePickerComponent extends Component {
  constructor(...args) {
    super(...args);
    _initializerDefineProperty(this, "fileInput", _descriptor, this);
    _initializerDefineProperty(this, "promptText", _descriptor2, this);
    _initializerDefineProperty(this, "isHoveringDrop", _descriptor3, this);
    _initializerDefineProperty(this, "initialPromptText", _descriptor4, this);
    _initializerDefineProperty(this, "compressed", _descriptor5, this);
    _initializerDefineProperty(this, "display", _descriptor6, this);
  }
  showDrop() {
    if (!this.args.disabled) {
      this.isHoveringDrop = true;
    }
  }
  hideDrop() {
    this.isHoveringDrop = false;
  }
  handleChange() {
    if (!this.fileInput) return;
    if (this.fileInput.files && this.fileInput.files.length > 1) {
      this.promptText = `${this.fileInput.files.length} files selected`;
      // TODO: Change when EuiI18n is available
      // <EuiI18n
      //   token="euiFilePicker.filesSelected"
      //   default="{fileCount} files selected"
      //   values={{ fileCount: this.fileInput.files.length }}
      // />
    } else if (this.fileInput.files && this.fileInput.files.length === 0) {
      this.promptText = null;
    } else {
      this.promptText = this.fileInput.value.split('\\').pop();
    }
    const {
      onChange
    } = this.args;
    if (onChange) {
      onChange(this.fileInput.files);
    }
  }
  removeFiles(e) {
    if (e) {
      e.stopPropagation();
      e.preventDefault();
    }
    if (!this.fileInput) return;
    this.fileInput.value = '';
    this.handleChange();
  }
  didInsertInput(inputRef) {
    this.fileInput = inputRef;
    this.args.ref?.(this);
  }
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "fileInput", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return null;
  }
}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "promptText", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return null;
  }
}), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "isHoveringDrop", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return false;
  }
}), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "initialPromptText", [_dec], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "compressed", [_dec2], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _descriptor6 = _applyDecoratedDescriptor(_class.prototype, "display", [_dec3], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), _applyDecoratedDescriptor(_class.prototype, "showDrop", [action], Object.getOwnPropertyDescriptor(_class.prototype, "showDrop"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "hideDrop", [action], Object.getOwnPropertyDescriptor(_class.prototype, "hideDrop"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "handleChange", [action], Object.getOwnPropertyDescriptor(_class.prototype, "handleChange"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "removeFiles", [action], Object.getOwnPropertyDescriptor(_class.prototype, "removeFiles"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "didInsertInput", [action], Object.getOwnPropertyDescriptor(_class.prototype, "didInsertInput"), _class.prototype)), _class)));

export { EuiFilePickerComponent as default };
//# sourceMappingURL=eui-file-picker.js.map
