Compatible with the chartjs-adapter-date-fns?

currently in the process of migrating my chart.js to use the Stimulus controller. The code before the migration is the following:

<!-- index.html -->
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style type="text/css">
        .charBox {
            width: 700px;
        }
    </style>
  </head>

  <body>
    <div class="charBox">
      <canvas id="myChart"></canvas>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.bundle.min.js"></script>

    <script>
    // setup
    const data = {
      datasets: [{
        label: 'Interest rate',
        stepped: true,
        data: [
          { x: '2019-03-05', y: 6.2 },
          { x: '2019-04-01', y: 6.2 },
          { x: '2019-05-01', y: 6.2 },
          { x: '2019-06-01', y: 6.2 },
          { x: '2021-04-01', y: 6.0 },
          { x: '2021-05-01', y: 5.0 },
          { x: '2021-07-01', y: 4.0 },
          { x: '2021-09-01', y: 4.5 }
        ],
        backgroundColor: 'rgba(54, 162, 235, 0.2)',
        borderColor: 'rgba(54, 162, 235, 1)',
        borderWidth: 1
      }]
    };

    // config
    const config = {
      type: 'line',
      data,
      options: {
        scales: {
          x: {
            type: "time",
            time: {
              unit: 'month'
            }
          }
        },
      }
    };

    const myChart = new Chart(
      document.getElementById('myChart'),
      config
    );

    </script>
  </body>
</html>

Which looks like:

The data in the chart.js that I'm currently migrating is an Array of Hashes such as data: [{ x: '2019-03-05', y: 6.2 },{ x: '2019-04-01', y: 6.2 },..]. I know that this data format is possible because I'm currently using the chartjs-adapter-date-fns. Since the example in the docs is just an Array of Integers data: [37, 83, 78, 54, 12, 5, 99], is that the only format that is supported? Event if I use the chartjs-adapter-date-fns library with stimulus-chartjs it doesn't seem to take effect. This is what I get:

app/javascript/controllers/index.js:

import { Application } from "stimulus"
import { definitionsFromContext } from "stimulus/webpack-helpers"
import Chart from "stimulus-chartjs"
import 'chartjs-adapter-date-fns';

const application = Application.start()
const context = require.context(".", true, /\.js$/)
application.load(definitionsFromContext(context))
application.register("chart", Chart)

app/controllers/charts_controller.rb:

class ChartsController < ApplicationController
  def show
    @chart_data = {
      datasets: [{
        label: 'Interest rate',
        stepped: true,
        data: [
          { x: '2019-03-05', y: 6.2 },
          { x: '2019-04-01', y: 6.2 },
          { x: '2019-05-01', y: 6.2 },
          { x: '2019-06-01', y: 6.2 },
          { x: '2021-04-01', y: 6.0 },
          { x: '2021-05-01', y: 5.0 },
          { x: '2021-07-01', y: 4.0 },
          { x: '2021-09-01', y: 4.5 }
        ],
        backgroundColor: 'rgba(54, 162, 235, 0.2)',
        borderColor: 'rgba(54, 162, 235, 1)',
        borderWidth: 1
      }]
    }

    @chart_options = {
      scales: {
        x: {
          type: "time",
          time: {
            unit: 'month'
          }
        }
      }
    }
  end
end

app/views/charts/show.html.erb:

<div class="chart-container" style="position: relative; height:40vh; width:80vw">
<canvas
  data-controller="chart"
  data-chart-type-value="line"
  data-chart-data-value="<%= @chart_data.to_json %>"
  data-chart-options-value="<%= @chart_options.to_json %>"
></canvas>
</div>

It would be extremely helpful if this library was able to play nicely with chartjs-adapter-date-fns by default would that be possible? or does that logic belong in a different library?

stimulus-components / stimulus-chartjs

Compatible with the chartjs-adapter-date-fns? #2