text: function newGovernanceUtilitiesTables() {
      let thisObject = {
          addHTML: addHTML
      }
  
      return thisObject
  
      function addHTML(
          table,
          tableRecords,
          tableRecordDefinition,
          sortingOrder,
          tabIndex
      ) {
          let HTML = ''
          let resultCounter = 0
          /*
          Get the property type for the current sorting order.
          */
          let propertyType
          for (let i = 0; i < tableRecordDefinition.properties.length; i++) {
              let property = tableRecordDefinition.properties[i]
              if (property.name === sortingOrder.property) {
                  propertyType = property.type
                  break
              }
          }
          /*
          Apply the sorting order for this table.
          */
          switch (propertyType) {
              case 'string': {
                  switch (sortingOrder.order) {
                      case 'ascending': {
                          tableRecords.sort((a, b) => (a[sortingOrder.property].toLowerCase() > b[sortingOrder.property].toLowerCase()) ? 1 : -1)
                          break
                      }
                      case 'descending': {
                          tableRecords.sort((a, b) => (a[sortingOrder.property].toLowerCase() > b[sortingOrder.property].toLowerCase()) ? -1 : 1)
                          break
                      }
                  }
                  break
              }
              case 'number': {
                  switch (sortingOrder.order) {
                      case 'ascending': {
                          tableRecords.sort((a, b) => (a[sortingOrder.property] > b[sortingOrder.property]) ? 1 : -1)
                          break
                      }
                      case 'descending': {
                          tableRecords.sort((a, b) => (a[sortingOrder.property] > b[sortingOrder.property]) ? -1 : 1)
                          break
                      }
                  }
                  break
              }
          }
          /*
          Build the HTML
          */
          let odd = false
          const upArrow = '&uarr;'
          const downArrow = '&darr;'
  
          HTML = HTML + '<section id="governance-report-page-div" class="governance-search-result-content">'
  
          HTML = HTML + '<table class="governance-info-table">'
          HTML = HTML + '<thead>'
          HTML = HTML + '<tr>'
          for (let i = 0; i < tableRecordDefinition.properties.length; i++) {
              let property = tableRecordDefinition.properties[i]
              let newOrder
              let orderArrow
              /*
              If the property is the one defining the order, then the new order will be
              the opossite order.
              */
              if (property.name === sortingOrder.property) {
                  if (sortingOrder.order === 'ascending') {
                      newOrder = 'descending'
                      orderArrow = upArrow
                  } else {
                      newOrder = 'ascending'
                      orderArrow = downArrow
                  }
              } else {
                  orderArrow = ""
                  /*
                  If the property is not the current defininf the order, then the new order will
                  be the default order for that property.
                  */
                  for (let i = 0; i < tableRecordDefinition.properties.length; i++) {
                      let propertyDefinition = tableRecordDefinition.properties[i]
                      if (property.name === propertyDefinition.name) {
                          newOrder = propertyDefinition.order
                          break
                      }
                  }
              }
              HTML = HTML + '<th>' + '<a href="#" onClick="UI.projects.governance.spaces.reportsSpace.changeTableSortingOrder(\'' + table + '\',\'' + property.name + '\',\'' + newOrder + '\',\'' + tabIndex + '\')">' + property.label + ' ' + orderArrow + '</a>' + '</th>'
          }
          HTML = HTML + '</tr>'
          HTML = HTML + '<thead>'
          HTML = HTML + '<tbody>'
  
          for (let j = 0; j < tableRecords.length; j++) {
              let textAligment = 'center'
              let format = 'text'
              let tableRecord = tableRecords[j]
  
              if (odd === true) {
                  HTML = HTML + '<tr class="governance-info-table-alt-bg">'
                  odd = false
              } else {
                  HTML = HTML + '<tr>'
                  odd = true
              }
  
              /*
              Iterate through tableRecord properties.
              */
              for (var property in tableRecord) {
                  if (Object.prototype.hasOwnProperty.call(tableRecord, property)) {
  
                      /*
                      Get Text Align and Format
                      */
                      for (let i = 0; i < tableRecordDefinition.properties.length; i++) {
                          let propertyDefinition = tableRecordDefinition.properties[i]
                          if (property === propertyDefinition.name) {
                              textAligment = propertyDefinition.textAlign
                              format = propertyDefinition.format
                              break
                          }
                      }
                      let value = tableRecord[property]
                      switch (format) {
                          case 'text': {
  
                              break
                          }
                          case 'integer': {
                              value = parseFloat(value | 0).toLocaleString('en')
                              break
                          }
                          case '2 decimals': {
                              value = parseFloat(value | 2).toLocaleString('en')
                              break
                          }
                          case 'percentage': {
                              if (isNaN(value)) { value = 0 }
                              value = (value * 100).toFixed(2) + " %"
                              break
                          }
                      }
                      HTML = HTML + '<td style="text-align:' + textAligment + ';">' + value + '</td>'
                  }
              }
  
              resultCounter++
  
              HTML = HTML + '</tr>'
          }
  
          HTML = HTML + '<tbody>'
          HTML = HTML + '</table>'
  
          HTML = HTML + '</section>'
  
          return { HTML: HTML, resultCounter: resultCounter }
      }
  }