Merge branch 'main' into fix/sidebar-label-hmr

web-infra-dev · Feb 22, 2024 · 8e45f16 · 8e45f16
2 parents e911841 + 4a73062
commit 8e45f16
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/.changeset/orange-beans-matter.md b/.changeset/orange-beans-matter.md
@@ -0,0 +1,5 @@
+---
+"@rspress/theme-default": patch
+---
+
+feat: pass through HTMLAnchorElement props to Link component.
diff --git a/packages/theme-default/src/components/Link/index.tsx b/packages/theme-default/src/components/Link/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { ComponentProps } from 'react';
 import {
   matchRoutes,
   useLocation,
@@ -14,7 +14,7 @@ import { isExternalUrl } from '@rspress/shared';
 import styles from './index.module.scss';
 import { scrollToTarget } from '#theme/logic';
 
-export interface LinkProps {
+export interface LinkProps extends ComponentProps<'a'> {
   href?: string;
   children?: React.ReactNode;
   className?: string;
@@ -24,7 +24,7 @@ export interface LinkProps {
 nprogress.configure({ showSpinner: false });
 
 export function Link(props: LinkProps) {
-  const { href = '/', children, className = '', onNavigate } = props;
+  const { href = '/', children, className = '', onNavigate, ...rest } = props;
   const isExternal = isExternalUrl(href);
   const target = isExternal ? '_blank' : '';
   const rel = isExternal ? 'noopener noreferrer' : undefined;
@@ -81,6 +81,7 @@ export function Link(props: LinkProps) {
   if (!isExternal) {
     return (
       <a
+        {...rest}
         className={`${styles.link} ${className} cursor-pointer`}
         rel={rel}
         target={target}
@@ -93,6 +94,7 @@ export function Link(props: LinkProps) {
   } else {
     return (
       <a
+        {...rest}
         href={withBaseUrl}
         target={target}
         rel={rel}

diff --git a/packages/theme-default/src/layout/DocLayout/docComponents/link.tsx b/packages/theme-default/src/layout/DocLayout/docComponents/link.tsx
@@ -1,6 +1,6 @@
 import { ComponentProps } from 'react';
-import { Link } from '../../../components/Link';
 import styles from './index.module.scss';
+import { Link } from '#theme/components/Link';
 import { usePathUtils } from '#theme/logic';
 
 export const A = (props: ComponentProps<'a'>) => {