fix(types): add HTML attributes for JSX

Close #435

diff --git a/src/RouterLink.ts b/src/RouterLink.ts
index 03ba7170b1d1966bc920d452573af9663e4144f5..6fa1a59ebe4f3bbf7812a2a7b89756dc6ac70cc4 100644 (file)
--- a/src/RouterLink.ts
+++ b/src/RouterLink.ts
@@ -7,6 +7,7 @@ import {
   reactive,
   unref,
   VNodeProps,
+  HTMLAttributes,
 } from 'vue'
 import { RouteLocationRaw, VueUseOptions, RouteLocation } from './types'
 import { isSameRouteLocationParams, isSameRouteRecord } from './location'
@@ -186,7 +187,7 @@ export const RouterLinkImpl = defineComponent({
 // also to avoid inline import() in generated d.ts files
 export const RouterLink = (RouterLinkImpl as any) as {
   new (): {
-    $props: VNodeProps & RouterLinkProps
+    $props: HTMLAttributes & VNodeProps & RouterLinkProps
   }
 }
 

diff --git a/src/RouterView.ts b/src/RouterView.ts
index 39afae54de8ba4d83ac8b2c6d583508785d12674..0a50a4cfa9df375a2c094a74d0aee22a3c3336eb 100644 (file)
--- a/src/RouterView.ts
+++ b/src/RouterView.ts
@@ -9,6 +9,7 @@ import {
   VNodeProps,
   getCurrentInstance,
   computed,
+  HTMLAttributes,
 } from 'vue'
 import { RouteLocationNormalized, RouteLocationNormalizedLoaded } from './types'
 import {
@@ -108,7 +109,7 @@ export const RouterViewImpl = defineComponent({
 // also to avoid inline import() in generated d.ts files
 export const RouterView = (RouterViewImpl as any) as {
   new (): {
-    $props: VNodeProps & RouterViewProps
+    $props: HTMLAttributes & VNodeProps & RouterViewProps
   }
 }
 

diff --git a/test-dts/components.test-d.tsx b/test-dts/components.test-d.tsx
index 97d39aebb90b5e961cc4349b19d4d7322d8232cd..6b970012fc6e73080984992f0430c769eab27707 100644 (file)
--- a/test-dts/components.test-d.tsx
+++ b/test-dts/components.test-d.tsx
@@ -21,10 +21,11 @@ expectError(<RouterLink to="/" custom="text" />)
 expectError(<RouterLink to="/" replace="text" />)
 expectType<JSX.Element>(<RouterLink to="/foo" replace />)
 expectType<JSX.Element>(<RouterLink to="/foo" />)
+expectType<JSX.Element>(<RouterLink class="link" to="/foo" />)
 expectType<JSX.Element>(<RouterLink to={{ path: '/foo' }} />)
 expectType<JSX.Element>(<RouterLink to={{ path: '/foo' }} custom />)
 
 // RouterView
-expectType<JSX.Element>(<RouterView />)
+expectType<JSX.Element>(<RouterView class="view" />)
 expectType<JSX.Element>(<RouterView name="foo" />)
 expectType<JSX.Element>(<RouterView route={router.currentRoute.value} />)