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 { on } from '@ember/modifier';
import set from 'ember-set-helper/helpers/set';
import { and, not } from 'ember-truth-helpers';
import MarkdownLogo from './eui-markdown-editor-footer/icons/markdown-logo.js';
import EuiButtonEmpty from './eui-button-empty.js';
import EuiButtonIcon from './eui-button-icon.js';
import EuiHorizontalRule from './eui-horizontal-rule.js';
import EuiI18nComponent from './eui-i18n.js';
import EuiLoadingSpinner from './eui-loading-spinner.js';
import EuiMarkdownEditorToolbarComponent from './eui-markdown-format.js';
import EuiModal from './eui-modal.js';
import EuiModalBody from './eui-modal-body.js';
import EuiModalHeader from './eui-modal-header.js';
import EuiPopoverComponent from './eui-popover.js';
import EuiSpacer from './eui-spacer.js';
import EuiTitle from './eui-title.js';

var _class, _descriptor, _descriptor2;
const defaultMarkdownSyntaxHelp = `
The editor uses 

[Github flavored markdown](https://github.github.com/gfm/).

You can also utilize these additional syntax plugins to add rich content to your text.
`;
let EuiMarkdownEditorFooterComponent = setComponentTemplate(precompileTemplate(`
    <div class="euiMarkdownEditorFooter">
      <div class="euiMarkdownEditorFooter__actions">

        {{#if @isUploadingFiles}}
          {{! pending implementation}}
          <EuiButtonIcon
            @iconType={{component EuiLoadingSpinner}}
            @useComponent={{true}}
            {{! aria-label={ariaLabels.uploadingFiles} }}
          />
        {{/if}}
        {{#if (and @errors @errors.length)}}
          <EuiPopover
            @isOpen={{this.isPopoverOpen}}
            @closePopover={{set this "isPopoverOpen" false}}
          >
            <:button>
              <EuiButtonEmpty
                @iconType="error"
                @size="s"
                @color="danger"
                {{! aria-label={ariaLabels.showSyntaxErrors} }}
                {{on
                  "click"
                  (set this "isPopoverOpen" (not this.isPopoverOpen))
                }}
              >
                {{@errors.length}}
              </EuiButtonEmpty>
            </:button>
          </EuiPopover>
        {{/if}}
      </div>
      <EuiButtonIcon
        class="euiMarkdownEditorFooter__help"
        @iconType={{component MarkdownLogo}}
        @useComponent={{true}}
        @color="text"
        @useSvg={{true}}
        {{! aria-label={ariaLabels.showMarkdownHelp} }}
        {{on "click" (set this "isShowingHelp" (not this.isShowingHelp))}}
      />

      {{#if this.isShowingHelp}}

        <EuiModal @onClose={{set this "isShowingHelp" false}}>
          <EuiModalHeader>
            <EuiTitle>
              <h3>
                <EuiI18n
                  @token="euiMarkdownEditorFooter.syntaxTitle"
                  @default="Syntax Help"
                  as |Token|
                >
                  <Token as |value|>
                    {{value}}
                  </Token>
                </EuiI18n>
              </h3>
            </EuiTitle>
          </EuiModalHeader>
          <EuiModalBody>

            <EuiI18n
              @token="euiMarkdownEditorFooter.syntaxHelp"
              @default={{defaultMarkdownSyntaxHelp}}
              as |Token|
            >
              <Token as |value|>
                <EuiMarkdownFormat @value={{value}} />
              </Token>
            </EuiI18n>

            <EuiHorizontalRule />
            {{#each @uiPlugins as |uiPlugin|}}
              {{#if uiPlugin.helpText}}
                <EuiTitle size="xxs">
                  <p>
                    <strong>{{uiPlugin.name}}</strong>
                  </p>
                </EuiTitle>
                <EuiSpacer size="s" />
                <EuiMarkdownFormat @value={{uiPlugin.helpText}} />
                <EuiSpacer size="l" />

              {{/if}}
            {{/each}}
          </EuiModalBody>
        </EuiModal>

      {{/if}}
    </div>
  `, {
  strictMode: true,
  scope: () => ({
    EuiButtonIcon,
    EuiLoadingSpinner,
    and,
    EuiPopover: EuiPopoverComponent,
    set,
    EuiButtonEmpty,
    on,
    not,
    MarkdownLogo,
    EuiModal,
    EuiModalHeader,
    EuiTitle,
    EuiI18n: EuiI18nComponent,
    EuiModalBody,
    defaultMarkdownSyntaxHelp,
    EuiMarkdownFormat: EuiMarkdownEditorToolbarComponent,
    EuiHorizontalRule,
    EuiSpacer
  })
}), (_class = class EuiMarkdownEditorFooterComponent extends Component {
  constructor(...args) {
    super(...args);
    _initializerDefineProperty(this, "isPopoverOpen", _descriptor, this);
    _initializerDefineProperty(this, "isShowingHelp", _descriptor2, this);
  }
}, (_descriptor = _applyDecoratedDescriptor(_class.prototype, "isPopoverOpen", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return false;
  }
}), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "isShowingHelp", [tracked], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: function () {
    return false;
  }
})), _class));

export { EuiMarkdownEditorFooterComponent as default };
//# sourceMappingURL=eui-markdown-editor-footer.js.map
