From efbcd461cbba0b9b656c3642cd6a3ac60ac38542 Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 21:28:59 +0200 Subject: [PATCH 1/7] Move render-component to a separate file --- src/components/footer/index.tsx | 2 +- src/components/navbar/navbar.tsx | 2 +- src/components/nextra-mdx-wrapper.tsx | 2 +- src/components/sidebar.tsx | 2 +- src/components/table-of-contents.tsx | 2 +- src/components/{utils.tsx => utils/render-component.tsx} | 0 6 files changed, 5 insertions(+), 5 deletions(-) rename src/components/{utils.tsx => utils/render-component.tsx} (100%) diff --git a/src/components/footer/index.tsx b/src/components/footer/index.tsx index 0d85dae932..d372f9e5b5 100644 --- a/src/components/footer/index.tsx +++ b/src/components/footer/index.tsx @@ -6,7 +6,7 @@ import { SocialIcons } from "@/app/conf/_components/social-icons" import { StripesDecoration } from "@/app/conf/_design-system/stripes-decoration" import blurBean from "@/app/conf/2025/components/footer/blur-bean.webp" -import { renderComponent } from "../utils" +import { renderComponent } from "../utils/render-component" import { Anchor } from "@/app/conf/_design-system/anchor" import type { ReactNode } from "react" import { ConferenceFooterBox } from "./conference-footer-box" diff --git a/src/components/navbar/navbar.tsx b/src/components/navbar/navbar.tsx index 536b69d279..76eea928a0 100644 --- a/src/components/navbar/navbar.tsx +++ b/src/components/navbar/navbar.tsx @@ -8,7 +8,7 @@ import type * as normalizePages from "nextra/normalize-pages" import { Fragment, useState, type ReactElement, type ReactNode } from "react" import { useMenu, useThemeConfig } from "nextra-theme-docs" import { Anchor } from "@/app/conf/_design-system/anchor" -import { renderComponent } from "@/components/utils" +import { renderComponent } from "@/components/utils/render-component" import MenuIcon from "@/app/conf/_design-system/pixelarticons/menu.svg?svgr" import CloseIcon from "@/app/conf/_design-system/pixelarticons/close.svg?svgr" diff --git a/src/components/nextra-mdx-wrapper.tsx b/src/components/nextra-mdx-wrapper.tsx index cb7a834abc..f88f9170fd 100644 --- a/src/components/nextra-mdx-wrapper.tsx +++ b/src/components/nextra-mdx-wrapper.tsx @@ -11,7 +11,7 @@ import { import { clsx } from "clsx" import { Sidebar } from "./sidebar" -import { renderComponent } from "./utils" +import { renderComponent } from "./utils/render-component" import { TableOfContents } from "./table-of-contents" const classes = { diff --git a/src/components/sidebar.tsx b/src/components/sidebar.tsx index 2556edc8a8..e1f8d1d7ed 100644 --- a/src/components/sidebar.tsx +++ b/src/components/sidebar.tsx @@ -20,7 +20,7 @@ import { useState, } from "react" import scrollIntoView from "scroll-into-view-if-needed" -import { renderComponent } from "./utils" +import { renderComponent } from "./utils/render-component" import { useActiveAnchor, useMenu, diff --git a/src/components/table-of-contents.tsx b/src/components/table-of-contents.tsx index 96fa9afd9a..602ecd0924 100644 --- a/src/components/table-of-contents.tsx +++ b/src/components/table-of-contents.tsx @@ -8,7 +8,7 @@ import { useEffect, useRef, type ReactElement } from "react" import scrollIntoView from "scroll-into-view-if-needed" import { Anchor } from "../app/conf/_design-system/anchor" -import { renderComponent } from "./utils" +import { renderComponent } from "./utils/render-component" import { BackToTop } from "./back-to-top" export type TableOfContentsProps = { diff --git a/src/components/utils.tsx b/src/components/utils/render-component.tsx similarity index 100% rename from src/components/utils.tsx rename to src/components/utils/render-component.tsx From d7325a57f429bcbeeeef9f5bb13ec2b942c1edba Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 21:31:35 +0200 Subject: [PATCH 2/7] Add extractStringsFromReactNode --- .../utils/extract-strings-from-react-node.tsx | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 src/components/utils/extract-strings-from-react-node.tsx diff --git a/src/components/utils/extract-strings-from-react-node.tsx b/src/components/utils/extract-strings-from-react-node.tsx new file mode 100644 index 0000000000..1e703ca29f --- /dev/null +++ b/src/components/utils/extract-strings-from-react-node.tsx @@ -0,0 +1,12 @@ +import { ReactNode } from "react" + +export function extractStringsFromReactNode(node: ReactNode): string { + if (typeof node === 'string') return node + if (typeof node === 'number') return String(node) + if (Array.isArray(node)) + return node.map(n => extractStringsFromReactNode(n)).join('') + + const children = (node as any)?.props?.children as ReactNode + if (!children) return '' + return extractStringsFromReactNode(children) +} From f6dfebbbd3076ec410a1de31167b068d4eac929c Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 21:31:47 +0200 Subject: [PATCH 3/7] Grab Breadcrumbs from Nextra --- src/_design-system/breadcrumbs/index.tsx | 55 ++++++++++++++++++++++++ src/components/nextra-mdx-wrapper.tsx | 4 +- 2 files changed, 57 insertions(+), 2 deletions(-) create mode 100644 src/_design-system/breadcrumbs/index.tsx diff --git a/src/_design-system/breadcrumbs/index.tsx b/src/_design-system/breadcrumbs/index.tsx new file mode 100644 index 0000000000..cb18b37223 --- /dev/null +++ b/src/_design-system/breadcrumbs/index.tsx @@ -0,0 +1,55 @@ +import { Fragment } from "react" +import { clsx } from "clsx" +import NextLink from "next/link" +import { ArrowRightIcon } from "nextra/icons" +import type { Item } from "nextra/normalize-pages" + +import { extractStringsFromReactNode } from "../../components/utils/extract-strings-from-react-node" + +export const Breadcrumbs = ({ activePath }: { activePath: Item[] }) => { + return ( +
+ {activePath.map((item, index, arr) => { + const nextItem = arr[index + 1] + const href = nextItem + ? "frontMatter" in item + ? item.route + : (item as { children: { route: string }[] }).children[0]?.route === + nextItem.route + ? "" + : (item as { children: { route: string }[] }).children[0]?.route + : "" + + const title = extractStringsFromReactNode(item.title) + const className = clsx( + "x:whitespace-nowrap x:transition-colors", + nextItem + ? "x:min-w-6 x:overflow-hidden x:text-ellipsis" + : "x:font-medium x:text-black x:dark:text-gray-100", + href && + "x:focus-visible:nextra-focus x:ring-inset x:hover:text-gray-900 x:dark:hover:text-gray-100", + ) + + return ( + + {index > 0 && ( + + )} + {href ? ( + + {item.title} + + ) : ( + + {item.title} + + )} + + ) + })} +
+ ) +} diff --git a/src/components/nextra-mdx-wrapper.tsx b/src/components/nextra-mdx-wrapper.tsx index f88f9170fd..f5ad84dfc3 100644 --- a/src/components/nextra-mdx-wrapper.tsx +++ b/src/components/nextra-mdx-wrapper.tsx @@ -5,7 +5,6 @@ import { useConfig, useThemeConfig, SkipNavContent, - Breadcrumb, NavLinks, } from "nextra-theme-docs" import { clsx } from "clsx" @@ -13,6 +12,7 @@ import { clsx } from "clsx" import { Sidebar } from "./sidebar" import { renderComponent } from "./utils/render-component" import { TableOfContents } from "./table-of-contents" +import { Breadcrumbs } from "../_design-system/breadcrumbs" const classes = { toc: clsx("nextra-toc order-last max-xl:hidden w-64 shrink-0 print:hidden"), @@ -146,7 +146,7 @@ function Body({ children }: { children: ReactNode }): ReactElement { >
{activeType !== "page" && themeContext.breadcrumb && ( - + )} {body}
From 5b41f5bfa4608c7a735e74b218ffd9ded9161423 Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 21:39:22 +0200 Subject: [PATCH 4/7] Update Nextra and Nextra Theme Docs PNPM patches --- patches/nextra-theme-docs.patch | 69 ++++++++++++++++++++++++++------- patches/nextra.patch | 11 ------ pnpm-lock.yaml | 14 +++---- 3 files changed, 63 insertions(+), 31 deletions(-) diff --git a/patches/nextra-theme-docs.patch b/patches/nextra-theme-docs.patch index f9f3ee4f2e..f5c1d4a00b 100644 --- a/patches/nextra-theme-docs.patch +++ b/patches/nextra-theme-docs.patch @@ -1,8 +1,8 @@ diff --git a/dist/index.d.mts b/dist/index.d.mts -index 71f87bcd1dde49d7c19ad49fc098e715a76c5c10..aadd6228910ee3ebafccfae8672cb9ae1b0bca3c 100644 +index 71f87bcd1dde49d7c19ad49fc098e715a76c5c10..53dffe4fbe5fb2a92cb55a0466bf95315f904e4e 100644 --- a/dist/index.d.mts +++ b/dist/index.d.mts -@@ -1421,3 +1421,25 @@ declare function ThemeSwitch({ lite, className }: ThemeSwitchProps): ReactElemen +@@ -1421,3 +1421,24 @@ declare function ThemeSwitch({ lite, className }: ThemeSwitchProps): ReactElemen declare function Layout({ children, themeConfig, pageOpts }: NextraThemeLayoutProps): ReactElement; export { Bleed, Collapse, type PartialDocsThemeConfig as DocsThemeConfig, Link, LocaleSwitch, Navbar, NotFoundPage, SkipNavContent, SkipNavLink, ThemeSwitch, Layout as default, getComponents, useConfig, useMenu, useThemeConfig }; @@ -22,14 +22,13 @@ index 71f87bcd1dde49d7c19ad49fc098e715a76c5c10..aadd6228910ee3ebafccfae8672cb9ae +export declare const useIntersectionObserver: () => IntersectionObserver | null +export declare const useSlugs: () => WeakMap + -+export declare const Breadcrumb: (props: { activePath: Item[] }) => ReactElement | null +export declare const NavLinks: (props: NavLinkProps) => ReactElement | null +export interface NavLinkProps { + currentIndex: number + flatDocsDirectories: Item[] +} diff --git a/dist/index.js b/dist/index.js -index 56201641fd965dcc5ab7c5df53e444c41293c00e..07147c688ae75c4c7daf082833acc71de16b36ee 100644 +index 56201641fd965dcc5ab7c5df53e444c41293c00e..29a446663f5d24acad0389f873c5e31be910717c 100644 --- a/dist/index.js +++ b/dist/index.js @@ -100,10 +100,10 @@ IntersectionObserverContext.displayName = "IntersectionObserver"; @@ -47,16 +46,52 @@ index 56201641fd965dcc5ab7c5df53e444c41293c00e..07147c688ae75c4c7daf082833acc71d var ActiveAnchorProvider = ({ children }) => { -@@ -526,7 +526,7 @@ import NextLink2 from "next/link"; - import { ArrowRightIcon } from "nextra/icons"; - import { Fragment as Fragment3 } from "react"; - import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime"; +@@ -520,44 +520,6 @@ function Bleed({ + ); + } + +-// src/components/breadcrumb.tsx +-import cn4 from "clsx"; +-import NextLink2 from "next/link"; +-import { ArrowRightIcon } from "nextra/icons"; +-import { Fragment as Fragment3 } from "react"; +-import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime"; -function Breadcrumb({ -+export function Breadcrumb({ - activePath - }) { - return /* @__PURE__ */ jsx9("div", { className: "nextra-breadcrumb _mt-1.5 _flex _items-center _gap-1 _overflow-hidden _text-sm _text-gray-500 dark:_text-gray-400 contrast-more:_text-current", children: activePath.map((item, index, arr) => { -@@ -1255,7 +1255,7 @@ var classes = { +- activePath +-}) { +- return /* @__PURE__ */ jsx9("div", { className: "nextra-breadcrumb _mt-1.5 _flex _items-center _gap-1 _overflow-hidden _text-sm _text-gray-500 dark:_text-gray-400 contrast-more:_text-current", children: activePath.map((item, index, arr) => { +- const nextItem = arr[index + 1]; +- const href = nextItem ? item.withIndexPage ? item.route : item.children[0].route === nextItem.route ? "" : item.children[0].route : ""; +- const ComponentToUse = href ? NextLink2 : "span"; +- return /* @__PURE__ */ jsxs3(Fragment3, { children: [ +- index > 0 && /* @__PURE__ */ jsx9( +- ArrowRightIcon, +- { +- height: "14", +- className: "_shrink-0 rtl:_rotate-180" +- } +- ), +- /* @__PURE__ */ jsx9( +- ComponentToUse, +- __spreadProps(__spreadValues({ +- className: cn4( +- "_whitespace-nowrap _transition-colors", +- nextItem ? "_min-w-6 _overflow-hidden _text-ellipsis" : "_font-medium _text-gray-700 contrast-more:_font-bold contrast-more:_text-current dark:_text-gray-100 contrast-more:dark:_text-current", +- href && "nextra-focus _ring-inset hover:_text-gray-900 dark:hover:_text-gray-100" +- ), +- title: item.title +- }, href && { href }), { +- children: item.title +- }) +- ) +- ] }, item.route + item.name); +- }) }); +-} +- + // src/components/collapse.tsx + import cn5 from "clsx"; + import { useEffect as useEffect3, useRef as useRef3 } from "react"; +@@ -1255,7 +1217,7 @@ var classes = { ), icon: cn10("_inline _h-5 _shrink-0") }; @@ -65,3 +100,11 @@ index 56201641fd965dcc5ab7c5df53e444c41293c00e..07147c688ae75c4c7daf082833acc71d flatDocsDirectories, currentIndex }) { +@@ -2421,7 +2383,6 @@ function Body({ children }) { + themeContext.typesetting === "article" && "nextra-body-typesetting-article" + ), + children: /* @__PURE__ */ jsxs17("main", { className: "_w-full _min-w-0 _max-w-6xl _px-6 _pt-4 md:_px-12", children: [ +- activeType !== "page" && themeContext.breadcrumb && /* @__PURE__ */ jsx26(Breadcrumb, { activePath }), + body + ] }) + } diff --git a/patches/nextra.patch b/patches/nextra.patch index a7acf2a4ac..88ae4a7082 100644 --- a/patches/nextra.patch +++ b/patches/nextra.patch @@ -1,14 +1,3 @@ -diff --git a/dist/client/components/image.js b/dist/client/components/image.js -index 239d72f5921e2d1b7359e569ae5b74c12d7c9d8a..ebeb619da1e3ccb7722e9388c92c1e2192527027 100644 ---- a/dist/client/components/image.js -+++ b/dist/client/components/image.js -@@ -1,5 +1,5 @@ - import { jsx } from "react/jsx-runtime"; --import NextImage from "next/image"; -+import NextImage from "next/image"; // :) - import { forwardRef } from "react"; - const Image = forwardRef((props, ref) => { - const ComponentToUse = typeof props.src === "object" ? NextImage : "img"; diff --git a/dist/client/components/index.js b/dist/client/components/index.js index 9d05118d3d10e746cd2c020785a0f34465bb8570..218107600d7efed1b5f9d49f0a696b166917d1ce 100644 --- a/dist/client/components/index.js diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 97070bde39..6e8541d503 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -9,10 +9,10 @@ patchedDependencies: hash: fccadc7038719bcf9dc12a573655719edaf7ea8246bd144c660191d05b38c637 path: patches/mermaid-isomorphic.patch nextra: - hash: e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45 + hash: 007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8 path: patches/nextra.patch nextra-theme-docs: - hash: db05bf9d86002253cd072795bad24938011273dded5221e22840e1c2e439b3e5 + hash: 8799231345920182b90fbd49ccc3481783ddbf5bd8dcea15b903a260c10d9bc0 path: patches/nextra-theme-docs.patch importers: @@ -132,10 +132,10 @@ importers: version: 3.0.1(less-loader@12.3.0(less@4.4.1))(less@4.4.1)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)) nextra: specifier: 3.3.1 - version: 3.3.1(patch_hash=e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2) + version: 3.3.1(patch_hash=007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2) nextra-theme-docs: specifier: 3.3.1 - version: 3.3.1(patch_hash=db05bf9d86002253cd072795bad24938011273dded5221e22840e1c2e439b3e5)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(nextra@3.3.1(patch_hash=e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + version: 3.3.1(patch_hash=8799231345920182b90fbd49ccc3481783ddbf5bd8dcea15b903a260c10d9bc0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(nextra@3.3.1(patch_hash=007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1) numbro: specifier: 2.5.0 version: 2.5.0 @@ -11173,7 +11173,7 @@ snapshots: - '@babel/core' - babel-plugin-macros - nextra-theme-docs@3.3.1(patch_hash=db05bf9d86002253cd072795bad24938011273dded5221e22840e1c2e439b3e5)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(nextra@3.3.1(patch_hash=e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + nextra-theme-docs@3.3.1(patch_hash=8799231345920182b90fbd49ccc3481783ddbf5bd8dcea15b903a260c10d9bc0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(nextra@3.3.1(patch_hash=007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2))(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: '@headlessui/react': 2.2.9(react-dom@18.3.1(react@18.3.1))(react@18.3.1) clsx: 2.1.1 @@ -11181,13 +11181,13 @@ snapshots: flexsearch: 0.7.43 next: 14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) next-themes: 0.4.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - nextra: 3.3.1(patch_hash=e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2) + nextra: 3.3.1(patch_hash=007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2) react: 18.3.1 react-dom: 18.3.1(react@18.3.1) scroll-into-view-if-needed: 3.1.0 zod: 3.25.76 - nextra@3.3.1(patch_hash=e05cf55ac73a39e87bf227bf63fd8b17a3f82d5135a610c37f83e69d7c17cd45)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2): + nextra@3.3.1(patch_hash=007f6fda5122c6f4de34daac1f8221aa57dbe7c97563f4f6144c5c5310b2b7c8)(@types/react@18.3.26)(acorn@8.15.0)(next@14.2.32(@babel/core@7.28.3)(@playwright/test@1.55.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(typescript@5.9.2): dependencies: '@formatjs/intl-localematcher': 0.5.10 '@headlessui/react': 2.2.9(react-dom@18.3.1(react@18.3.1))(react@18.3.1) From 65877fad7c7166d2b2de09b010a4b3fe49219c0b Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 22:00:37 +0200 Subject: [PATCH 5/7] Restyle Breadcrumbs --- .../index.tsx => breadcrumbs.tsx} | 31 ++++++++++++------- src/components/nextra-mdx-wrapper.tsx | 2 +- 2 files changed, 20 insertions(+), 13 deletions(-) rename src/_design-system/{breadcrumbs/index.tsx => breadcrumbs.tsx} (60%) diff --git a/src/_design-system/breadcrumbs/index.tsx b/src/_design-system/breadcrumbs.tsx similarity index 60% rename from src/_design-system/breadcrumbs/index.tsx rename to src/_design-system/breadcrumbs.tsx index cb18b37223..776caff29f 100644 --- a/src/_design-system/breadcrumbs/index.tsx +++ b/src/_design-system/breadcrumbs.tsx @@ -4,11 +4,24 @@ import NextLink from "next/link" import { ArrowRightIcon } from "nextra/icons" import type { Item } from "nextra/normalize-pages" -import { extractStringsFromReactNode } from "../../components/utils/extract-strings-from-react-node" +import CaretDown from "@/app/conf/_design-system/pixelarticons/caret-down.svg?svgr" -export const Breadcrumbs = ({ activePath }: { activePath: Item[] }) => { +import { extractStringsFromReactNode } from "../components/utils/extract-strings-from-react-node" + +export const Breadcrumbs = ({ + activePath, + className, +}: { + activePath: Item[] + className?: string +}) => { return ( -
+
{activePath.map((item, index, arr) => { const nextItem = arr[index + 1] const href = nextItem @@ -22,21 +35,15 @@ export const Breadcrumbs = ({ activePath }: { activePath: Item[] }) => { const title = extractStringsFromReactNode(item.title) const className = clsx( - "x:whitespace-nowrap x:transition-colors", - nextItem - ? "x:min-w-6 x:overflow-hidden x:text-ellipsis" - : "x:font-medium x:text-black x:dark:text-gray-100", + "truncate text-neu-700 dark:text-neu-400 min-w-6 last:text-neu-800 dark:last:text-neu-800 leading-none", href && - "x:focus-visible:nextra-focus x:ring-inset x:hover:text-gray-900 x:dark:hover:text-gray-100", + "focus-visible:gql-focus-visible ring-inset hover:text-neu-900 hover:underline", ) return ( {index > 0 && ( - + )} {href ? ( diff --git a/src/components/nextra-mdx-wrapper.tsx b/src/components/nextra-mdx-wrapper.tsx index f5ad84dfc3..25a08d539a 100644 --- a/src/components/nextra-mdx-wrapper.tsx +++ b/src/components/nextra-mdx-wrapper.tsx @@ -146,7 +146,7 @@ function Body({ children }: { children: ReactNode }): ReactElement { >
{activeType !== "page" && themeContext.breadcrumb && ( - + )} {body}
From e930c3a8e1343fbe1e26292076e9caa2da5ece4f Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 22:00:47 +0200 Subject: [PATCH 6/7] Unify docs Sidebar focus color --- src/components/sidebar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/sidebar.tsx b/src/components/sidebar.tsx index e1f8d1d7ed..75716ae395 100644 --- a/src/components/sidebar.tsx +++ b/src/components/sidebar.tsx @@ -52,7 +52,7 @@ const Folder = memo(function FolderInner(props: FolderProps) { const classes = { link: cn( "_flex _px-2 _py-1.5 _text-sm _transition-colors [word-break:break-word]", - "_cursor-pointer contrast-more:border contrast-more:hover:underline", + "_cursor-pointer contrast-more:border contrast-more:hover:underline gql-focus-visible focus-visible:outline-offset-1", ), inactive: cn( "text-neu-800 hover:bg-neu-100 hover:text-neu-900 hover:bg-neu-100 dark:hover:bg-neu-50/50", From 51e293ae1e8407e9d81257819d95d532a6f2a5f2 Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 16 Oct 2025 22:04:17 +0200 Subject: [PATCH 7/7] Run Prettier --- src/components/utils/extract-strings-from-react-node.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/utils/extract-strings-from-react-node.tsx b/src/components/utils/extract-strings-from-react-node.tsx index 1e703ca29f..0abaf8caf9 100644 --- a/src/components/utils/extract-strings-from-react-node.tsx +++ b/src/components/utils/extract-strings-from-react-node.tsx @@ -1,12 +1,12 @@ import { ReactNode } from "react" export function extractStringsFromReactNode(node: ReactNode): string { - if (typeof node === 'string') return node - if (typeof node === 'number') return String(node) + if (typeof node === "string") return node + if (typeof node === "number") return String(node) if (Array.isArray(node)) - return node.map(n => extractStringsFromReactNode(n)).join('') + return node.map(n => extractStringsFromReactNode(n)).join("") const children = (node as any)?.props?.children as ReactNode - if (!children) return '' + if (!children) return "" return extractStringsFromReactNode(children) }