{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: MPL-2.0
~}}

<label
  data-test-stepper-label
  for="stepper-input-{{this.elementId}}"
  class="stepper-input-label"
>{{yield}}</label>
<input
  data-test-stepper-input
  type="number"
  min={{this.min}}
  max={{this.max}}
  value={{this.internalValue}}
  disabled={{this.disabled}}
  id="stepper-input-{{this.elementId}}"
  class="stepper-input-input"
  onFocus={{action "selectValue"}}
  onKeyUp={{action "resetTextInput"}}
  onChange={{action "setValue"}}
/>
<button
  data-test-stepper-decrement
  role="button"
  aria-label="decrement"
  class="stepper-input-stepper button {{this.class}}"
  disabled={{or this.disabled (lte this.internalValue this.min)}}
  onclick={{action "decrement"}}
  type="button"
>
  {{x-icon "minus-plain"}}
</button>
<button
  data-test-stepper-increment
  role="button"
  aria-label="increment"
  class="stepper-input-stepper button {{this.class}}"
  disabled={{or this.disabled (gte this.internalValue this.max)}}
  onclick={{action "increment"}}
  type="button"
>
  {{x-icon "plus-plain"}}
</button>