I was wondering If I could get some help with sparkline graphs in my component, as I’m still very much new to this.

For now, I just want to display a graph with default settings and an array of numbers passed in as a prop for the values. The site opens, the grid portion of the component renders but no sparkline is shown with no errors in browsers developer console. The site is a fully powered by vue. Any tips greatly appreciated, I’ve been banging my head against this for a couple days now.

<template>
    <v-container>
      <v-row>

        <v-col>
          <v-card>
            <v-sparkline :value="values"></v-sparkline>
          </v-card>
        </v-col>

        <v-col>
          <p>text</p>
        </v-col>

      </v-row>
  
      <v-row>

        <v-col>
          <p>text</p>
        </v-col>

        <v-col>
          <p>text</p>
        </v-col>

      </v-row>

    </v-container>
  </template>
  
  <script setup lang="ts">
  import { ref } from 'vue';
 
  const props = defineProps({
    values: {
      type: Array,
    }
  });
  
  </script>

<template>
   <Heading title="Graphs" icon=mdi-chart-bar></Heading>
   <v-main class="pa-4">
        <Graph_grid :values="numbers"/> 
    </v-main>
</template>
  
  <script setup lang="ts">
    import Heading from "@/components/Heading.vue";
    import Graph_grid from "@/components/Graph_grid.vue";

    const numbers = [0, 2, 5, 9, 5, 10, 3, 5, 0, 0, 1, 8, 2, 9, 0];

  </script>