{{#if (or (has-block) this.isVisible)}}
  <div class="info-table-row" data-test-component="info-table-row" ...attributes>
    <div
      class="column is-one-quarter {{if this.hasLabelOverflow 'label-overflow'}}"
      data-test-label-div
      {{did-insert this.calculateLabelOverflow}}
    >
      {{#if @label}}
        {{#if this.hasLabelOverflow}}
          <ToolTip @verticalPosition="below" @horizontalPosition="left" as |T|>
            <T.Trigger @tabindex={{false}}>
              <span class="is-label has-text-grey-dark" data-test-row-label={{@label}}>{{@label}}</span>
            </T.Trigger>
            <T.Content @defaultClass="tool-tip">
              <div class="box fit-content" data-test-label-tooltip>
                {{@label}}
              </div>
            </T.Content>
          </ToolTip>
        {{else}}
          <span class="is-label has-text-grey-dark" data-test-row-label={{@label}}>{{@label}}</span>
        {{/if}}
        {{#if @helperText}}
          <div>
            <span class="is-label helper-text has-text-grey">{{@helperText}}</span>
          </div>
        {{/if}}
      {{else}}
        <Icon @name="minus" />
      {{/if}}
    </div>
    <div class="column is-flex" data-test-value-div={{@label}}>
      {{#if @addCopyButton}}
        <div class="display-only">
          <CopyButton
            @clipboardText={{@value}}
            @success={{action (set-flash-message "Data copied!")}}
            class="button copy-button is-compact"
            data-test-copy-button
          >
            <Icon @name="clipboard-copy" aria-hidden="Copy value" />
          </CopyButton>
        </div>
      {{/if}}
      {{#if (has-block)}}
        {{yield}}
      {{else if this.valueIsBoolean}}
        {{#if @value}}
          <Icon class="icon-true" @name="check-circle" data-test-boolean-true />
          Yes
        {{else}}
          <Icon @name="x-square" class="icon-false" data-test-boolean-false />
          No
        {{/if}}
        {{! @alwaysRender (this.isVisible) is still true }}
      {{else if this.valueIsEmpty}}
        {{#if @defaultShown}}
          <span data-test-row-value={{@label}}>{{@defaultShown}}</span>
        {{else}}
          <Icon @name="minus" />
        {{/if}}
      {{else if @formatDate}}
        {{date-format @value @formatDate}}
      {{else if @formatTtl}}
        {{this.formattedTtl}}
      {{else}}
        {{#if (eq @type "array")}}
          <InfoTableItemArray
            @label={{@label}}
            @backend={{@backend}}
            @displayArray={{@value}}
            @isLink={{@isLink}}
            @modelType={{@modelType}}
            @queryParam={{@queryParam}}
            @wildcardLabel={{@wildcardLabel}}
            @rootRoute={{@rootRoute}}
            @itemRoute={{@itemRoute}}
            @doNotTruncate={{@doNotTruncate}}
            @renderItemName={{@renderItemName}}
          />
        {{else}}
          {{#if @tooltipText}}
            <ToolTip @verticalPosition="above" @horizontalPosition="left" as |T|>
              <T.Trigger @tabindex={{false}}>
                <span class="is-word-break has-text-black" data-test-row-value={{this.label}}>{{this.value}}</span>
              </T.Trigger>
              <T.Content @defaultClass="tool-tip">
                <CopyButton
                  @clipboardText={{@tooltipText}}
                  @success={{action (set-flash-message "Data copied!")}}
                  @tagName="div"
                  disabled={{not @isTooltipCopyable}}
                  class={{if @isTooltipCopyable "has-pointer"}}
                  data-test-tooltip-copy
                >
                  <div class="box">
                    {{@tooltipText}}
                  </div>
                </CopyButton>
              </T.Content>
            </ToolTip>
          {{else}}
            <span class="is-word-break has-text-black" data-test-row-value={{@label}}>{{@value}}</span>
          {{/if}}
        {{/if}}
      {{/if}}
    </div>
  </div>
{{/if}}