Testing an MDB5 Pro WordPress theme and have run into problems executing javascript as shown on MDB 5 Pro site (https://mdbootstrap.com/docs/standard/data/charts/#section-bar-chart)

Expected behavior

scripts referencing mdb.min.js to execute as per examples. In this ticket I am showing the bar chart example. I expected the output using the Javascript initialization example to show. NOTE: The CSS only example works fine:

<canvas
  data-mdb-chart="bar"
  data-mdb-dataset-label="Traffic"
  data-mdb-labels="['Monday', 'Tuesday' , 'Wednesday' , 'Thursday' , 'Friday' , 'Saturday' , 'Sunday ']"
  data-mdb-dataset-data="[2112, 2343, 2545, 3423, 2365, 1985, 987]"
></canvas>

Actual behavior

Uncaught Reference Error: mdb is not defined

Resources (screenshots, code snippets etc.)

Console

(index):44 Uncaught Reference Error: mdb is not defined at (index):44

view-source (line 44)

new mdb.Chart(document.getElementById('bar-chart'), dataBar);

view-source (body excerpt)

<section>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xl-12">
                <div class="lc-block">
                    <script>
// Chart
const dataBar = {
  type: 'bar',
  data: {
    labels: ['Monday', 'Tuesday' , 'Wednesday' , 'Thursday' , 'Friday' , 'Saturday' , 'Sunday '],
    datasets: [
      {
        label: 'Traffic',
        data: [2112, 2343, 2545, 3423, 2365, 1985, 987],
      },
    ],
  },
};

new mdb.Chart(document.getElementById('bar-chart'), dataBar);
</script>
                    <canvas id="bar-chart"></canvas>
                </div><!-- /lc-block -->
            </div><!-- /col -->
        </div>
    </div>

view-source (footer excerpt)

</footer>

<script src='http://wordfishgroup.local/wp-content/themes/picostrap-mdb5pro/js/popper.min.js?ver=2.5.4' id='Popper-js'></script>

<script src='http://wordfishgroup.local/wp-content/themes/picostrap-mdb5pro/js/mdb.min.js?ver=5.0.0' id='mdb-js'></script>

                <canvas id="bar-chart"></canvas>
                <script>// Chart