{{! template-lint-disable no-down-event-binding }}
<button
  {{! For legacy compatibility. Prefer passing class as attributes. }}
  class="{{@class}}
    {{if @isLoading 'is-loading'}}
    {{if this.btnLink 'btn-link' 'btn'}}
    {{if this.noText 'no-text'}}
    {{this.btnType}}"
  {{! For legacy compatibility. Prefer passing these as html attributes. }}
  id={{@id}}
  form={{@form}}
  aria-controls={{@ariaControls}}
  aria-expanded={{this.computedAriaExpanded}}
  tabindex={{@tabindex}}
  type={{or @type "button"}}
  ...attributes
  disabled={{this.isDisabled}}
  title={{this.computedTitle}}
  aria-label={{this.computedAriaLabel}}
  {{on "keydown" this.keyDown}}
  {{on "click" this.click}}
  {{on "mousedown" this.mouseDown}}
>
  {{#if @isLoading}}
    {{~d-icon "spinner" class="loading-icon"~}}
  {{else}}
    {{#if @icon}}
      {{~d-icon @icon~}}
    {{/if}}
  {{/if}}

  {{~#if this.computedLabel~}}
    <span class="d-button-label">
      {{~html-safe this.computedLabel~}}
      {{~#if @ellipsis~}}
        &hellip;
      {{~/if~}}
    </span>
  {{~else if (not (has-block))~}}
    &#8203;
    {{! Zero-width space character, so icon-only button height = regular button height }}
  {{~/if~}}

  {{yield}}
</button>