import templateOnly from '@ember/component/template-only';
import { setComponentTemplate } from '@ember/component';
import { precompileTemplate } from '@ember/template-compilation';
import castTo from '../helpers/cast-to.js';
import classNames from '../helpers/class-names.js';

const EuiRangeThumb = setComponentTemplate(precompileTemplate(`
  {{! template-lint-disable }}
  <button
    type="button"
    class={{classNames
      "euiRangeThumb"
      (if @showTicks "euiRangeThumb--hasTicks")
    }}
    aria-valuemin={{@min}}
    aria-valuemax={{@max}}
    aria-valuenow={{castTo @value to="number"}}
    aria-diabled={{@disabled}}
    tabindex={{if @disabled -1 (if @tabIndex @tabIndex 0)}}
    ...attributes
  >
    <div
      role="slider"
      aria-valuemin={{@min}}
      aria-valuemax={{@max}}
      aria-valuenow={{castTo @value to="number"}}
      aria-diabled={{@disabled}}
      tabindex={{if @disabled -1 (if @tabIndex 0)}}
    ></div>
  </button>
  {{! template-lint-enable }}
`, {
  strictMode: true,
  scope: () => ({
    classNames,
    castTo
  })
}), templateOnly("eui-range-thumb", "EuiRangeThumb"));

export { EuiRangeThumb as default };
//# sourceMappingURL=eui-range-thumb.js.map
