fix(types): fix spreading VNodeData in tsx (#12789)

fix #12778

types/test/vue-test.ts

@@ -228,21 +228,21 @@ obj.a++
 const ComponentWithStyleInVNodeData = Vue.extend({
   render(h) {
     const elementWithStyleAsString = h('div', {
-      style: 'background-color: red;'
+      style: '--theme-color: black;'
     })
 
-    const elementWithStyleAsObject = h('div', {
-      style: { backgroundColor: 'green' }
+    const elementWithStyleCSSProperties = h('div', {
+      style: { ['--theme-color' as any]: 'black' }
     })
 
-    const elementWithStyleAsArrayOfObjects = h('div', {
-      style: [{ backgroundColor: 'blue' }]
+    const elementWithStyleAsArrayOfStyleValues = h('div', {
+      style: [{ ['--theme-color' as any]: 'black' }]
     })
 
     return h('div', undefined, [
       elementWithStyleAsString,
-      elementWithStyleAsObject,
-      elementWithStyleAsArrayOfObjects
+      elementWithStyleCSSProperties,
+      elementWithStyleAsArrayOfStyleValues
     ])
   }
 })

types/vnode.d.ts

@@ -1,3 +1,4 @@
+import { StyleValue } from './jsx'
 import { Vue } from './vue'
 import { DirectiveFunction, DirectiveOptions } from './options'
 import { Ref } from './v3-generated'
@@ -85,7 +86,7 @@ export interface VNodeData {
   staticClass?: string
   class?: any
   staticStyle?: { [key: string]: any }
-  style?: string | object[] | object
+  style?: StyleValue
   props?: { [key: string]: any }
   attrs?: { [key: string]: any }
   domProps?: { [key: string]: any }