hanzoai/docs
2
0
Fork 0
mirror of https://github.com/hanzo-docs/docs.git synced 2026-10-26 23:49:51 +00:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Support className prop in docs/notebook page (#2859)

Browse Source 
* Add className prop to DocsPageProps

* Add className prop to DocsPageProps for customizable styling

* add JSDoc for className prop

* fix lint
This commit is contained in:
Shyam Verma
2026-01-05 20:05:45 +08:00
committed by GitHub
parent b1221d061d
commit aa69bf1fe5
5 changed files with 30 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/shy-lions-hear.md
+2 -2
View File
@@ -1,6 +1,6 @@
---
"fumadocs-ui": patch
"@fumadocs/base-ui": patch
'fumadocs-ui': patch
'@fumadocs/base-ui': patch
---
expose `useAutoScroll()`
packages/base-ui/src/layouts/docs/page/index.tsx
+7
View File
@@ -50,6 +50,11 @@ export interface DocsPageProps {
footer?: Partial<FooterOptions>;
children?: ReactNode;
/**
* Apply class names to the `#nd-page` container.
*/
className?: string;
}
type TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {
@@ -86,6 +91,7 @@ export function DocsPage({
tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},
toc = [],
children,
className,
}: DocsPageProps) {
// disable TOC on full mode, you can still enable it with `enabled` option.
tocEnabled ??=
@@ -131,6 +137,7 @@ export function DocsPage({
className={cn(
'flex flex-col w-full max-w-[900px] mx-auto [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14',
full ? 'max-w-[1200px]' : 'xl:layout:[--fd-toc-width:268px]',
className,
)}
>
{breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}
packages/base-ui/src/layouts/notebook/page/index.tsx
+7
View File
@@ -50,6 +50,11 @@ export interface DocsPageProps {
footer?: Partial<FooterOptions>;
children?: ReactNode;
/**
* Apply class names to the `#nd-page` container.
*/
className?: string;
}
type TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {
@@ -86,6 +91,7 @@ export function DocsPage({
tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},
toc = [],
children,
className,
}: DocsPageProps) {
// disable TOC on full mode, you can still enable it with `enabled` option.
tocEnabled ??=
@@ -131,6 +137,7 @@ export function DocsPage({
className={cn(
'flex flex-col [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14 *:max-w-[900px]',
full && '*:max-w-[1285px]',
className,
)}
>
{breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}
packages/radix-ui/src/layouts/docs/page/index.tsx
+7
View File
@@ -50,6 +50,11 @@ export interface DocsPageProps {
footer?: Partial<FooterOptions>;
children?: ReactNode;
/**
* Apply class names to the `#nd-page` container.
*/
className?: string;
}
type TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {
@@ -86,6 +91,7 @@ export function DocsPage({
tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},
toc = [],
children,
className,
}: DocsPageProps) {
// disable TOC on full mode, you can still enable it with `enabled` option.
tocEnabled ??=
@@ -131,6 +137,7 @@ export function DocsPage({
className={cn(
'flex flex-col w-full max-w-[900px] mx-auto [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14',
full ? 'max-w-[1200px]' : 'xl:layout:[--fd-toc-width:268px]',
className,
)}
>
{breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}
packages/radix-ui/src/layouts/notebook/page/index.tsx
+7
View File
@@ -50,6 +50,11 @@ export interface DocsPageProps {
footer?: Partial<FooterOptions>;
children?: ReactNode;
/**
* Apply class names to the `#nd-page` container.
*/
className?: string;
}
type TableOfContentOptions = Pick<AnchorProviderProps, 'single'> & {
@@ -86,6 +91,7 @@ export function DocsPage({
tableOfContent: { enabled: tocEnabled, component: tocReplace, ...tocOptions } = {},
toc = [],
children,
className,
}: DocsPageProps) {
// disable TOC on full mode, you can still enable it with `enabled` option.
tocEnabled ??=
@@ -131,6 +137,7 @@ export function DocsPage({
className={cn(
'flex flex-col [grid-area:main] px-4 py-6 gap-4 md:px-6 md:pt-8 xl:px-8 xl:pt-14 *:max-w-[900px]',
full && '*:max-w-[1285px]',
className,
)}
>
{breadcrumbEnabled && (breadcrumb ?? <PageBreadcrumb {...breadcrumbProps} />)}