diff --git a/docs/03-customization/01-elements/page.md b/docs/03-customization/01-elements/page.md index 61491522..b0ec4ba3 100644 --- a/docs/03-customization/01-elements/page.md +++ b/docs/03-customization/01-elements/page.md @@ -2,7 +2,7 @@ `Page` is a block responsible for the content of the document itself. It handles displaying markdown-based files as HTML. -```tsx filename ="/docs/example/page.tsx" +```tsx filename="/docs/example/page.tsx" import { Page } from "./robindoc"; export const Page = ({ children }) => { diff --git a/packages/robindoc/package.json b/packages/robindoc/package.json index 72612c61..f6e370e4 100644 --- a/packages/robindoc/package.json +++ b/packages/robindoc/package.json @@ -1,6 +1,6 @@ { "name": "robindoc", - "version": "2.0.0", + "version": "2.0.1", "description": "", "main": "./lib/index.js", "scripts": { diff --git a/packages/robindoc/src/components/blocks/nav-link/index.tsx b/packages/robindoc/src/components/blocks/nav-link/index.tsx index c612adb4..568cb2ae 100644 --- a/packages/robindoc/src/components/blocks/nav-link/index.tsx +++ b/packages/robindoc/src/components/blocks/nav-link/index.tsx @@ -1,19 +1,40 @@ "use client"; import React, { forwardRef } from "react"; -import Link, { LinkProps } from "next/link"; +import Link, { type LinkProps } from "next/link"; +import { usePathname } from "next/navigation"; +import clsx from "clsx"; import { useNavigate } from "@src/components/contexts/navigate/use-navigate"; -type NavLinkProps = React.AnchorHTMLAttributes & React.PropsWithChildren; +type NavLinkProps = React.AnchorHTMLAttributes & + React.PropsWithChildren & { + activeClassName?: string; + targetClassName?: string; + }; -export const NavLink = forwardRef(({ onClick, ...props }, ref) => { - const { listeners } = useNavigate(); +export const NavLink = forwardRef( + ({ onClick, className, href, targetClassName, activeClassName, ...props }, ref) => { + const { listeners } = useNavigate(); + const pathname = usePathname(); - const clickHandler = (e: React.MouseEvent) => { - [...listeners].forEach((el) => el.listener()); - if (onClick) onClick(e); - }; + const clickHandler = (e: React.MouseEvent) => { + [...listeners].forEach((el) => el.listener()); + if (onClick) onClick(e); + }; - return ; -}); + return ( + + ); + }, +); diff --git a/packages/robindoc/src/components/elements/header/header.scss b/packages/robindoc/src/components/elements/header/header.scss index 13bc856e..489e5690 100644 --- a/packages/robindoc/src/components/elements/header/header.scss +++ b/packages/robindoc/src/components/elements/header/header.scss @@ -46,11 +46,20 @@ transition: color 0.2s; &:hover, - &:focus { + &:focus-visible { color: var(--neutral950); } } +.r-header-link._target { + color: var(--primary800); + + &:hover, + &:focus-visible { + color: var(--primary700); + } +} + .r-header-actions { display: flex; flex-direction: column-reverse; diff --git a/packages/robindoc/src/components/elements/header/index.tsx b/packages/robindoc/src/components/elements/header/index.tsx index 5d590fb4..2ab074a0 100644 --- a/packages/robindoc/src/components/elements/header/index.tsx +++ b/packages/robindoc/src/components/elements/header/index.tsx @@ -50,7 +50,12 @@ export const Header: React.FC = ({ logo, versions, locales, links =