<script lang="ts">
    import Chart from 'chart.js'
  export let config: Chart.ChartConfiguration;

    console.log('!!', {...config});

  const handleChart = (element: HTMLCanvasElement, config: Chart.ChartConfiguration) => {
      let theChart = new Chart(element, config)

      console.log('!',config);

      return {
          update(config) {
              theChart.destroy()
              theChart = new Chart(element, config)
          },
          destroy() {
              theChart.destroy()
          }
      }
  }
</script>
<div class="chart">
  <canvas use:handleChart={config}></canvas>
</div>
<style lang="scss">
  @import 'src/scss/variables';
  @import 'src/scss/media';
  @import 'src/scss/mixins';

  .chart {
    width: 100%;
    position: relative;
  }
</style>