{{#if @dataset}}
  <svg
    data-test-horizontal-bar-chart
    class="chart is-horizontal"
    {{on "mouseleave" this.removeTooltip}}
    {{did-insert this.renderChart @dataset}}
    {{did-update this.renderChart @dataset}}
  >
  </svg>
{{else}}
  <EmptyState @subTitle={{or @noDataMessage "No data to display"}} @bottomBorder={{true}} />
{{/if}}
{{#if this.tooltipTarget}}
  {{! Required to set tag name = div https://github.com/yapplabs/ember-modal-dialog/issues/290 }}
  {{! Component must be in curly bracket notation }}
  {{! template-lint-disable no-curly-component-invocation }}
  {{#modal-dialog
    tagName="div"
    tetherTarget=this.tooltipTarget
    targetAttachment="bottom middle"
    attachment="bottom middle"
    offset="35px 0"
  }}
    <div class={{concat "chart-tooltip horizontal-chart " (if this.isLabel "is-label-fit-content")}}>
      <p>{{this.tooltipText}}</p>
    </div>
    <div class="chart-tooltip-arrow"></div>
  {{/modal-dialog}}
{{/if}}