fix: fix compatability with Vue >=2.7 (#967)

Author: dangreen

.size-limit.json

@@ -1,7 +1,7 @@
 [
   {
     "path": "dist/index.js",
-    "limit": "1.9 KB",
+    "limit": "1.95 KB",
     "webpack": false,
     "running": false
   },

src/typedCharts.ts

@@ -14,6 +14,7 @@ import {
 import type { TypedChartComponent, ChartComponentRef } from './types.js'
 import { CommonProps } from './props.js'
 import { Chart } from './chart.js'
+import { compatProps } from './utils.js'
 
 export function createTypedChart<
   TType extends ChartType = ChartType,
@@ -36,11 +37,18 @@ export function createTypedChart<
       expose({ chart: ref })
 
       return () => {
-        return h(Chart, {
-          ref: reforwardRef as any,
-          type,
-          ...props
-        })
+        return h(
+          Chart,
+          compatProps(
+            {
+              ref: reforwardRef as any
+            },
+            {
+              type,
+              ...props
+            }
+          )
+        )
       }
     }
   }) as any

src/utils.ts

@@ -1,4 +1,4 @@
-import { isProxy, toRaw } from 'vue'
+import { isProxy, toRaw, version } from 'vue'
 import type {
   Chart,
   ChartType,
@@ -8,6 +8,13 @@ import type {
   DefaultDataPoint
 } from 'chart.js'
 
+export const compatProps =
+  version[0] === '2'
+    ? <I extends {}, T extends {}>(internals: I, props: T) =>
+        Object.assign(internals, { attrs: props }) as unknown as I & T
+    : <I extends {}, T extends {}>(internals: I, props: T) =>
+        Object.assign(internals, props)
+
 export function toRawIfProxy<T>(obj: T) {
   return isProxy(obj) ? toRaw(obj) : obj
 }

website/src/migration-guides/index.md

@@ -21,6 +21,7 @@ If you are experiencing this problem with Jest, you should follow [this doc](htt
 - `chartOptions` props were renamed to `options`
 - unknown props will fall through to the canvas element.
 - `generateChart` were refactored and renamed to `createTypedChart`
+- Vue.js < 2.7 is no longer supported. If you want to use vue-chartjs with Vue < 2.7 you have to lock your version to 4.x.
 
 ## Migration from v3 to v4