import templateOnly from '@ember/component/template-only';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import { helper } from '@ember/component/helper';
import { fn } from '@ember/helper';
import { on } from '@ember/modifier';
import { element } from 'ember-element-helper';
import { and, not, eq } from 'ember-truth-helpers';
import randomId from '../-private/random-id.js';
import argOrDefault from '../helpers/arg-or-default.js';
import classNames from '../helpers/class-names.js';
import EuiBetaBadge from './eui-beta-badge.js';
import EuiCheckbox from './eui-checkbox.js';
import EuiRadio from './eui-radio.js';

const charAt = helper(function ([str, num]) {
  return str?.charAt?.(num);
});
const EuiKeyPadMenuItem = setComponentTemplate(precompileTemplate(`
    {{#let
      (if @checkable "label" (if (and @href (not @isDisabled)) "a" "button"))
      (argOrDefault @id (randomId))
      (and @href (not @isDisabled))
      as |ElementTag itemId useHref|
    }}
      {{#let (element ElementTag) as |TagElement|}}
        <TagElement
          href={{if useHref @href}}
          target={{if useHref @target}}
          aria-current={{if (and useHref @isSelected) @isSelected}}
          for={{if @checkable itemId}}
          disabled={{if (and (not useHref) (not @checkable)) @isDisabled}}
          type={{if (and (not useHref) (not @checkable)) "button"}}
          aria-pressed={{if (and (not useHref) (not @checkable)) @isSelected}}
          class={{classNames
            "euiKeyPadMenuItem"
            (if @betaBadgeLabel "euiKeyPadMenuItem--hasBetaBadge")
            (if @checkable "euiKeyPadMenuItem--checkable")
            (if @isDisabled "euiKeyPadMenuItem-isDisabled")
            (if @isSelected "euiKeyPadMenuItem-isSelected")
          }}
          rel={{if useHref "noreferrer"}}
          {{!@glint-expect-error}}
          ...attributes
        >
          <span class="euiKeyPadMenuItem__inner">
            {{#if @checkable}}
              {{#if (eq @checkable "single")}}
                {{! template-lint-disable no-duplicate-id }}
                <EuiRadio
                  id={{itemId}}
                  @containerClass="euiKeyPadMenuItem__checkableInput"
                  @checked={{@isSelected}}
                  @disabled={{@isDisabled}}
                  @name={{@name}}
                  value={{@value}}
                  {{on "change" (fn @onChange itemId @value)}}
                />
              {{else}}
                <EuiCheckbox
                  id={{itemId}}
                  @containerClass="euiKeyPadMenuItem__checkableInput"
                  @checked={{@isSelected}}
                  @disabled={{@isDisabled}}
                  @name={{@name}}
                  {{on "change" (fn @onChange itemId)}}
                />
              {{/if}}
            {{else}}
              <EuiBetaBadge
                @size="s"
                @color="subdued"
                class="euiKeyPadMenuItem__betaBadge"
                @label={{charAt @betaBadgeLabel 0}}
                @title={{@betaBadgeLabel}}
                @iconType={{@betaBadgeIconType}}
                @tooltipContent={{@betaBadgeTooltipContent}}
              />
            {{/if}}
            <span class="euiKeyPadMenuItem__icon">{{yield}}</span>
            <span class="euiKeyPadMenuItem__label">{{@label}}</span>
          </span>
        </TagElement>

      {{/let}}
    {{/let}}
  `, {
  strictMode: true,
  scope: () => ({
    and,
    not,
    argOrDefault,
    randomId,
    element,
    classNames,
    eq,
    EuiRadio,
    on,
    fn,
    EuiCheckbox,
    EuiBetaBadge,
    charAt
  })
}), templateOnly("eui-key-pad-menu-item", "EuiKeyPadMenuItem"));

export { EuiKeyPadMenuItem as default };
//# sourceMappingURL=eui-key-pad-menu-item.js.map
