Skip to content

Commit eca7535

Browse files
author
Dimitri POSTOLOV
authoredSep 4, 2023
some major updates (#2248)
·
nextra-theme-docs@4.0.0-rc.0nextra@3.0.0-alpha.0
1 parent d9031e7 commit eca7535

File tree

15 files changed

+105
-79
lines changed

15 files changed

+105
-79
lines changed
 

‎.changeset/poor-carrots-raise.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
'nextra-theme-docs': major
3+
---
4+
5+
- remove `Steps`, `Callout`, `Tabs`, `Tab`, `Cards`, `Card`, `FileTree` exports, export them now from `nextra/components`
6+
7+
- remove `useMDXComponents` export, export it now from `nextra/mdx`
8+
9+
- set by default `sidebar.toggleButton` to true

‎docs/pages/docs/docs-theme.mdx

+5-5
Original file line numberDiff line numberDiff line change
@@ -6,25 +6,25 @@ import {
66
GearIcon,
77
RowsIcon
88
} from '@components/icons'
9-
import { Card, Cards } from 'nextra/components'
9+
import { Cards } from 'nextra/components'
1010

1111
<Cards>
12-
<Card
12+
<Cards.Card
1313
icon={<ChevronRightIcon />}
1414
title="Get Started"
1515
href="/docs/docs-theme/start"
1616
/>
17-
<Card
17+
<Cards.Card
1818
icon={<RowsIcon />}
1919
title="Page Configuration"
2020
href="/docs/docs-theme/page-configuration"
2121
/>
22-
<Card
22+
<Cards.Card
2323
icon={<GearIcon />}
2424
title="Theme Configuration"
2525
href="/docs/docs-theme/theme-configuration"
2626
/>
27-
<Card
27+
<Cards.Card
2828
icon={<BoxIcon />}
2929
title="Built-in Components"
3030
href="/docs/docs-theme/built-ins"

‎docs/pages/docs/docs-theme/built-ins.mdx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
# Built-ins
22

33
import { CardsIcon } from '@components/icons'
4-
import { Card, Cards } from 'nextra-theme-docs'
4+
import { Cards } from 'nextra/components'
55

66
The Nextra Docs Theme includes a couple of built-in components that you can use
77
to better style your documentation:
88

99
<Cards>
10-
<Card
10+
<Cards.Card
1111
icon={<CardsIcon />}
1212
title="Bleed"
1313
href="/docs/docs-theme/built-ins/bleed"

‎docs/pages/docs/docs-theme/start.mdx

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { BoxIcon, GearIcon, RowsIcon } from '@components/icons'
2-
import { Callout, Card, Cards, Steps } from 'nextra/components'
2+
import { Callout, Cards, Steps } from 'nextra/components'
33

44
# Docs Theme
55

@@ -109,17 +109,17 @@ Next, check out the next section to learn about organizing the documentation
109109
structure and configuring the website theme:
110110

111111
<Cards>
112-
<Card
112+
<Cards.Card
113113
icon={<RowsIcon />}
114114
title="Page Structure"
115115
href="/docs/docs-theme/page-configuration"
116116
/>
117-
<Card
117+
<Cards.Card
118118
icon={<GearIcon />}
119119
title="Theme Configuration"
120120
href="/docs/docs-theme/theme-configuration"
121121
/>
122-
<Card
122+
<Cards.Card
123123
icon={<BoxIcon />}
124124
title="Built-in Components"
125125
href="/docs/docs-theme/built-ins"

‎docs/pages/docs/guide.mdx

+39-11
Original file line numberDiff line numberDiff line change
@@ -10,32 +10,60 @@ import {
1010
PictureIcon,
1111
StarsIcon
1212
} from '@components/icons'
13-
import { Card, Cards } from 'nextra/components'
13+
import { Cards } from 'nextra/components'
1414

1515
# Guide
1616

1717
The following features are configured via the Next.js configuration and are
1818
available in all themes.
1919

2020
<Cards>
21-
<Card
21+
<Cards.Card
2222
icon={<FilesIcon />}
2323
title="Organize Files"
2424
href="/docs/guide/organize-files"
2525
/>
26-
<Card icon={<MarkdownIcon />} title="Markdown" href="/docs/guide/markdown" />
27-
<Card
26+
<Cards.Card
27+
icon={<MarkdownIcon />}
28+
title="Markdown"
29+
href="/docs/guide/markdown"
30+
/>
31+
<Cards.Card
2832
icon={<StarsIcon />}
2933
title="Syntax Highlighting"
3034
href="/docs/guide/syntax-highlighting"
3135
/>
32-
<Card icon={<LinkIcon />} title="Next.js Link" href="/docs/guide/link" />
33-
<Card icon={<PictureIcon />} title="Next.js Image" href="/docs/guide/image" />
34-
<Card icon={<LightningIcon />} title="Next.js SSG" href="/docs/guide/ssg" />
35-
<Card icon={<GlobeIcon />} title="Next.js I18n" href="/docs/guide/i18n" />
36-
<Card icon={<BrushIcon />} title="Custom CSS" href="/docs/guide/custom-css" />
37-
<Card icon={<DropperIcon />} title="Advanced" href="/docs/guide/advanced" />
38-
<Card
36+
<Cards.Card
37+
icon={<LinkIcon />}
38+
title="Next.js Link"
39+
href="/docs/guide/link"
40+
/>
41+
<Cards.Card
42+
icon={<PictureIcon />}
43+
title="Next.js Image"
44+
href="/docs/guide/image"
45+
/>
46+
<Cards.Card
47+
icon={<LightningIcon />}
48+
title="Next.js SSG"
49+
href="/docs/guide/ssg"
50+
/>
51+
<Cards.Card
52+
icon={<GlobeIcon />}
53+
title="Next.js I18n"
54+
href="/docs/guide/i18n"
55+
/>
56+
<Cards.Card
57+
icon={<BrushIcon />}
58+
title="Custom CSS"
59+
href="/docs/guide/custom-css"
60+
/>
61+
<Cards.Card
62+
icon={<DropperIcon />}
63+
title="Advanced"
64+
href="/docs/guide/advanced"
65+
/>
66+
<Cards.Card
3967
icon={<BoxIcon />}
4068
title="Built-in Components"
4169
href="/docs/guide/built-ins"

‎docs/pages/docs/guide/advanced.mdx

+8-8
Original file line numberDiff line numberDiff line change
@@ -7,40 +7,40 @@ import {
77
TailwindIcon,
88
TerminalIcon
99
} from '@components/icons'
10-
import { Card, Cards } from 'nextra/components'
10+
import { Cards } from 'nextra/components'
1111

1212
<Cards>
13-
<Card
13+
<Cards.Card
1414
icon={<TerminalIcon />}
1515
title="Npm2Yarn"
1616
href="/docs/guide/advanced/npm2yarn"
1717
/>
18-
<Card
18+
<Cards.Card
1919
icon={<DiagramIcon />}
2020
title="Mermaid"
2121
href="/docs/guide/advanced/mermaid"
2222
/>
23-
<Card
23+
<Cards.Card
2424
icon={<TailwindIcon className="h-6 w-6" />}
2525
title="Tailwind CSS"
2626
href="/docs/guide/advanced/tailwind-css"
2727
/>
28-
<Card
28+
<Cards.Card
2929
icon={<FormulaIcon />}
3030
title="LaTeX"
3131
href="/docs/guide/advanced/latex"
3232
/>
33-
<Card
33+
<Cards.Card
3434
icon={<TableIcon />}
3535
title="Rendering Tables"
3636
href="/docs/guide/advanced/table"
3737
/>
38-
<Card
38+
<Cards.Card
3939
icon={<CodeIcon />}
4040
title="TypeScript"
4141
href="/docs/guide/advanced/typescript"
4242
/>
43-
<Card
43+
<Cards.Card
4444
icon={<CloudIcon />}
4545
title="Remote Content"
4646
href="/docs/guide/advanced/remote"

‎docs/pages/docs/guide/built-ins.mdx

+14-6
Original file line numberDiff line numberDiff line change
@@ -5,27 +5,35 @@ import {
55
OneIcon,
66
WarningIcon
77
} from '@components/icons'
8-
import { Card, Cards } from 'nextra/components'
8+
import { Cards } from 'nextra/components'
99

1010
# Built-ins
1111

1212
Nextra includes a couple of built-in components that you can use to better style
1313
your content:
1414

1515
<Cards>
16-
<Card
16+
<Cards.Card
1717
icon={<WarningIcon />}
1818
title="Callout"
1919
href="/docs/guide/built-ins/callout"
2020
/>
21-
<Card icon={<CardsIcon />} title="Tabs" href="/docs/guide/built-ins/tabs" />
22-
<Card
21+
<Cards.Card
22+
icon={<CardsIcon />}
23+
title="Tabs"
24+
href="/docs/guide/built-ins/tabs"
25+
/>
26+
<Cards.Card
2327
icon={<IdCardIcon />}
2428
title="Cards"
2529
href="/docs/guide/built-ins/cards"
2630
/>
27-
<Card icon={<OneIcon />} title="Steps" href="/docs/guide/built-ins/steps" />
28-
<Card
31+
<Cards.Card
32+
icon={<OneIcon />}
33+
title="Steps"
34+
href="/docs/guide/built-ins/steps"
35+
/>
36+
<Cards.Card
2937
icon={<FolderTreeIcon className="h-5 w-5" />}
3038
title="FileTree"
3139
href="/docs/guide/built-ins/filetree"

‎docs/pages/docs/guide/built-ins/cards.mdx

+16-8
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,38 @@
11
import { CardsIcon, OneIcon, WarningIcon } from '@components/icons'
2-
import { Card, Cards } from 'nextra/components'
2+
import { Cards } from 'nextra/components'
33

44
# Cards Component
55

66
## Example
77

88
<Cards>
9-
<Card
9+
<Cards.Card
1010
icon={<WarningIcon />}
1111
title="Callout"
1212
href="/docs/guide/built-ins/callout"
1313
/>
14-
<Card icon={<CardsIcon />} title="Tabs" href="/docs/guide/built-ins/tabs" />
15-
<Card icon={<OneIcon />} title="Steps" href="/docs/guide/built-ins/steps" />
14+
<Cards.Card
15+
icon={<CardsIcon />}
16+
title="Tabs"
17+
href="/docs/guide/built-ins/tabs"
18+
/>
19+
<Cards.Card
20+
icon={<OneIcon />}
21+
title="Steps"
22+
href="/docs/guide/built-ins/steps"
23+
/>
1624
</Cards>
1725

1826
## Usage
1927

2028
{/* prettier-ignore */}
2129
```mdx filename="Markdown"
22-
import { Cards, Card } from 'nextra/components'
30+
import { Cards } from 'nextra/components'
2331
import { CardsIcon, OneIcon, WarningIcon } from '../../icons'
2432

2533
<Cards>
26-
<Card icon={<WarningIcon />} title="Callout" href="/docs/guide/built-ins/callout" />
27-
<Card icon={<CardsIcon />} title="Tabs" href="/docs/guide/built-ins/tabs" />
28-
<Card icon={<OneIcon />} title="Steps" href="/docs/guide/built-ins/steps" />
34+
<Cards.Card icon={<WarningIcon />} title="Callout" href="/docs/guide/built-ins/callout" />
35+
<Cards.Card icon={<CardsIcon />} title="Tabs" href="/docs/guide/built-ins/tabs" />
36+
<Cards.Card icon={<OneIcon />} title="Steps" href="/docs/guide/built-ins/steps" />
2937
</Cards>
3038
```

‎docs/pages/docs/guide/markdown.mdx

+2-2
Original file line numberDiff line numberDiff line change
@@ -115,12 +115,12 @@ default `#long-heading-about-nextra`.
115115
## Extended Syntax Highlighting
116116

117117
import { StarsIcon } from '@components/icons'
118-
import { Card, Cards } from 'nextra/components'
118+
import { Cards } from 'nextra/components'
119119

120120
Check out the Syntax Highlighting section for more information:
121121

122122
<Cards>
123-
<Card
123+
<Cards.Card
124124
icon={<StarsIcon />}
125125
title="Syntax Highlighting"
126126
href="/docs/guide/syntax-highlighting"

‎docs/pages/docs/guide/organize-files.mdx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { FileIcon, NewsletterIcon } from '@components/icons'
2-
import { Card, Cards, FileTree } from 'nextra/components'
2+
import { Cards, FileTree } from 'nextra/components'
33

44
# Organize Files
55

@@ -105,12 +105,12 @@ The extra configurations are passed to the **theme** as additional information.
105105
Check the corresponding pages for more information:
106106

107107
<Cards>
108-
<Card
108+
<Cards.Card
109109
icon={<NewsletterIcon />}
110110
title="Docs Theme →"
111111
href="/docs/docs-theme/page-configuration"
112112
/>
113-
<Card
113+
<Cards.Card
114114
icon={<FileIcon />}
115115
title="Blog Theme →"
116116
href="/docs/blog-theme/start"

‎package.json

-2
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,6 @@
4848
"vitest": "^0.29.8",
4949
"react": "^18.2.0",
5050
"react-dom": "^18.2.0",
51-
"@mdx-js/react": "^2.3.0",
52-
"next-themes": "^0.2.1",
5351
"next": "^13.4.19"
5452
},
5553
"patchedDependencies": {

‎packages/nextra-theme-docs/src/components/anchor.tsx

+2-15
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,12 @@
11
// eslint-disable-next-line no-restricted-imports -- only in this file we determine either we include <a /> as child of <NextLink />
22
import NextLink from 'next/link'
3-
import next from 'next/package.json'
43
import type { ComponentProps, ReactElement } from 'react'
54
import { forwardRef } from 'react'
65

76
export type AnchorProps = Omit<ComponentProps<'a'>, 'ref'> & {
87
newWindow?: boolean
98
}
109

11-
const nextVersion = Number(next.version.split('.')[0])
12-
1310
export const Anchor = forwardRef<HTMLAnchorElement, AnchorProps>(function (
1411
{ href = '', children, newWindow, ...props },
1512
// ref is used in <NavbarMenu />
@@ -38,19 +35,9 @@ export const Anchor = forwardRef<HTMLAnchorElement, AnchorProps>(function (
3835
)
3936
}
4037

41-
if (nextVersion > 12) {
42-
return (
43-
<NextLink ref={forwardedRef} href={href} {...props}>
44-
{children}
45-
</NextLink>
46-
)
47-
}
48-
4938
return (
50-
<NextLink href={href} passHref>
51-
<a ref={forwardedRef} {...props}>
52-
{children}
53-
</a>
39+
<NextLink ref={forwardedRef} href={href} {...props}>
40+
{children}
5441
</NextLink>
5542
)
5643
})

‎packages/nextra-theme-docs/src/constants.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -309,7 +309,7 @@ export const DEFAULT_THEME: DocsThemeConfig = {
309309
sidebar: {
310310
defaultMenuCollapseLevel: 2,
311311
titleComponent: ({ title }) => <>{title}</>,
312-
toggleButton: false
312+
toggleButton: true
313313
},
314314
themeSwitch: {
315315
component: ThemeSwitch,

‎packages/nextra-theme-docs/src/index.tsx

-10
Original file line numberDiff line numberDiff line change
@@ -249,16 +249,6 @@ export default function Layout({
249249
}
250250

251251
export { useConfig, PartialDocsThemeConfig as DocsThemeConfig }
252-
export { useMDXComponents } from 'nextra/mdx'
253-
export {
254-
Callout,
255-
Steps,
256-
Tabs,
257-
Tab,
258-
Cards,
259-
Card,
260-
FileTree
261-
} from 'nextra/components'
262252
export { useTheme } from 'next-themes'
263253
export { Link } from './mdx-components'
264254
export {

‎pnpm-lock.yaml

-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)
Please sign in to comment.