fumadocs-ui 15.8.4 → 16.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/css/black.css +2 -0
  2. package/css/catppuccin.css +2 -0
  3. package/css/default.css +33 -0
  4. package/css/dusk.css +2 -0
  5. package/css/neutral.css +3 -0
  6. package/css/ocean.css +2 -0
  7. package/css/preset.css +5 -18
  8. package/css/purple.css +2 -0
  9. package/css/shadcn.css +2 -0
  10. package/css/vitepress.css +2 -0
  11. package/dist/components/codeblock.d.ts.map +1 -1
  12. package/dist/components/codeblock.js +0 -1
  13. package/dist/components/dialog/search.js +1 -1
  14. package/dist/components/layout/language-toggle.js +1 -1
  15. package/dist/components/layout/root-toggle.js +1 -1
  16. package/dist/components/ui/popover.js +1 -1
  17. package/dist/i18n.d.ts +0 -1
  18. package/dist/i18n.d.ts.map +1 -1
  19. package/dist/i18n.js +0 -1
  20. package/dist/layouts/docs/index.d.ts +1 -1
  21. package/dist/layouts/docs/index.d.ts.map +1 -1
  22. package/dist/layouts/docs/index.js +11 -9
  23. package/dist/layouts/docs/page-client.js +1 -1
  24. package/dist/layouts/docs/page.d.ts.map +1 -1
  25. package/dist/layouts/docs/page.js +1 -1
  26. package/dist/layouts/notebook/index.d.ts +4 -4
  27. package/dist/layouts/notebook/index.d.ts.map +1 -1
  28. package/dist/layouts/notebook/index.js +23 -20
  29. package/dist/page.d.ts +0 -7
  30. package/dist/page.d.ts.map +1 -1
  31. package/dist/page.js +1 -1
  32. package/dist/provider/index.d.ts +5 -1
  33. package/dist/provider/index.d.ts.map +1 -1
  34. package/dist/provider/index.js +6 -2
  35. package/dist/style.css +120 -46
  36. package/package.json +16 -16
  37. package/dist/contexts/legacy-i18n.d.ts +0 -11
  38. package/dist/contexts/legacy-i18n.d.ts.map +0 -1
  39. package/dist/contexts/legacy-i18n.js +0 -36
  40. package/dist/page.server.d.ts +0 -13
  41. package/dist/page.server.d.ts.map +0 -1
  42. package/dist/page.server.js +0 -37
package/css/black.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: hsl(0, 0%, 98%);
3
5
  --color-fd-foreground: hsl(0, 0%, 3.9%);
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-popover: hsl(220, 22%, 92%);
3
5
  --color-fd-popover-foreground: hsl(234, 16%, 35%);
@@ -0,0 +1,33 @@
1
+ /**
2
+ The default theme of Fumadocs
3
+ */
4
+ @theme {
5
+ --color-fd-background: transparent;
6
+ --color-fd-foreground: transparent;
7
+ --color-fd-muted: transparent;
8
+ --color-fd-muted-foreground: transparent;
9
+ --color-fd-popover: transparent;
10
+ --color-fd-popover-foreground: transparent;
11
+ --color-fd-card: transparent;
12
+ --color-fd-card-foreground: transparent;
13
+ --color-fd-border: transparent;
14
+ --color-fd-primary: transparent;
15
+ --color-fd-primary-foreground: transparent;
16
+ --color-fd-secondary: transparent;
17
+ --color-fd-secondary-foreground: transparent;
18
+ --color-fd-accent: transparent;
19
+ --color-fd-accent-foreground: transparent;
20
+ --color-fd-ring: transparent;
21
+ --color-fd-overlay: transparent;
22
+ }
23
+
24
+ @theme static {
25
+ --color-fd-info: oklch(62.3% 0.214 259.815);
26
+ --color-fd-warning: oklch(76.9% 0.188 70.08);
27
+ --color-fd-error: oklch(63.7% 0.237 25.331);
28
+ --color-fd-success: oklch(72.3% 0.219 149.579);
29
+ --color-fd-diff-remove: rgba(200, 10, 100, 0.12);
30
+ --color-fd-diff-remove-symbol: rgb(230, 10, 100);
31
+ --color-fd-diff-add: rgba(14, 180, 100, 0.1);
32
+ --color-fd-diff-add-symbol: rgb(10, 200, 100);
33
+ }
package/css/dusk.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: hsl(250, 20%, 92%);
3
5
  --color-fd-primary: hsl(340, 40%, 48%);
package/css/neutral.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: hsl(0, 0%, 96%);
3
5
  --color-fd-foreground: hsl(0, 0%, 3.9%);
@@ -34,6 +36,7 @@
34
36
  --color-fd-accent: hsla(0, 0%, 40.9%, 30%);
35
37
  --color-fd-accent-foreground: hsl(0, 0%, 90%);
36
38
  --color-fd-ring: hsl(0, 0%, 54.9%);
39
+ --color-fd-overlay: hsla(0, 0%, 0%, 0.2);
37
40
  }
38
41
 
39
42
  .dark #nd-sidebar {
package/css/ocean.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: hsl(0, 0%, 98%);
3
5
  --color-fd-foreground: hsl(0, 0%, 3.9%);
package/css/preset.css CHANGED
@@ -3,13 +3,6 @@
3
3
  @source '../dist/**/*.js';
4
4
  @plugin '../dist/theme/typography/index.js';
5
5
 
6
- @theme static {
7
- --color-fd-info: oklch(62.3% 0.214 259.815);
8
- --color-fd-warning: oklch(76.9% 0.188 70.08);
9
- --color-fd-error: oklch(63.7% 0.237 25.331);
10
- --color-fd-success: oklch(72.3% 0.219 149.579);
11
- }
12
-
13
6
  [dir='rtl'] {
14
7
  --fd-sidebar-mobile-offset: -100%;
15
8
  }
@@ -20,24 +13,18 @@
20
13
  --fd-page-width: 1200px;
21
14
  --fd-sidebar-width: 0px;
22
15
  --fd-toc-width: 0px;
23
- --fd-layout-width: 100vw;
16
+ --fd-layout-width: 1600px;
24
17
  --fd-banner-height: 0px;
25
18
  --fd-nav-height: 0px;
26
19
  --fd-tocnav-height: 0px;
27
-
28
- --color-fd-diff-remove: rgba(200, 10, 100, 0.12);
29
- --color-fd-diff-remove-symbol: rgb(230, 10, 100);
30
- --color-fd-diff-add: rgba(14, 180, 100, 0.1);
31
- --color-fd-diff-add-symbol: rgb(10, 200, 100);
32
-
33
20
  --animate-fd-fade-in: fd-fade-in 300ms ease;
34
21
  --animate-fd-fade-out: fd-fade-out 300ms ease;
35
22
 
36
23
  --animate-fd-dialog-in: fd-dialog-in 300ms cubic-bezier(0.16, 1, 0.3, 1);
37
24
  --animate-fd-dialog-out: fd-dialog-out 300ms cubic-bezier(0.16, 1, 0.3, 1);
38
25
 
39
- --animate-fd-popover-in: fd-popover-in 130ms ease;
40
- --animate-fd-popover-out: fd-popover-out 130ms ease;
26
+ --animate-fd-popover-in: fd-popover-in 100ms ease;
27
+ --animate-fd-popover-out: fd-popover-out 100ms ease;
41
28
 
42
29
  --animate-fd-collapsible-down: fd-collapsible-down 150ms
43
30
  cubic-bezier(0.45, 0, 0.55, 1);
@@ -134,14 +121,14 @@
134
121
  @keyframes fd-popover-in {
135
122
  from {
136
123
  opacity: 0;
137
- transform: scale(0.7);
124
+ transform: scale(0.9);
138
125
  }
139
126
  }
140
127
 
141
128
  @keyframes fd-popover-out {
142
129
  to {
143
130
  opacity: 0;
144
- transform: scale(0.7);
131
+ transform: scale(0.9);
145
132
  }
146
133
  }
147
134
 
package/css/purple.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: hsl(256, 100%, 96%);
3
5
  --color-fd-primary: hsl(270, 100%, 52%);
package/css/shadcn.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-background: var(--background);
3
5
  --color-fd-foreground: var(--foreground);
package/css/vitepress.css CHANGED
@@ -1,3 +1,5 @@
1
+ @import './default.css';
2
+
1
3
  @theme {
2
4
  --color-fd-muted: hsl(0, 0%, 96.1%);
3
5
  --color-fd-popover: hsl(0, 0%, 100%);
@@ -1 +1 @@
1
- {"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAGpC,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC9D;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAE5C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,KAAK,SAAS,CAAC;CAC9E;AAOD,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAS/C;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,KAAK,EACL,SAAgB,EAChB,cAAsB,EACtB,IAAI,EACJ,aAAkB,EAClB,QAAQ,EACR,OAEC,EACD,GAAG,KAAK,EACT,EAAE,cAAc,2CAkEhB;AA0CD,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,2CA2B3E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,2CAYvE;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAapC;AAGD,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAErE"}
1
+ {"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAGpC,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC9D;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAE5C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,KAAK,SAAS,CAAC;CAC9E;AAOD,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAS/C;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,KAAK,EACL,SAAgB,EAChB,cAAsB,EACtB,IAAI,EACJ,aAAkB,EAClB,QAAQ,EACR,OAEC,EACD,GAAG,KAAK,EACT,EAAE,cAAc,2CAkEhB;AA0CD,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,2CA2B3E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,2CAYvE;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAapC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAErE"}
@@ -63,7 +63,6 @@ export function CodeBlockTabsList(props) {
63
63
  export function CodeBlockTabsTrigger({ children, ...props }) {
64
64
  return (_jsxs(TabsTrigger, { ...props, className: cn('relative group inline-flex text-sm font-medium text-nowrap items-center transition-colors gap-2 px-2 py-1.5 hover:text-fd-accent-foreground data-[state=active]:text-fd-primary [&_svg]:size-3.5', props.className), children: [_jsx("div", { className: "absolute inset-x-2 bottom-0 h-px group-data-[state=active]:bg-fd-primary" }), children] }));
65
65
  }
66
- // TODO: currently Vite RSC plugin has problem with `asChild` due to children is automatically wrapped in <Fragment />, maybe revisit this in future
67
66
  export function CodeBlockTab(props) {
68
67
  return _jsx(TabsContent, { ...props });
69
68
  }
@@ -46,7 +46,7 @@ export function SearchDialogFooter(props) {
46
46
  return (_jsx("div", { ...props, className: cn('bg-fd-secondary/50 p-3 empty:hidden', props.className) }));
47
47
  }
48
48
  export function SearchDialogOverlay(props) {
49
- return (_jsx(DialogOverlay, { ...props, className: cn('fixed inset-0 z-50 backdrop-blur-xs data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out', props.className) }));
49
+ return (_jsx(DialogOverlay, { ...props, className: cn('fixed inset-0 z-50 backdrop-blur-xs bg-fd-overlay data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out', props.className) }));
50
50
  }
51
51
  export function SearchDialogContent({ children, ...props }) {
52
52
  const { text } = useI18n();
@@ -11,7 +11,7 @@ export function LanguageToggle(props) {
11
11
  return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { "aria-label": context.text.chooseLanguage, ...props, className: cn(buttonVariants({
12
12
  color: 'ghost',
13
13
  className: 'gap-1.5 p-1.5',
14
- }), props.className), children: props.children }), _jsxs(PopoverContent, { className: "flex flex-col overflow-hidden p-0", children: [_jsx("p", { className: "mb-1 p-2 text-xs font-medium text-fd-muted-foreground", children: context.text.chooseLanguage }), context.locales.map((item) => (_jsx("button", { type: "button", className: cn('p-2 text-start text-sm', item.locale === context.locale
14
+ }), props.className), children: props.children }), _jsxs(PopoverContent, { className: "flex flex-col overflow-x-hidden p-0", children: [_jsx("p", { className: "mb-1 p-2 text-xs font-medium text-fd-muted-foreground", children: context.text.chooseLanguage }), context.locales.map((item) => (_jsx("button", { type: "button", className: cn('p-2 text-start text-sm', item.locale === context.locale
15
15
  ? 'bg-fd-primary/10 font-medium text-fd-primary'
16
16
  : 'hover:bg-fd-accent hover:text-fd-accent-foreground'), onClick: () => {
17
17
  context.onChange?.(item.locale);
@@ -20,7 +20,7 @@ export function RootToggle({ options, placeholder, ...props }) {
20
20
  setOpen(false);
21
21
  };
22
22
  const item = selected ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "size-9 shrink-0 md:size-5", children: selected.icon }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium", children: selected.title }), _jsx("p", { className: "text-[13px] text-fd-muted-foreground empty:hidden md:hidden", children: selected.description })] })] })) : (placeholder);
23
- return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [item && (_jsxs(PopoverTrigger, { ...props, className: cn('flex items-center gap-2 rounded-lg p-2 border bg-fd-secondary/50 text-start text-fd-secondary-foreground transition-colors hover:bg-fd-accent data-[state=open]:bg-fd-accent data-[state=open]:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronsUpDown, { className: "shrink-0 ms-auto size-4 text-fd-muted-foreground" })] })), _jsx(PopoverContent, { className: "flex flex-col gap-1 w-(--radix-popover-trigger-width) overflow-hidden p-1", children: options.map((item) => {
23
+ return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [item && (_jsxs(PopoverTrigger, { ...props, className: cn('flex items-center gap-2 rounded-lg p-2 border bg-fd-secondary/50 text-start text-fd-secondary-foreground transition-colors hover:bg-fd-accent data-[state=open]:bg-fd-accent data-[state=open]:text-fd-accent-foreground', props.className), children: [item, _jsx(ChevronsUpDown, { className: "shrink-0 ms-auto size-4 text-fd-muted-foreground" })] })), _jsx(PopoverContent, { className: "flex flex-col gap-1 w-(--radix-popover-trigger-width) p-1 fd-scroll-container", children: options.map((item) => {
24
24
  const isActive = selected && item.url === selected.url;
25
25
  if (!isActive && item.unlisted)
26
26
  return;
@@ -5,7 +5,7 @@ import * as React from 'react';
5
5
  import { cn } from '../../utils/cn.js';
6
6
  const Popover = PopoverPrimitive.Root;
7
7
  const PopoverTrigger = PopoverPrimitive.Trigger;
8
- const PopoverContent = React.forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Content, { ref: ref, align: align, sideOffset: sideOffset, side: "bottom", className: cn('z-50 origin-(--radix-popover-content-transform-origin) min-w-[240px] max-w-[98vw] rounded-xl border bg-fd-popover/60 backdrop-blur-lg p-2 text-sm text-fd-popover-foreground shadow-lg focus-visible:outline-none data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in', className), ...props }) })));
8
+ const PopoverContent = React.forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Content, { ref: ref, align: align, sideOffset: sideOffset, side: "bottom", className: cn('z-50 origin-(--radix-popover-content-transform-origin) overflow-y-auto max-h-(--radix-popover-content-available-height) min-w-[240px] max-w-[98vw] rounded-xl border bg-fd-popover/60 backdrop-blur-lg p-2 text-sm text-fd-popover-foreground shadow-lg focus-visible:outline-none data-[state=closed]:animate-fd-popover-out data-[state=open]:animate-fd-popover-in', className), ...props }) })));
9
9
  PopoverContent.displayName = PopoverPrimitive.Content.displayName;
10
10
  const PopoverClose = PopoverPrimitive.PopoverClose;
11
11
  export { Popover, PopoverTrigger, PopoverContent, PopoverClose };
package/dist/i18n.d.ts CHANGED
@@ -3,7 +3,6 @@ import type { I18nProviderProps } from './provider/base.js';
3
3
  import type { I18nConfig } from 'fumadocs-core/i18n';
4
4
  export type { I18nProviderProps, Translations };
5
5
  export { defaultTranslations } from './contexts/i18n.js';
6
- export { I18nProvider } from './contexts/legacy-i18n.js';
7
6
  export declare function defineI18nUI<Languages extends string>(config: I18nConfig<Languages>, options: {
8
7
  translations: {
9
8
  [K in Languages]?: Partial<Translations> & {
@@ -1 +1 @@
1
- {"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../src/i18n.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAEtD,wBAAgB,YAAY,CAAC,SAAS,SAAS,MAAM,EACnD,MAAM,EAAE,UAAU,CAAC,SAAS,CAAC,EAC7B,OAAO,EAAE;IACP,YAAY,EAAE;SACX,CAAC,IAAI,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG;YAAE,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE;KACpE,CAAC;CACH;sBAKkB,MAAM,GAA4B,iBAAiB;EAWvE"}
1
+ {"version":3,"file":"i18n.d.ts","sourceRoot":"","sources":["../src/i18n.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,YAAY,EAAE,iBAAiB,EAAE,YAAY,EAAE,CAAC;AAChD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAEtD,wBAAgB,YAAY,CAAC,SAAS,SAAS,MAAM,EACnD,MAAM,EAAE,UAAU,CAAC,SAAS,CAAC,EAC7B,OAAO,EAAE;IACP,YAAY,EAAE;SACX,CAAC,IAAI,SAAS,CAAC,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG;YAAE,WAAW,CAAC,EAAE,MAAM,CAAA;SAAE;KACpE,CAAC;CACH;sBAKkB,MAAM,GAA4B,iBAAiB;EAWvE"}
package/dist/i18n.js CHANGED
@@ -1,5 +1,4 @@
1
1
  export { defaultTranslations } from './contexts/i18n.js';
2
- export { I18nProvider } from './contexts/legacy-i18n.js';
3
2
  export function defineI18nUI(config, options) {
4
3
  const { translations } = options;
5
4
  return {
@@ -31,6 +31,6 @@ interface SidebarOptions extends ComponentProps<'aside'>, Pick<SidebarProps, 'de
31
31
  */
32
32
  collapsible?: boolean;
33
33
  }
34
- export declare function DocsLayout({ nav: { transparentMode, ...nav }, sidebar: { tabs: sidebarTabs, enabled: sidebarEnabled, ...sidebarProps }, searchToggle, themeSwitch, tabMode, i18n, children, ...props }: DocsLayoutProps): import("react/jsx-runtime").JSX.Element;
34
+ export declare function DocsLayout({ nav: { transparentMode, ...nav }, sidebar: { tabs: sidebarTabs, enabled: sidebarEnabled, ...sidebarProps }, searchToggle, themeSwitch, tabMode, i18n, children, tree, ...props }: DocsLayoutProps): import("react/jsx-runtime").JSX.Element;
35
35
  export { CollapsibleControl, Navbar, SidebarTrigger, type LinkItemType };
36
36
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAIf,OAAO,EAGL,KAAK,iBAAiB,EAWtB,KAAK,YAAY,EACjB,cAAc,EAEf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,KAAK,MAAM,EAAc,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EACL,KAAK,eAAe,EAIpB,KAAK,YAAY,EAClB,MAAM,kBAAkB,CAAC;AAK1B,OAAO,EACL,kBAAkB,EAGlB,MAAM,EACP,MAAM,uBAAuB,CAAC;AAU/B,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAEzB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cACR,SAAQ,cAAc,CAAC,OAAO,CAAC,EAC7B,IAAI,CAAC,YAAY,EAAE,kBAAkB,GAAG,UAAU,CAAC;IACrD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAEhD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAO,EAAE,EACP,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,cAAqB,EAC9B,GAAG,YAAY,EACX,EACN,YAAiB,EACjB,WAAgB,EAChB,OAAgB,EAChB,IAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,2CAyOjB;AA6CD,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,YAAY,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAIf,OAAO,EAGL,KAAK,iBAAiB,EAWtB,KAAK,YAAY,EACjB,cAAc,EAEf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,KAAK,MAAM,EAAc,MAAM,iCAAiC,CAAC;AAC1E,OAAO,EACL,KAAK,eAAe,EAGpB,KAAK,YAAY,EAClB,MAAM,kBAAkB,CAAC;AAK1B,OAAO,EACL,kBAAkB,EAGlB,MAAM,EACP,MAAM,uBAAuB,CAAC;AAS/B,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IAEzB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cACR,SAAQ,cAAc,CAAC,OAAO,CAAC,EAC7B,IAAI,CAAC,YAAY,EAAE,kBAAkB,GAAG,UAAU,CAAC;IACrD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAEhD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAO,EAAE,EACP,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,cAAqB,EAC9B,GAAG,YAAY,EACX,EACN,YAAiB,EACjB,WAAgB,EAChB,OAAgB,EAChB,IAAY,EACZ,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,eAAe,2CA+OjB;AA6CD,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,cAAc,EAAE,KAAK,YAAY,EAAE,CAAC"}
@@ -13,21 +13,20 @@ import { ThemeToggle } from '../../components/layout/theme-toggle.js';
13
13
  import { NavProvider } from '../../contexts/layout.js';
14
14
  import Link from 'fumadocs-core/link';
15
15
  import { LargeSearchToggle, SearchToggle, } from '../../components/layout/search-toggle.js';
16
- import { HideIfEmpty } from 'fumadocs-core/hide-if-empty';
17
16
  import { getSidebarTabs, } from '../../utils/get-sidebar-tabs.js';
18
- export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { tabs: sidebarTabs, enabled: sidebarEnabled = true, ...sidebarProps } = {}, searchToggle = {}, themeSwitch = {}, tabMode = 'auto', i18n = false, children, ...props }) {
17
+ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { tabs: sidebarTabs, enabled: sidebarEnabled = true, ...sidebarProps } = {}, searchToggle = {}, themeSwitch = {}, tabMode = 'auto', i18n = false, children, tree, ...props }) {
19
18
  const tabs = useMemo(() => {
20
19
  if (Array.isArray(sidebarTabs)) {
21
20
  return sidebarTabs;
22
21
  }
23
22
  if (typeof sidebarTabs === 'object') {
24
- return getSidebarTabs(props.tree, sidebarTabs);
23
+ return getSidebarTabs(tree, sidebarTabs);
25
24
  }
26
25
  if (sidebarTabs !== false) {
27
- return getSidebarTabs(props.tree);
26
+ return getSidebarTabs(tree);
28
27
  }
29
28
  return [];
30
- }, [sidebarTabs, props.tree]);
29
+ }, [tree, sidebarTabs]);
31
30
  const links = getLinks(props.links ?? [], props.githubUrl);
32
31
  const sidebarVariables = cn('md:[--fd-sidebar-width:268px] lg:[--fd-sidebar-width:286px]');
33
32
  function sidebar() {
@@ -53,17 +52,20 @@ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { t
53
52
  size: 'icon-sm',
54
53
  className: 'mb-auto text-fd-muted-foreground',
55
54
  })), children: _jsx(SidebarIcon, {}) }))] }), searchToggle.enabled !== false &&
56
- (searchToggle.components?.lg ?? (_jsx(LargeSearchToggle, { hideIfDisabled: true }))), tabs.length > 0 && tabMode === 'auto' && (_jsx(RootToggle, { options: tabs })), banner] }), viewport, _jsxs(HideIfEmpty, { as: SidebarFooter, children: [_jsxs("div", { className: "flex text-fd-muted-foreground items-center empty:hidden", children: [i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5" }) })) : null, iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon-sm', color: 'ghost' })), "aria-label": item.label, children: item.icon }, i))), themeSwitch.enabled !== false &&
57
- (themeSwitch.component ?? (_jsx(ThemeToggle, { className: "ms-auto p-0", mode: themeSwitch.mode })))] }), footer] })] }));
55
+ (searchToggle.components?.lg ?? (_jsx(LargeSearchToggle, { hideIfDisabled: true }))), tabs.length > 0 && tabMode === 'auto' && (_jsx(RootToggle, { options: tabs })), banner] }), viewport, (i18n ||
56
+ iconLinks.length > 0 ||
57
+ themeSwitch?.enabled !== false ||
58
+ footer) && (_jsxs(SidebarFooter, { children: [_jsxs("div", { className: "flex text-fd-muted-foreground items-center empty:hidden", children: [i18n && (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5" }) })), iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon-sm', color: 'ghost' })), "aria-label": item.label, children: item.icon }, i))), themeSwitch.enabled !== false &&
59
+ (themeSwitch.component ?? (_jsx(ThemeToggle, { className: "ms-auto p-0", mode: themeSwitch.mode })))] }), footer] }))] }));
58
60
  return (_jsx(Sidebar, { defaultOpenLevel: defaultOpenLevel, prefetch: prefetch, Mobile: mobile, Content: _jsxs(_Fragment, { children: [collapsible && _jsx(CollapsibleControl, {}), content] }) }));
59
61
  }
60
- return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [nav.enabled !== false &&
62
+ return (_jsx(TreeContextProvider, { tree: tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [nav.enabled !== false &&
61
63
  (nav.component ?? (_jsxs(Navbar, { className: "h-(--fd-nav-height) on-root:[--fd-nav-height:56px] md:on-root:[--fd-nav-height:0px] md:hidden", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-semibold", children: nav.title }), _jsx("div", { className: "flex-1", children: nav.children }), searchToggle.enabled !== false &&
62
64
  (searchToggle.components?.sm ?? (_jsx(SearchToggle, { className: "p-2", hideIfDisabled: true }))), sidebarEnabled && (_jsx(SidebarTrigger, { className: cn(buttonVariants({
63
65
  color: 'ghost',
64
66
  size: 'icon-sm',
65
67
  className: 'p-2',
66
- })), children: _jsx(SidebarIcon, {}) }))] }))), _jsxs(LayoutBody, { ...props.containerProps, className: cn('md:[&_#nd-page_article]:pt-12 xl:[--fd-toc-width:286px] xl:[&_#nd-page_article]:px-8', sidebarEnabled && sidebarVariables, props.containerProps?.className), children: [sidebarEnabled && sidebar(), tabMode === 'top' && tabs.length > 0 && (_jsx(LayoutTabs, { options: tabs, className: "sticky top-[calc(var(--fd-nav-height)+var(--fd-tocnav-height))] z-10 bg-fd-background border-b px-6 pt-3 xl:px-8 max-md:hidden" })), children] })] }) }));
68
+ })), children: _jsx(SidebarIcon, {}) }))] }))), _jsxs(LayoutBody, { ...props.containerProps, className: cn('md:[&_#nd-page_article]:pt-12 xl:[&_#nd-page_article]:px-8', sidebarEnabled && sidebarVariables, props.containerProps?.className), children: [sidebarEnabled && sidebar(), tabMode === 'top' && tabs.length > 0 && (_jsx(LayoutTabs, { options: tabs, className: "sticky top-[calc(var(--fd-nav-height)+var(--fd-tocnav-height))] z-10 bg-fd-background border-b px-6 pt-3 xl:px-8 max-md:hidden" })), children] })] }) }));
67
69
  }
68
70
  function SidebarLinkItem({ item, ...props }) {
69
71
  if (item.type === 'menu')
@@ -149,7 +149,7 @@ export function PageBreadcrumb({ includeRoot, includeSeparator, includePage, ...
149
149
  export function PageTOC(props) {
150
150
  const { collapsed } = useSidebar();
151
151
  const offset = collapsed ? '0px' : 'var(--fd-layout-offset)';
152
- return (_jsx("div", { id: "nd-toc", ...props, className: cn('fixed bottom-0 pt-12 pb-2 pr-(--removed-body-scroll-bar-size,0) max-xl:hidden', props.className), style: {
152
+ return (_jsx("div", { id: "nd-toc", ...props, className: cn('fixed bottom-0 pt-12 pb-2 pr-(--removed-body-scroll-bar-size,0) xl:on-root:[--fd-toc-width:286px] max-xl:hidden', props.className), style: {
153
153
  ...props.style,
154
154
  top: 'calc(var(--fd-banner-height) + var(--fd-nav-height))',
155
155
  insetInlineEnd: `max(${offset}, calc(50vw - var(--fd-sidebar-width)/2 - var(--fd-page-width)/2))`,
@@ -1 +1 @@
1
- {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/page.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,cAAc,EACd,UAAU,EACV,cAAc,EACd,OAAO,EACP,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,eAAe,CAAC;AAKvB,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,2CAavD;AAED,wBAAgB,YAAY,CAAC,EAC3B,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAAE,2CAM1D;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAAE,2CAM1D;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,SAAS,CAAC,2CAY3D;AAED,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,KAAK,CAAC;IACtD,GAAG,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC;CACrD;AAED,wBAAgB,QAAQ,CAAC,EAAE,GAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,2CAgBtE;AAED,OAAO,EACL,cAAc,EACd,UAAU,EACV,cAAc,EACd,OAAO,EACP,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACrB,KAAK,WAAW,EAChB,KAAK,eAAe,GACrB,CAAC"}
1
+ {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/page.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EACL,KAAK,eAAe,EACpB,KAAK,WAAW,EAChB,cAAc,EACd,UAAU,EACV,cAAc,EACd,OAAO,EACP,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,eAAe,CAAC;AAKvB,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,IAAI,CAAC,2CAcvD;AAED,wBAAgB,YAAY,CAAC,EAC3B,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAAE,2CAM1D;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;CAAE,2CAM1D;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,SAAS,CAAC,2CAY3D;AAED,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,KAAK,CAAC;IACtD,GAAG,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC;CACrD;AAED,wBAAgB,QAAQ,CAAC,EAAE,GAAW,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,2CAgBtE;AAED,OAAO,EACL,cAAc,EACd,UAAU,EACV,cAAc,EACd,OAAO,EACP,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACrB,KAAK,WAAW,EAChB,KAAK,eAAe,GACrB,CAAC"}
@@ -6,7 +6,7 @@ import { Text } from '../../icons.js';
6
6
  import { I18nLabel } from '../../contexts/i18n.js';
7
7
  import ClerkTOCItems from '../../components/layout/toc-clerk.js';
8
8
  export function PageTOCTitle(props) {
9
- return (_jsxs("h3", { ...props, className: cn('inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground', props.className), children: [_jsx(Text, { className: "size-4" }), _jsx(I18nLabel, { label: "toc" })] }));
9
+ return (_jsxs("h3", { id: "toc-title", ...props, className: cn('inline-flex items-center gap-1.5 text-sm text-fd-muted-foreground', props.className), children: [_jsx(Text, { className: "size-4" }), _jsx(I18nLabel, { label: "toc" })] }));
10
10
  }
11
11
  export function PageTOCItems({ variant = 'normal', ...props }) {
12
12
  return (_jsx(TOCScrollArea, { ...props, children: variant === 'clerk' ? _jsx(ClerkTOCItems, {}) : _jsx(TOCItems, {}) }));
@@ -1,6 +1,6 @@
1
- import { type ComponentProps, type HTMLAttributes, type ReactNode } from 'react';
1
+ import { type ComponentProps, type FC, type HTMLAttributes, type ReactNode } from 'react';
2
2
  import { type BaseLayoutProps } from '../../layouts/shared/index.js';
3
- import { type SidebarComponents, type SidebarProps } from '../../components/layout/sidebar.js';
3
+ import { type SidebarComponents, SidebarFooter, SidebarHeader, type SidebarProps } from '../../components/layout/sidebar.js';
4
4
  import type * as PageTree from 'fumadocs-core/page-tree';
5
5
  import { Navbar, NavbarSidebarTrigger } from '../../layouts/notebook/client.js';
6
6
  import { type Option } from '../../components/layout/root-toggle.js';
@@ -20,8 +20,8 @@ interface SidebarOptions extends ComponentProps<'aside'>, Pick<SidebarProps, 'de
20
20
  * Root Toggle options
21
21
  */
22
22
  tabs?: Option[] | GetSidebarTabsOptions | false;
23
- banner?: ReactNode;
24
- footer?: ReactNode;
23
+ banner?: ReactNode | FC<ComponentProps<typeof SidebarHeader>>;
24
+ footer?: ReactNode | FC<ComponentProps<typeof SidebarFooter>>;
25
25
  /**
26
26
  * Support collapsing the sidebar on desktop mode
27
27
  *
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/notebook/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,eAAe,EAKrB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAGL,KAAK,iBAAiB,EAWtB,KAAK,YAAY,EAGlB,MAAM,6BAA6B,CAAC;AAiBrC,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAGL,MAAM,EACN,oBAAoB,EACrB,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,KAAK,MAAM,EAAc,MAAM,iCAAiC,CAAC;AAO1E,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B,GAAG,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG;QAC7B,IAAI,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;KACvB,CAAC;IAEF,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cACR,SAAQ,cAAc,CAAC,OAAO,CAAC,EAC7B,IAAI,CAAC,YAAY,EAAE,kBAAkB,GAAG,UAAU,CAAC;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAEhD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAwNhD;AA8PD,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/notebook/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,EAAE,EAEP,KAAK,cAAc,EACnB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,eAAe,EAKrB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAGL,KAAK,iBAAiB,EAOtB,aAAa,EACb,aAAa,EAGb,KAAK,YAAY,EAGlB,MAAM,6BAA6B,CAAC;AAiBrC,OAAO,KAAK,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAGL,MAAM,EACN,oBAAoB,EACrB,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,KAAK,MAAM,EAAc,MAAM,iCAAiC,CAAC;AAM1E,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B,GAAG,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG;QAC7B,IAAI,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;KACvB,CAAC;IAEF,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,UAAU,cACR,SAAQ,cAAc,CAAC,OAAO,CAAC,EAC7B,IAAI,CAAC,YAAY,EAAE,kBAAkB,GAAG,UAAU,CAAC;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAExC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,EAAE,GAAG,qBAAqB,GAAG,KAAK,CAAC;IAEhD,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC;IAC9D,MAAM,CAAC,EAAE,SAAS,GAAG,EAAE,CAAC,cAAc,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC;IAE9D;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAyOhD;AA8PD,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,CAAC"}
@@ -1,4 +1,4 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
1
+ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import { Fragment, useMemo, } from 'react';
3
3
  import { BaseLinkItem, getLinks, } from '../../layouts/shared/index.js';
4
4
  import { Sidebar, SidebarCollapseTrigger, SidebarContent, SidebarContentMobile, SidebarFolder, SidebarFolderContent, SidebarFolderLink, SidebarFolderTrigger, SidebarFooter, SidebarHeader, SidebarItem, SidebarPageTree, SidebarTrigger, SidebarViewport, } from '../../components/layout/sidebar.js';
@@ -14,7 +14,6 @@ import { NavProvider } from '../../contexts/layout.js';
14
14
  import { RootToggle } from '../../components/layout/root-toggle.js';
15
15
  import Link from 'fumadocs-core/link';
16
16
  import { LargeSearchToggle, SearchToggle, } from '../../components/layout/search-toggle.js';
17
- import { HideIfEmpty } from 'fumadocs-core/hide-if-empty';
18
17
  import { getSidebarTabs, } from '../../utils/get-sidebar-tabs.js';
19
18
  export function DocsLayout(props) {
20
19
  const { tabMode = 'sidebar', nav: { transparentMode, ...nav } = {}, sidebar: { tabs: tabOptions, ...sidebarProps } = {}, i18n = false, themeSwitch = {}, } = props;
@@ -34,39 +33,43 @@ export function DocsLayout(props) {
34
33
  }, [tabOptions, props.tree]);
35
34
  function sidebar() {
36
35
  const { banner, footer, components, collapsible = true, prefetch, defaultOpenLevel, ...rest } = sidebarProps;
36
+ const Header = typeof banner === 'function'
37
+ ? banner
38
+ : (props) => (_jsxs(SidebarHeader, { ...props, children: [props.children, banner] }));
39
+ const Footer = typeof footer === 'function'
40
+ ? footer
41
+ : (props) => (_jsxs(SidebarFooter, { ...props, children: [props.children, footer] }));
37
42
  const iconLinks = links.filter((item) => item.type === 'icon');
38
43
  const rootToggle = (_jsxs(_Fragment, { children: [tabMode === 'sidebar' && tabs.length > 0 && (_jsx(RootToggle, { className: "mb-2", options: tabs })), tabMode === 'navbar' && tabs.length > 0 && (_jsx(RootToggle, { options: tabs, className: "lg:hidden" }))] }));
39
- const sidebarNav = (_jsxs("div", { className: "flex justify-between", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-medium", children: nav.title }), collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
40
- color: 'ghost',
41
- size: 'icon-sm',
42
- className: 'mt-px mb-auto text-fd-muted-foreground',
43
- })), children: _jsx(SidebarIcon, {}) }))] }));
44
44
  const viewport = (_jsxs(SidebarViewport, { children: [links
45
45
  .filter((item) => item.type !== 'icon')
46
46
  .map((item, i, arr) => (_jsx(SidebarLinkItem, { item: item, className: cn('lg:hidden', i === arr.length - 1 && 'mb-4') }, i))), _jsx(SidebarPageTree, { components: components })] }));
47
47
  const content = (_jsxs(SidebarContent, { ...rest, className: cn(navMode === 'top'
48
48
  ? 'border-e-0 bg-transparent'
49
- : '[--fd-nav-height:0px]', rest.className), children: [_jsxs(HideIfEmpty, { as: SidebarHeader, children: [navMode === 'auto' && sidebarNav, nav.children, banner, rootToggle] }), viewport, _jsxs(HideIfEmpty, { as: SidebarFooter, className: "flex flex-row text-fd-muted-foreground items-center", children: [iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({
50
- size: 'icon-sm',
51
- color: 'ghost',
52
- className: 'lg:hidden',
53
- })), "aria-label": item.label, children: item.icon }, i))), footer] })] }));
54
- const mobile = (_jsxs(SidebarContentMobile, { ...rest, children: [_jsxs(SidebarHeader, { children: [_jsx(SidebarTrigger, { className: cn(buttonVariants({
49
+ : '[--fd-nav-height:0px]', rest.className), children: [_jsxs(Header, { className: "empty:hidden", children: [navMode === 'auto' && (_jsxs("div", { className: "flex justify-between", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-medium", children: nav.title }), collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
50
+ color: 'ghost',
51
+ size: 'icon-sm',
52
+ className: 'mt-px mb-auto text-fd-muted-foreground',
53
+ })), children: _jsx(SidebarIcon, {}) }))] })), nav.children, rootToggle] }), viewport, _jsx(Footer, { className: cn('hidden flex-row text-fd-muted-foreground items-center', iconLinks.length > 0 && 'max-lg:flex'), children: iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({
54
+ size: 'icon-sm',
55
+ color: 'ghost',
56
+ className: 'lg:hidden',
57
+ })), "aria-label": item.label, children: item.icon }, i))) })] }));
58
+ const mobile = (_jsxs(SidebarContentMobile, { ...rest, children: [_jsxs(Header, { children: [_jsx(SidebarTrigger, { className: cn(buttonVariants({
55
59
  size: 'icon-sm',
56
60
  color: 'ghost',
57
61
  className: 'ms-auto text-fd-muted-foreground',
58
- })), children: _jsx(X, {}) }), banner, rootToggle] }), viewport, _jsxs(HideIfEmpty, { as: SidebarFooter, className: "flex flex-row items-center justify-end", children: [iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({
62
+ })), children: _jsx(X, {}) }), rootToggle] }), viewport, _jsxs(Footer, { className: cn('hidden flex-row items-center justify-end', (i18n || themeSwitch.enabled !== false) && 'flex', iconLinks.length > 0 && 'max-lg:flex'), children: [iconLinks.map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({
59
63
  size: 'icon-sm',
60
64
  color: 'ghost',
61
- }), 'text-fd-muted-foreground lg:hidden', i === iconLinks.length - 1 && 'me-auto'), "aria-label": item.label, children: item.icon }, i))), i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5 text-fd-muted-foreground" }) })) : null, themeSwitch.enabled !== false &&
62
- (themeSwitch.component ?? (_jsx(ThemeToggle, { mode: themeSwitch.mode ?? 'light-dark-system' }))), footer] })] }));
65
+ }), 'text-fd-muted-foreground lg:hidden', i === iconLinks.length - 1 && 'me-auto'), "aria-label": item.label, children: item.icon }, i))), i18n && (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5 text-fd-muted-foreground" }) })), themeSwitch.enabled !== false &&
66
+ (themeSwitch.component ?? (_jsx(ThemeToggle, { mode: themeSwitch.mode ?? 'light-dark-system' })))] })] }));
63
67
  return (_jsx(Sidebar, { defaultOpenLevel: defaultOpenLevel, prefetch: prefetch, Content: content, Mobile: mobile }));
64
68
  }
65
- return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsx(NavProvider, { transparentMode: transparentMode, children: _jsxs(LayoutBody, { ...props.containerProps, className: cn('md:[--fd-sidebar-width:286px] xl:[--fd-toc-width:286px]', props.containerProps?.className), children: [sidebar(), _jsx(DocsNavbar, { ...props, links: links, tabs: tabMode == 'navbar' ? tabs : [] }), props.children] }) }) }));
69
+ return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsx(NavProvider, { transparentMode: transparentMode, children: _jsxs(LayoutBody, { ...props.containerProps, className: cn('md:[--fd-sidebar-width:286px]', props.containerProps?.className), children: [sidebar(), _jsx(DocsNavbar, { ...props, links: links, tabs: tabMode == 'navbar' ? tabs : [] }), props.children] }) }) }));
66
70
  }
67
- function DocsNavbar({ links, tabs, searchToggle = {}, themeSwitch = {}, nav = {}, ...props }) {
71
+ function DocsNavbar({ links, tabs, sidebar: { collapsible: sidebarCollapsible = true } = {}, searchToggle = {}, themeSwitch = {}, nav = {}, i18n, }) {
68
72
  const navMode = nav.mode ?? 'auto';
69
- const sidebarCollapsible = props.sidebar?.collapsible ?? true;
70
73
  return (_jsxs(Navbar, { mode: navMode, className: cn('on-root:[--fd-nav-height:56px] md:on-root:[--fd-nav-height:64px]', tabs.length > 0 && 'lg:on-root:[--fd-nav-height:104px]'), children: [_jsxs("div", { className: cn('flex border-b px-4 gap-2 flex-1 md:px-6', navMode === 'top' && 'ps-7'), children: [_jsxs("div", { className: cn('items-center', navMode === 'top' && 'flex flex-1', navMode === 'auto' && [
71
74
  'hidden max-md:flex',
72
75
  sidebarCollapsible && 'has-data-[collapsed=true]:md:flex',
@@ -81,7 +84,7 @@ function DocsNavbar({ links, tabs, searchToggle = {}, themeSwitch = {}, nav = {}
81
84
  .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary" }, i))) }), nav.children, links
82
85
  .filter((item) => item.type === 'icon')
83
86
  .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon-sm', color: 'ghost' }), 'text-fd-muted-foreground max-lg:hidden'), "aria-label": item.label, children: item.icon }, i))), _jsxs("div", { className: "flex items-center md:hidden", children: [searchToggle.enabled !== false &&
84
- (searchToggle.components?.sm ?? (_jsx(SearchToggle, { hideIfDisabled: true, className: "p-2" }))), _jsx(NavbarSidebarTrigger, { className: "p-2 -me-1.5" })] }), _jsxs("div", { className: "flex items-center gap-2 max-md:hidden", children: [props.i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5 text-fd-muted-foreground" }) })) : null, themeSwitch.enabled !== false &&
87
+ (searchToggle.components?.sm ?? (_jsx(SearchToggle, { hideIfDisabled: true, className: "p-2" }))), _jsx(NavbarSidebarTrigger, { className: "p-2 -me-1.5" })] }), _jsxs("div", { className: "flex items-center gap-2 max-md:hidden", children: [i18n && (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-4.5 text-fd-muted-foreground" }) })), themeSwitch.enabled !== false &&
85
88
  (themeSwitch.component ?? (_jsx(ThemeToggle, { mode: themeSwitch.mode ?? 'light-dark-system' }))), sidebarCollapsible && navMode === 'top' && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
86
89
  color: 'secondary',
87
90
  size: 'icon-sm',
package/dist/page.d.ts CHANGED
@@ -18,13 +18,6 @@ interface EditOnGitHubOptions extends Omit<ComponentProps<'a'>, 'href' | 'childr
18
18
  interface BreadcrumbOptions extends BreadcrumbProps {
19
19
  enabled: boolean;
20
20
  component: ReactNode;
21
- /**
22
- * Show the full path to the current page
23
- *
24
- * @defaultValue false
25
- * @deprecated use `includePage` instead
26
- */
27
- full?: boolean;
28
21
  }
29
22
  interface FooterOptions extends FooterProps {
30
23
  enabled: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"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"}
package/dist/page.js CHANGED
@@ -19,7 +19,7 @@ export function DocsPage({ editOnGithub, breadcrumb: { enabled: breadcrumbEnable
19
19
  toc,
20
20
  single: tocOptions.single,
21
21
  }
22
- : false, ...container, className: cn(!tocEnabled && '[--fd-toc-width:0px]', container?.className), children: [tocPopoverEnabled &&
22
+ : false, ...container, children: [tocPopoverEnabled &&
23
23
  (tocPopover ?? (_jsxs(PageTOCPopover, { children: [_jsx(PageTOCPopoverTrigger, {}), _jsxs(PageTOCPopoverContent, { children: [tocPopoverOptions.header, _jsx(PageTOCPopoverItems, { variant: tocPopoverOptions.style }), tocPopoverOptions.footer] })] }))), _jsxs(PageArticle, { ...article, children: [breadcrumbEnabled &&
24
24
  (breadcrumb ?? _jsx(PageBreadcrumb, { ...breadcrumbProps })), children, _jsxs("div", { className: "flex flex-row flex-wrap items-center justify-between gap-4 empty:hidden", children: [editOnGithub && (_jsx(EditOnGitHub, { href: `https://github.com/${editOnGithub.owner}/${editOnGithub.repo}/blob/${editOnGithub.sha}/${editOnGithub.path.startsWith('/') ? editOnGithub.path.slice(1) : editOnGithub.path}` })), lastUpdate && _jsx(PageLastUpdate, { date: new Date(lastUpdate) })] }), footer.enabled !== false &&
25
25
  (footer.component ?? _jsx(PageFooter, { items: footer.items }))] }), tocEnabled &&
@@ -1,4 +1,8 @@
1
- export { RootProvider } from './next.js';
1
+ export {
2
+ /**
3
+ * @deprecated Import from `fumadocs-ui/provider/next` instead.
4
+ */
5
+ RootProvider, } from './next.js';
2
6
  export { useI18n, I18nLabel } from '../contexts/i18n.js';
3
7
  export { SearchProvider, SearchOnly, useSearchContext, type SearchProviderProps, } from '../contexts/search.js';
4
8
  export { SidebarProvider, useSidebar } from '../contexts/sidebar.js';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/provider/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAEtC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,UAAU,EACV,gBAAgB,EAChB,KAAK,mBAAmB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EACL,WAAW,EACX,cAAc,EACd,mBAAmB,GACpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,MAAM,EACN,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,UAAU,EACf,cAAc,EACd,aAAa,GACd,MAAM,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/provider/index.tsx"],"names":[],"mappings":"AAMA,OAAO;AACL;;GAEG;AACH,YAAY,GACb,MAAM,QAAQ,CAAC;AAEhB,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EACL,cAAc,EACd,UAAU,EACV,gBAAgB,EAChB,KAAK,mBAAmB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACjE,OAAO,EACL,WAAW,EACX,cAAc,EACd,mBAAmB,GACpB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,MAAM,EACN,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,UAAU,EACf,cAAc,EACd,aAAa,GACd,MAAM,mBAAmB,CAAC"}
@@ -1,6 +1,10 @@
1
1
  'use client';
2
- // TODO: remove this, recommend `fumadocs-ui/provider/next` instead.
3
- export { RootProvider } from './next.js';
2
+ console.warn('`fumadocs-ui/provider` export will be removed on v17, you can import from `fumadocs-ui/provider/next` instead.');
3
+ export {
4
+ /**
5
+ * @deprecated Import from `fumadocs-ui/provider/next` instead.
6
+ */
7
+ RootProvider, } from './next.js';
4
8
  export { useI18n, I18nLabel } from '../contexts/i18n.js';
5
9
  export { SearchProvider, SearchOnly, useSearchContext, } from '../contexts/search.js';
6
10
  export { SidebarProvider, useSidebar } from '../contexts/sidebar.js';
package/dist/style.css CHANGED
@@ -1,4 +1,4 @@
1
- /*! tailwindcss v4.1.14 | MIT License | https://tailwindcss.com */
1
+ /*! tailwindcss v4.1.15 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
@@ -51,29 +51,30 @@
51
51
  --color-fd-accent: hsla(0, 0%, 82%, 50%);
52
52
  --color-fd-accent-foreground: hsl(0, 0%, 9%);
53
53
  --color-fd-ring: hsl(0, 0%, 63.9%);
54
+ --color-fd-overlay: transparent;
54
55
  --color-fd-info: oklch(62.3% 0.214 259.815);
55
56
  --color-fd-warning: oklch(76.9% 0.188 70.08);
56
57
  --color-fd-error: oklch(63.7% 0.237 25.331);
57
58
  --color-fd-success: oklch(72.3% 0.219 149.579);
59
+ --color-fd-diff-remove: rgba(200, 10, 100, 0.12);
60
+ --color-fd-diff-remove-symbol: rgb(230, 10, 100);
61
+ --color-fd-diff-add: rgba(14, 180, 100, 0.1);
62
+ --color-fd-diff-add-symbol: rgb(10, 200, 100);
58
63
  --fd-sidebar-mobile-offset: 100%;
59
64
  --spacing-fd-container: 1400px;
60
65
  --fd-page-width: 1200px;
61
66
  --fd-sidebar-width: 0px;
62
67
  --fd-toc-width: 0px;
63
- --fd-layout-width: 100vw;
68
+ --fd-layout-width: 1600px;
64
69
  --fd-banner-height: 0px;
65
70
  --fd-nav-height: 0px;
66
71
  --fd-tocnav-height: 0px;
67
- --color-fd-diff-remove: rgba(200, 10, 100, 0.12);
68
- --color-fd-diff-remove-symbol: rgb(230, 10, 100);
69
- --color-fd-diff-add: rgba(14, 180, 100, 0.1);
70
- --color-fd-diff-add-symbol: rgb(10, 200, 100);
71
72
  --animate-fd-fade-in: fd-fade-in 300ms ease;
72
73
  --animate-fd-fade-out: fd-fade-out 300ms ease;
73
74
  --animate-fd-dialog-in: fd-dialog-in 300ms cubic-bezier(0.16, 1, 0.3, 1);
74
75
  --animate-fd-dialog-out: fd-dialog-out 300ms cubic-bezier(0.16, 1, 0.3, 1);
75
- --animate-fd-popover-in: fd-popover-in 130ms ease;
76
- --animate-fd-popover-out: fd-popover-out 130ms ease;
76
+ --animate-fd-popover-in: fd-popover-in 100ms ease;
77
+ --animate-fd-popover-out: fd-popover-out 100ms ease;
77
78
  --animate-fd-collapsible-down: fd-collapsible-down 150ms
78
79
  cubic-bezier(0.45, 0, 0.55, 1);
79
80
  --animate-fd-collapsible-up: fd-collapsible-up 150ms
@@ -199,7 +200,9 @@
199
200
  ::placeholder {
200
201
  color: currentcolor;
201
202
  @supports (color: color-mix(in lab, red, red)) {
202
- color: color-mix(in oklab, currentcolor 50%, transparent);
203
+ & {
204
+ color: color-mix(in oklab, currentcolor 50%, transparent);
205
+ }
203
206
  }
204
207
  }
205
208
  }
@@ -800,7 +803,9 @@
800
803
  }
801
804
  --tw-prose-body: color-mix(in srgb, hsl(0, 0%, 3.9%) 90%, transparent);
802
805
  @supports (color: color-mix(in lab, red, red)) {
803
- --tw-prose-body: color-mix(in oklab, var(--color-fd-foreground) 90%, transparent);
806
+ & {
807
+ --tw-prose-body: color-mix(in oklab, var(--color-fd-foreground) 90%, transparent);
808
+ }
804
809
  }
805
810
  --tw-prose-headings: var(--color-fd-foreground);
806
811
  --tw-prose-lead: var(--color-fd-foreground);
@@ -818,7 +823,9 @@
818
823
  --tw-prose-kbd: var(--color-fd-foreground);
819
824
  --tw-prose-kbd-shadows: color-mix(in srgb, hsl(0, 0%, 9%) 50%, transparent);
820
825
  @supports (color: color-mix(in lab, red, red)) {
821
- --tw-prose-kbd-shadows: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
826
+ & {
827
+ --tw-prose-kbd-shadows: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
828
+ }
822
829
  }
823
830
  :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
824
831
  margin-top: 0;
@@ -915,6 +922,9 @@
915
922
  .block {
916
923
  display: block;
917
924
  }
925
+ .contents {
926
+ display: contents;
927
+ }
918
928
  .flex {
919
929
  display: flex;
920
930
  }
@@ -1008,6 +1018,9 @@
1008
1018
  .h-px {
1009
1019
  height: 1px;
1010
1020
  }
1021
+ .max-h-\(--radix-popover-content-available-height\) {
1022
+ max-height: var(--radix-popover-content-available-height);
1023
+ }
1011
1024
  .max-h-\[50vh\] {
1012
1025
  max-height: 50vh;
1013
1026
  }
@@ -1248,6 +1261,9 @@
1248
1261
  .overflow-x-auto {
1249
1262
  overflow-x: auto;
1250
1263
  }
1264
+ .overflow-x-hidden {
1265
+ overflow-x: hidden;
1266
+ }
1251
1267
  .overflow-y-auto {
1252
1268
  overflow-y: auto;
1253
1269
  }
@@ -1310,7 +1326,9 @@
1310
1326
  .border-fd-foreground\/10 {
1311
1327
  border-color: color-mix(in srgb, hsl(0, 0%, 3.9%) 10%, transparent);
1312
1328
  @supports (color: color-mix(in lab, red, red)) {
1313
- border-color: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1329
+ & {
1330
+ border-color: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1331
+ }
1314
1332
  }
1315
1333
  }
1316
1334
  .border-fd-primary {
@@ -1322,7 +1340,9 @@
1322
1340
  .bg-\(--callout-color\)\/50 {
1323
1341
  background-color: var(--callout-color);
1324
1342
  @supports (color: color-mix(in lab, red, red)) {
1325
- background-color: color-mix(in oklab, var(--callout-color) 50%, transparent);
1343
+ & {
1344
+ background-color: color-mix(in oklab, var(--callout-color) 50%, transparent);
1345
+ }
1326
1346
  }
1327
1347
  }
1328
1348
  .bg-\(--shiki-light-bg\) {
@@ -1337,7 +1357,9 @@
1337
1357
  .bg-fd-background\/80 {
1338
1358
  background-color: color-mix(in srgb, hsl(0, 0%, 96%) 80%, transparent);
1339
1359
  @supports (color: color-mix(in lab, red, red)) {
1340
- background-color: color-mix(in oklab, var(--color-fd-background) 80%, transparent);
1360
+ & {
1361
+ background-color: color-mix(in oklab, var(--color-fd-background) 80%, transparent);
1362
+ }
1341
1363
  }
1342
1364
  }
1343
1365
  .bg-fd-border {
@@ -1349,19 +1371,26 @@
1349
1371
  .bg-fd-foreground\/10 {
1350
1372
  background-color: color-mix(in srgb, hsl(0, 0%, 3.9%) 10%, transparent);
1351
1373
  @supports (color: color-mix(in lab, red, red)) {
1352
- background-color: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1374
+ & {
1375
+ background-color: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1376
+ }
1353
1377
  }
1354
1378
  }
1355
1379
  .bg-fd-muted {
1356
1380
  background-color: var(--color-fd-muted);
1357
1381
  }
1382
+ .bg-fd-overlay {
1383
+ background-color: var(--color-fd-overlay);
1384
+ }
1358
1385
  .bg-fd-popover {
1359
1386
  background-color: var(--color-fd-popover);
1360
1387
  }
1361
1388
  .bg-fd-popover\/60 {
1362
1389
  background-color: color-mix(in srgb, hsl(0, 0%, 98%) 60%, transparent);
1363
1390
  @supports (color: color-mix(in lab, red, red)) {
1364
- background-color: color-mix(in oklab, var(--color-fd-popover) 60%, transparent);
1391
+ & {
1392
+ background-color: color-mix(in oklab, var(--color-fd-popover) 60%, transparent);
1393
+ }
1365
1394
  }
1366
1395
  }
1367
1396
  .bg-fd-primary {
@@ -1370,7 +1399,9 @@
1370
1399
  .bg-fd-primary\/10 {
1371
1400
  background-color: color-mix(in srgb, hsl(0, 0%, 9%) 10%, transparent);
1372
1401
  @supports (color: color-mix(in lab, red, red)) {
1373
- background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
1402
+ & {
1403
+ background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
1404
+ }
1374
1405
  }
1375
1406
  }
1376
1407
  .bg-fd-secondary {
@@ -1379,7 +1410,9 @@
1379
1410
  .bg-fd-secondary\/50 {
1380
1411
  background-color: color-mix(in srgb, hsl(0, 0%, 93.1%) 50%, transparent);
1381
1412
  @supports (color: color-mix(in lab, red, red)) {
1382
- background-color: color-mix(in oklab, var(--color-fd-secondary) 50%, transparent);
1413
+ & {
1414
+ background-color: color-mix(in oklab, var(--color-fd-secondary) 50%, transparent);
1415
+ }
1383
1416
  }
1384
1417
  }
1385
1418
  .bg-transparent {
@@ -1394,13 +1427,17 @@
1394
1427
  .stroke-current\/25 {
1395
1428
  stroke: currentcolor;
1396
1429
  @supports (color: color-mix(in lab, red, red)) {
1397
- stroke: color-mix(in oklab, currentcolor 25%, transparent);
1430
+ & {
1431
+ stroke: color-mix(in oklab, currentcolor 25%, transparent);
1432
+ }
1398
1433
  }
1399
1434
  }
1400
1435
  .stroke-fd-foreground\/10 {
1401
1436
  stroke: color-mix(in srgb, hsl(0, 0%, 3.9%) 10%, transparent);
1402
1437
  @supports (color: color-mix(in lab, red, red)) {
1403
- stroke: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1438
+ & {
1439
+ stroke: color-mix(in oklab, var(--color-fd-foreground) 10%, transparent);
1440
+ }
1404
1441
  }
1405
1442
  }
1406
1443
  .p-0 {
@@ -1622,7 +1659,9 @@
1622
1659
  .text-fd-foreground\/80 {
1623
1660
  color: color-mix(in srgb, hsl(0, 0%, 3.9%) 80%, transparent);
1624
1661
  @supports (color: color-mix(in lab, red, red)) {
1625
- color: color-mix(in oklab, var(--color-fd-foreground) 80%, transparent);
1662
+ & {
1663
+ color: color-mix(in oklab, var(--color-fd-foreground) 80%, transparent);
1664
+ }
1626
1665
  }
1627
1666
  }
1628
1667
  .text-fd-muted-foreground {
@@ -1631,7 +1670,9 @@
1631
1670
  .text-fd-muted-foreground\/50 {
1632
1671
  color: color-mix(in srgb, hsl(0, 0%, 45.1%) 50%, transparent);
1633
1672
  @supports (color: color-mix(in lab, red, red)) {
1634
- color: color-mix(in oklab, var(--color-fd-muted-foreground) 50%, transparent);
1673
+ & {
1674
+ color: color-mix(in oklab, var(--color-fd-muted-foreground) 50%, transparent);
1675
+ }
1635
1676
  }
1636
1677
  }
1637
1678
  .text-fd-popover-foreground {
@@ -1640,7 +1681,9 @@
1640
1681
  .text-fd-popover-foreground\/80 {
1641
1682
  color: color-mix(in srgb, hsl(0, 0%, 15.1%) 80%, transparent);
1642
1683
  @supports (color: color-mix(in lab, red, red)) {
1643
- color: color-mix(in oklab, var(--color-fd-popover-foreground) 80%, transparent);
1684
+ & {
1685
+ color: color-mix(in oklab, var(--color-fd-popover-foreground) 80%, transparent);
1686
+ }
1644
1687
  }
1645
1688
  }
1646
1689
  .text-fd-primary {
@@ -1652,7 +1695,9 @@
1652
1695
  .text-fd-primary\/50 {
1653
1696
  color: color-mix(in srgb, hsl(0, 0%, 9%) 50%, transparent);
1654
1697
  @supports (color: color-mix(in lab, red, red)) {
1655
- color: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
1698
+ & {
1699
+ color: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
1700
+ }
1656
1701
  }
1657
1702
  }
1658
1703
  .text-fd-secondary-foreground {
@@ -1689,7 +1734,9 @@
1689
1734
  .shadow-black\/50 {
1690
1735
  --tw-shadow-color: color-mix(in srgb, #000 50%, transparent);
1691
1736
  @supports (color: color-mix(in lab, red, red)) {
1692
- --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 50%, transparent) var(--tw-shadow-alpha), transparent);
1737
+ & {
1738
+ --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 50%, transparent) var(--tw-shadow-alpha), transparent);
1739
+ }
1693
1740
  }
1694
1741
  }
1695
1742
  .outline {
@@ -1789,9 +1836,6 @@
1789
1836
  .\[--fd-nav-height\:56px\] {
1790
1837
  --fd-nav-height: 56px;
1791
1838
  }
1792
- .\[--fd-toc-width\:0px\] {
1793
- --fd-toc-width: 0px;
1794
- }
1795
1839
  .\[scrollbar-width\:none\] {
1796
1840
  scrollbar-width: none;
1797
1841
  }
@@ -1960,7 +2004,9 @@
1960
2004
  @media (hover: hover) {
1961
2005
  background-color: color-mix(in srgb, hsla(0, 0%, 82%, 50%) 50%, transparent);
1962
2006
  @supports (color: color-mix(in lab, red, red)) {
1963
- background-color: color-mix(in oklab, var(--color-fd-accent) 50%, transparent);
2007
+ & {
2008
+ background-color: color-mix(in oklab, var(--color-fd-accent) 50%, transparent);
2009
+ }
1964
2010
  }
1965
2011
  }
1966
2012
  }
@@ -1970,7 +2016,9 @@
1970
2016
  @media (hover: hover) {
1971
2017
  background-color: color-mix(in srgb, hsla(0, 0%, 82%, 50%) 80%, transparent);
1972
2018
  @supports (color: color-mix(in lab, red, red)) {
1973
- background-color: color-mix(in oklab, var(--color-fd-accent) 80%, transparent);
2019
+ & {
2020
+ background-color: color-mix(in oklab, var(--color-fd-accent) 80%, transparent);
2021
+ }
1974
2022
  }
1975
2023
  }
1976
2024
  }
@@ -1980,7 +2028,9 @@
1980
2028
  @media (hover: hover) {
1981
2029
  background-color: color-mix(in srgb, hsl(0, 0%, 9%) 80%, transparent);
1982
2030
  @supports (color: color-mix(in lab, red, red)) {
1983
- background-color: color-mix(in oklab, var(--color-fd-primary) 80%, transparent);
2031
+ & {
2032
+ background-color: color-mix(in oklab, var(--color-fd-primary) 80%, transparent);
2033
+ }
1984
2034
  }
1985
2035
  }
1986
2036
  }
@@ -1997,7 +2047,9 @@
1997
2047
  @media (hover: hover) {
1998
2048
  color: color-mix(in srgb, hsl(0, 0%, 9%) 80%, transparent);
1999
2049
  @supports (color: color-mix(in lab, red, red)) {
2000
- color: color-mix(in oklab, var(--color-fd-accent-foreground) 80%, transparent);
2050
+ & {
2051
+ color: color-mix(in oklab, var(--color-fd-accent-foreground) 80%, transparent);
2052
+ }
2001
2053
  }
2002
2054
  }
2003
2055
  }
@@ -2007,7 +2059,9 @@
2007
2059
  @media (hover: hover) {
2008
2060
  color: color-mix(in srgb, hsl(0, 0%, 15.1%) 50%, transparent);
2009
2061
  @supports (color: color-mix(in lab, red, red)) {
2010
- color: color-mix(in oklab, var(--color-fd-popover-foreground) 50%, transparent);
2062
+ & {
2063
+ color: color-mix(in oklab, var(--color-fd-popover-foreground) 50%, transparent);
2064
+ }
2011
2065
  }
2012
2066
  }
2013
2067
  }
@@ -2279,7 +2333,9 @@
2279
2333
  &[data-state="open"] {
2280
2334
  background-color: color-mix(in srgb, hsla(0, 0%, 82%, 50%) 50%, transparent);
2281
2335
  @supports (color: color-mix(in lab, red, red)) {
2282
- background-color: color-mix(in oklab, var(--color-fd-accent) 50%, transparent);
2336
+ & {
2337
+ background-color: color-mix(in oklab, var(--color-fd-accent) 50%, transparent);
2338
+ }
2283
2339
  }
2284
2340
  }
2285
2341
  }
@@ -2298,6 +2354,11 @@
2298
2354
  display: none;
2299
2355
  }
2300
2356
  }
2357
+ .max-lg\:flex {
2358
+ @media (width < 64rem) {
2359
+ display: flex;
2360
+ }
2361
+ }
2301
2362
  .max-lg\:hidden {
2302
2363
  @media (width < 64rem) {
2303
2364
  display: none;
@@ -2514,11 +2575,6 @@
2514
2575
  padding-inline: calc(var(--spacing) * 8);
2515
2576
  }
2516
2577
  }
2517
- .xl\:\[--fd-toc-width\:286px\] {
2518
- @media (width >= 80rem) {
2519
- --fd-toc-width: 286px;
2520
- }
2521
- }
2522
2578
  .\@max-xl\:hidden {
2523
2579
  @container (width < 36rem) {
2524
2580
  display: none;
@@ -2594,6 +2650,13 @@
2594
2650
  }
2595
2651
  }
2596
2652
  }
2653
+ .xl\:on-root\:\[--fd-toc-width\:286px\] {
2654
+ @media (width >= 80rem) {
2655
+ :root:has(&) {
2656
+ --fd-toc-width: 286px;
2657
+ }
2658
+ }
2659
+ }
2597
2660
  .md\:\[\&_\#nd-page_article\]\:pt-12 {
2598
2661
  @media (width >= 48rem) {
2599
2662
  & #nd-page article {
@@ -2672,6 +2735,7 @@
2672
2735
  --color-fd-accent: hsla(0, 0%, 40.9%, 30%);
2673
2736
  --color-fd-accent-foreground: hsl(0, 0%, 90%);
2674
2737
  --color-fd-ring: hsl(0, 0%, 54.9%);
2738
+ --color-fd-overlay: hsla(0, 0%, 0%, 0.2);
2675
2739
  }
2676
2740
  .dark #nd-sidebar {
2677
2741
  --color-fd-muted: hsl(0, 0%, 16%);
@@ -2718,7 +2782,9 @@
2718
2782
  content: counter(line);
2719
2783
  color: var(--fd-counter-color, hsl(0, 0%, 45.1%));
2720
2784
  @supports (color: color-mix(in lab, red, red)) {
2721
- color: color-mix( in oklab, var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%, transparent );
2785
+ & {
2786
+ color: color-mix( in oklab, var(--fd-counter-color, var(--color-fd-muted-foreground)) 60%, transparent );
2787
+ }
2722
2788
  }
2723
2789
  top: calc(var(--spacing) * 0);
2724
2790
  left: calc(var(--spacing) * 4);
@@ -2751,11 +2817,15 @@
2751
2817
  border-left-width: 2px;
2752
2818
  border-color: color-mix(in srgb, hsl(0, 0%, 9%) 50%, transparent);
2753
2819
  @supports (color: color-mix(in lab, red, red)) {
2754
- border-color: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
2820
+ & {
2821
+ border-color: color-mix(in oklab, var(--color-fd-primary) 50%, transparent);
2822
+ }
2755
2823
  }
2756
2824
  background-color: color-mix(in srgb, hsl(0, 0%, 9%) 10%, transparent);
2757
2825
  @supports (color: color-mix(in lab, red, red)) {
2758
- background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2826
+ & {
2827
+ background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2828
+ }
2759
2829
  }
2760
2830
  }
2761
2831
  .highlighted-word& {
@@ -2766,11 +2836,15 @@
2766
2836
  border-width: 1px;
2767
2837
  border-color: color-mix(in srgb, hsl(0, 0%, 9%) 30%, transparent);
2768
2838
  @supports (color: color-mix(in lab, red, red)) {
2769
- border-color: color-mix(in oklab, var(--color-fd-primary) 30%, transparent);
2839
+ & {
2840
+ border-color: color-mix(in oklab, var(--color-fd-primary) 30%, transparent);
2841
+ }
2770
2842
  }
2771
2843
  background-color: color-mix(in srgb, hsl(0, 0%, 9%) 10%, transparent);
2772
2844
  @supports (color: color-mix(in lab, red, red)) {
2773
- background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2845
+ & {
2846
+ background-color: color-mix(in oklab, var(--color-fd-primary) 10%, transparent);
2847
+ }
2774
2848
  }
2775
2849
  --tw-font-weight: var(--font-weight-medium);
2776
2850
  font-weight: var(--font-weight-medium);
@@ -3107,13 +3181,13 @@
3107
3181
  @keyframes fd-popover-in {
3108
3182
  from {
3109
3183
  opacity: 0;
3110
- transform: scale(0.7);
3184
+ transform: scale(0.9);
3111
3185
  }
3112
3186
  }
3113
3187
  @keyframes fd-popover-out {
3114
3188
  to {
3115
3189
  opacity: 0;
3116
- transform: scale(0.7);
3190
+ transform: scale(0.9);
3117
3191
  }
3118
3192
  }
3119
3193
  @keyframes fd-fade-in {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "15.8.4",
3
+ "version": "16.0.0",
4
4
  "description": "The framework for building a documentation website in Next.js",
5
5
  "keywords": [
6
6
  "NextJs",
@@ -61,9 +61,9 @@
61
61
  "types": "./dist/layouts/shared/index.d.ts"
62
62
  },
63
63
  "./page": {
64
- "node": "./dist/page.server.js",
64
+ "node": "./dist/page.js",
65
65
  "import": "./dist/page.js",
66
- "types": "./dist/page.server.d.ts"
66
+ "types": "./dist/page.d.ts"
67
67
  },
68
68
  "./provider": {
69
69
  "import": "./dist/provider/index.js",
@@ -121,28 +121,28 @@
121
121
  "react-medium-image-zoom": "^5.4.0",
122
122
  "scroll-into-view-if-needed": "^3.1.0",
123
123
  "tailwind-merge": "^3.3.1",
124
- "fumadocs-core": "15.8.4"
124
+ "fumadocs-core": "16.0.0"
125
125
  },
126
126
  "devDependencies": {
127
- "@next/eslint-plugin-next": "^15.5.4",
128
- "@tailwindcss/cli": "^4.1.14",
127
+ "@next/eslint-plugin-next": "16.0.0",
128
+ "@tailwindcss/cli": "^4.1.15",
129
129
  "@types/lodash.merge": "^4.6.9",
130
- "@types/react": "^19.2.0",
131
- "@types/react-dom": "^19.2.0",
132
- "next": "15.5.4",
133
- "tailwindcss": "^4.1.14",
130
+ "@types/react": "^19.2.2",
131
+ "@types/react-dom": "^19.2.2",
132
+ "next": "16.0.0",
133
+ "tailwindcss": "^4.1.15",
134
134
  "tsc-alias": "^1.8.16",
135
- "@fumadocs/cli": "1.0.2",
135
+ "@fumadocs/cli": "1.0.3",
136
+ "fumadocs-core": "16.0.0",
136
137
  "eslint-config-custom": "0.0.0",
137
- "fumadocs-core": "15.8.4",
138
138
  "tsconfig": "0.0.0"
139
139
  },
140
140
  "peerDependencies": {
141
141
  "@types/react": "*",
142
- "next": "14.x.x || 15.x.x",
143
- "react": "18.x.x || 19.x.x",
144
- "react-dom": "18.x.x || 19.x.x",
145
- "tailwindcss": "^3.4.14 || ^4.0.0"
142
+ "next": "16.x.x",
143
+ "react": "^19.2.0",
144
+ "react-dom": "^19.2.0",
145
+ "tailwindcss": "^4.0.0"
146
146
  },
147
147
  "peerDependenciesMeta": {
148
148
  "next": {
@@ -1,11 +0,0 @@
1
- import type { I18nProviderProps } from '../provider/base.js';
2
- /**
3
- * @deprecated legacy I18n Provider, use `<RootProvider i18n={...} />` instead
4
- */
5
- export declare function I18nProvider({ locales, locale, onChange: _onChange, onLocaleChange, ...props }: I18nProviderProps & {
6
- /**
7
- * @deprecated use `onLocaleChange` instead
8
- */
9
- onChange?: I18nProviderProps['onLocaleChange'];
10
- }): import("react/jsx-runtime").JSX.Element;
11
- //# sourceMappingURL=legacy-i18n.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"legacy-i18n.d.ts","sourceRoot":"","sources":["../../src/contexts/legacy-i18n.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAKzD;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAY,EACZ,MAAM,EACN,QAAQ,EAAE,SAAS,EACnB,cAA0B,EAC1B,GAAG,KAAK,EACT,EAAE,iBAAiB,GAAG;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;CAChD,2CAuCA"}
@@ -1,36 +0,0 @@
1
- 'use client';
2
- import { jsx as _jsx } from "react/jsx-runtime";
3
- import { usePathname, useRouter } from 'fumadocs-core/framework';
4
- import { useMemo, useRef } from 'react';
5
- import { defaultTranslations, I18nContext } from '../contexts/i18n.js';
6
- /**
7
- * @deprecated legacy I18n Provider, use `<RootProvider i18n={...} />` instead
8
- */
9
- export function I18nProvider({ locales = [], locale, onChange: _onChange, onLocaleChange = _onChange, ...props }) {
10
- const router = useRouter();
11
- const pathname = usePathname();
12
- const onChange = onLocaleChange ??
13
- ((value) => {
14
- const segments = pathname.split('/').filter((v) => v.length > 0);
15
- // If locale prefix hidden
16
- if (segments[0] !== locale) {
17
- segments.unshift(value);
18
- }
19
- else {
20
- segments[0] = value;
21
- }
22
- router.push(`/${segments.join('/')}`);
23
- router.refresh();
24
- });
25
- const onChangeRef = useRef(onChange);
26
- onChangeRef.current = onChange;
27
- return (_jsx(I18nContext.Provider, { value: useMemo(() => ({
28
- locale,
29
- locales,
30
- text: {
31
- ...defaultTranslations,
32
- ...props.translations,
33
- },
34
- onChange: (v) => onChangeRef.current(v),
35
- }), [locale, locales, props.translations]), children: props.children }));
36
- }
@@ -1,13 +0,0 @@
1
- import type { HTMLAttributes } from 'react';
2
- import type { LoaderConfig, LoaderOutput, Page } from 'fumadocs-core/source';
3
- import { type Root } from 'fumadocs-core/page-tree';
4
- /**
5
- * @deprecated use https://fumadocs.dev/docs/ui/markdown#further-reading-section instead
6
- */
7
- export declare function DocsCategory({ page, from, tree: forcedTree, ...props }: HTMLAttributes<HTMLDivElement> & {
8
- page: Page;
9
- from: LoaderOutput<LoaderConfig>;
10
- tree?: Root;
11
- }): import("react/jsx-runtime").JSX.Element | null;
12
- export * from './page.js';
13
- //# sourceMappingURL=page.server.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"page.server.d.ts","sourceRoot":"","sources":["../src/page.server.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC7E,OAAO,EAAoB,KAAK,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAItE;;GAEG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,IAAI,EACJ,IAAI,EAAE,UAAU,EAChB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;IAClC,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,EAAE,YAAY,CAAC,YAAY,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC;CACb,kDA+CA;AAED,cAAc,QAAQ,CAAC"}
@@ -1,37 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { getPageTreePeers } from 'fumadocs-core/page-tree';
3
- import { Card, Cards } from './components/card.js';
4
- import * as path from 'node:path';
5
- /**
6
- * @deprecated use https://fumadocs.dev/docs/ui/markdown#further-reading-section instead
7
- */
8
- export function DocsCategory({ page, from, tree: forcedTree, ...props }) {
9
- let tree;
10
- if (forcedTree) {
11
- tree = forcedTree;
12
- }
13
- else if (from._i18n) {
14
- const locale = page.locale ?? from._i18n.defaultLanguage;
15
- tree = from.pageTree[locale];
16
- }
17
- else {
18
- tree = from.pageTree;
19
- }
20
- let items = getPageTreePeers(tree, page.url);
21
- if (items.length === 0) {
22
- const pages = from.getPages(page.locale);
23
- items = pages
24
- .filter((item) => path.dirname(item.path) === path.dirname(page.path) &&
25
- item.path !== page.path)
26
- .map((page) => ({
27
- type: 'page',
28
- name: page.data.title,
29
- description: page.data.description,
30
- url: page.url,
31
- }));
32
- }
33
- if (items.length === 0)
34
- return null;
35
- return (_jsx(Cards, { ...props, children: items.map((item) => (_jsx(Card, { title: item.name, description: item.description, href: item.url }, item.url))) }));
36
- }
37
- export * from './page.js';