fumadocs-ui 15.2.15 → 15.3.1

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 -2
  2. package/css/neutral.css +2 -2
  3. package/css/ocean.css +3 -3
  4. package/css/preset.css +190 -1
  5. package/css/purple.css +10 -10
  6. package/css/shiki.css +24 -7
  7. package/dist/components/accordion.js +1 -1
  8. package/dist/components/codeblock.d.ts +16 -0
  9. package/dist/components/codeblock.d.ts.map +1 -1
  10. package/dist/components/codeblock.js +12 -7
  11. package/dist/components/layout/root-toggle.d.ts +3 -3
  12. package/dist/components/layout/root-toggle.d.ts.map +1 -1
  13. package/dist/components/layout/root-toggle.js +1 -1
  14. package/dist/components/layout/sidebar.d.ts +14 -11
  15. package/dist/components/layout/sidebar.d.ts.map +1 -1
  16. package/dist/components/layout/sidebar.js +42 -33
  17. package/dist/components/tabs.d.ts +3 -1
  18. package/dist/components/tabs.d.ts.map +1 -1
  19. package/dist/components/tabs.js +25 -36
  20. package/dist/components/ui/tabs.d.ts.map +1 -1
  21. package/dist/components/ui/tabs.js +4 -4
  22. package/dist/contexts/sidebar.d.ts.map +1 -1
  23. package/dist/contexts/sidebar.js +2 -3
  24. package/dist/layouts/docs/shared.d.ts +0 -1
  25. package/dist/layouts/docs/shared.d.ts.map +1 -1
  26. package/dist/layouts/docs-client.d.ts.map +1 -1
  27. package/dist/layouts/docs-client.js +8 -8
  28. package/dist/layouts/docs.d.ts.map +1 -1
  29. package/dist/layouts/docs.js +2 -3
  30. package/dist/layouts/home/menu.js +1 -1
  31. package/dist/layouts/home/navbar.js +1 -1
  32. package/dist/layouts/notebook-client.d.ts.map +1 -1
  33. package/dist/layouts/notebook-client.js +4 -5
  34. package/dist/layouts/notebook.d.ts.map +1 -1
  35. package/dist/layouts/notebook.js +8 -8
  36. package/dist/page-client.d.ts.map +1 -1
  37. package/dist/page-client.js +3 -5
  38. package/dist/page.d.ts +2 -2
  39. package/dist/page.d.ts.map +1 -1
  40. package/dist/style.css +139 -123
  41. package/package.json +15 -13
  42. package/css/animations.css +0 -199
@@ -1,7 +1,6 @@
1
1
  'use client';
2
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { ChevronDown, ExternalLink } from '../../icons.js';
4
- import * as Base from 'fumadocs-core/sidebar';
5
4
  import { usePathname } from 'fumadocs-core/framework';
6
5
  import { createContext, Fragment, useContext, useMemo, useRef, useState, } from 'react';
7
6
  import Link from 'fumadocs-core/link';
@@ -13,7 +12,10 @@ import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from '../../comp
13
12
  import { useSidebar } from '../../contexts/sidebar.js';
14
13
  import { cva } from 'class-variance-authority';
15
14
  import { useTreeContext, useTreePath } from '../../contexts/tree.js';
16
- const itemVariants = cva('relative flex flex-row items-center gap-2 rounded-md p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0', {
15
+ import { useMediaQuery } from 'fumadocs-core/utils/use-media-query';
16
+ import { RemoveScroll } from 'react-remove-scroll';
17
+ import { Presence } from '@radix-ui/react-presence';
18
+ const itemVariants = cva('relative flex flex-row items-center gap-2 rounded-lg p-2 text-start text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4 [&_svg]:shrink-0', {
17
19
  variants: {
18
20
  active: {
19
21
  true: 'bg-fd-primary/10 text-fd-primary',
@@ -23,24 +25,49 @@ const itemVariants = cva('relative flex flex-row items-center gap-2 rounded-md p
23
25
  });
24
26
  const Context = createContext(null);
25
27
  const FolderContext = createContext(null);
26
- export function CollapsibleSidebar(props) {
27
- const { collapsed } = useSidebar();
28
+ export function Sidebar({ defaultOpenLevel = 0, prefetch = true, collapsible = true, ...props }) {
29
+ const { open, setOpen, collapsed } = useSidebar();
30
+ const context = useMemo(() => {
31
+ return {
32
+ defaultOpenLevel,
33
+ prefetch,
34
+ level: 1,
35
+ };
36
+ }, [defaultOpenLevel, prefetch]);
28
37
  const [hover, setHover] = useState(false);
29
38
  const timerRef = useRef(0);
30
39
  const closeTimeRef = useRef(0);
40
+ // md
41
+ const isMobile = useMediaQuery('(width < 768px)') ?? false;
31
42
  useOnChange(collapsed, () => {
32
43
  setHover(false);
33
44
  closeTimeRef.current = Date.now() + 150;
34
45
  });
35
- return (_jsx(Sidebar, { ...props, onPointerEnter: (e) => {
36
- if (!collapsed ||
46
+ if (isMobile) {
47
+ const state = open ? 'open' : 'closed';
48
+ return (_jsxs(_Fragment, { children: [_jsx(Presence, { present: open, children: _jsx("div", { "data-state": state, className: "fixed z-40 inset-0 bg-black/30 backdrop-blur-sm data-[state=open]:animate-fd-fade-in data-[state=closed]:animate-fd-fade-out", onClick: () => setOpen(false) }) }), _jsx(Presence, { present: open, children: ({ present }) => (_jsx(RemoveScroll, { as: "aside", enabled: present, id: "nd-sidebar-mobile", ...props, "data-state": state, className: cn('fixed text-[15px] flex flex-col rounded-e-xl border-e start-0 inset-y-0 w-[85%] max-w-[380px] z-40 bg-fd-background data-[state=open]:animate-fd-enterFromLeft data-[state=closed]:animate-fd-exitToLeft', !present && 'invisible', props.className), children: _jsx(Context.Provider, { value: context, children: props.children }) })) })] }));
49
+ }
50
+ return (_jsx("aside", { id: "nd-sidebar", ...props, "data-collapsed": collapsed, className: cn('sticky top-(--fd-sidebar-top) z-20 bg-fd-card text-sm h-(--fd-sidebar-height) max-md:hidden', collapsible && [
51
+ 'transition-all',
52
+ collapsed &&
53
+ '-me-(--fd-sidebar-width) -translate-x-(--fd-sidebar-offset) rtl:translate-x-(--fd-sidebar-offset)',
54
+ collapsed && hover && 'z-50 translate-x-0',
55
+ collapsed && !hover && 'opacity-0',
56
+ ], props.className), style: {
57
+ '--fd-sidebar-offset': 'calc(var(--fd-sidebar-width) - 6px)',
58
+ '--fd-sidebar-top': 'calc(var(--fd-banner-height) + var(--fd-nav-height))',
59
+ '--fd-sidebar-height': 'calc(100dvh - var(--fd-banner-height) - var(--fd-nav-height))',
60
+ ...props.style,
61
+ }, onPointerEnter: (e) => {
62
+ if (!collapsible ||
63
+ !collapsed ||
37
64
  e.pointerType === 'touch' ||
38
65
  closeTimeRef.current > Date.now())
39
66
  return;
40
67
  window.clearTimeout(timerRef.current);
41
68
  setHover(true);
42
69
  }, onPointerLeave: (e) => {
43
- if (!collapsed || e.pointerType === 'touch')
70
+ if (!collapsible || !collapsed || e.pointerType === 'touch')
44
71
  return;
45
72
  window.clearTimeout(timerRef.current);
46
73
  timerRef.current = window.setTimeout(() => {
@@ -49,31 +76,13 @@ export function CollapsibleSidebar(props) {
49
76
  }, Math.min(e.clientX, document.body.clientWidth - e.clientX) > 100
50
77
  ? 0
51
78
  : 500);
52
- }, "data-collapsed": collapsed, className: cn('md:transition-all', collapsed &&
53
- 'md:-me-(--fd-sidebar-width) md:-translate-x-(--fd-sidebar-offset) rtl:md:translate-x-(--fd-sidebar-offset)', collapsed && hover && 'z-50 md:translate-x-0', collapsed && !hover && 'md:opacity-0', props.className), style: {
54
- '--fd-sidebar-offset': 'calc(var(--fd-sidebar-width) - 6px)',
55
- ...props.style,
56
- } }));
57
- }
58
- export function Sidebar({ defaultOpenLevel = 0, prefetch = true, inner, ...props }) {
59
- const context = useMemo(() => {
60
- return {
61
- defaultOpenLevel,
62
- prefetch,
63
- level: 1,
64
- };
65
- }, [defaultOpenLevel, prefetch]);
66
- return (_jsx(Context.Provider, { value: context, children: _jsx(Base.SidebarList, { id: "nd-sidebar", removeScrollOn: "(width < 768px)" // md
67
- , ...props, className: cn('fixed top-[calc(var(--fd-banner-height)+var(--fd-nav-height))] z-20 bg-fd-card text-sm md:sticky md:h-(--fd-sidebar-height)', 'max-md:inset-x-0 max-md:bottom-0 max-md:bg-fd-background/80 max-md:text-[15px] max-md:backdrop-blur-lg max-md:data-[open=false]:invisible', props.className), style: {
68
- ...props.style,
69
- '--fd-sidebar-height': 'calc(100dvh - var(--fd-banner-height) - var(--fd-nav-height))',
70
- }, children: _jsx("div", { ...inner, className: cn('flex size-full max-w-full flex-col pt-2 md:ms-auto md:w-(--fd-sidebar-width) md:border-e md:pt-4', inner?.className), children: props.children }) }) }));
79
+ }, children: _jsx("div", { className: "flex w-(--fd-sidebar-width) h-full max-w-full flex-col ms-auto border-e", children: _jsx(Context.Provider, { value: context, children: props.children }) }) }));
71
80
  }
72
81
  export function SidebarHeader(props) {
73
- return (_jsx("div", { ...props, className: cn('flex flex-col gap-3 px-4 empty:hidden', props.className), children: props.children }));
82
+ return (_jsx("div", { ...props, className: cn('flex flex-col gap-3 px-4 pt-4 max-md:pt-6 empty:hidden', props.className), children: props.children }));
74
83
  }
75
84
  export function SidebarFooter(props) {
76
- return (_jsx("div", { ...props, className: cn('flex flex-col border-t px-4 py-3 empty:hidden', props.className), children: props.children }));
85
+ return (_jsx("div", { ...props, className: cn('flex flex-col border-t px-4 py-3 empty:hidden max-md:pb-6', props.className), children: props.children }));
77
86
  }
78
87
  export function SidebarViewport(props) {
79
88
  return (_jsx(ScrollArea, { ...props, className: cn('h-full', props.className), children: _jsx(ScrollViewport, { className: "p-4", style: {
@@ -82,7 +91,7 @@ export function SidebarViewport(props) {
82
91
  }
83
92
  export function SidebarSeparator(props) {
84
93
  const { level } = useInternalContext();
85
- return (_jsx("p", { ...props, className: cn('inline-flex items-center gap-2 mb-2 px-2 text-sm font-medium empty:mb-0 [&_svg]:size-4 [&_svg]:shrink-0', props.className), style: {
94
+ return (_jsx("p", { ...props, className: cn('inline-flex items-center gap-2 mb-2 px-2 font-medium empty:mb-0 [&_svg]:size-4 [&_svg]:shrink-0', props.className), style: {
86
95
  paddingInlineStart: getOffset(level),
87
96
  ...props.style,
88
97
  }, children: props.children }));
@@ -135,7 +144,7 @@ export function SidebarFolderContent(props) {
135
144
  return (_jsx(CollapsibleContent, { ...props, className: cn('relative', props.className), children: _jsxs(Context.Provider, { value: useMemo(() => ({
136
145
  ...ctx,
137
146
  level: ctx.level + 1,
138
- }), [ctx]), children: [_jsx("div", { className: "absolute w-px inset-y-0 bg-fd-border start-3" }), props.children] }) }));
147
+ }), [ctx]), children: [ctx.level === 1 && (_jsx("div", { className: "absolute w-px inset-y-0 bg-fd-border start-3" })), props.children] }) }));
139
148
  }
140
149
  export function SidebarCollapseTrigger(props) {
141
150
  const { collapsed, setCollapsed } = useSidebar();
@@ -189,10 +198,10 @@ function PageTreeFolder({ item, ...props }) {
189
198
  return (_jsxs(SidebarFolder, { defaultOpen: (item.defaultOpen ?? defaultOpenLevel >= level) || path.includes(item), children: [item.index ? (_jsxs(SidebarFolderLink, { href: item.index.url, external: item.index.external, ...props, children: [item.icon, item.name] })) : (_jsxs(SidebarFolderTrigger, { ...props, children: [item.icon, item.name] })), _jsx(SidebarFolderContent, { children: props.children })] }));
190
199
  }
191
200
  function getOffset(level) {
192
- return `calc(var(--spacing) * ${(level > 1 ? level : 0) * 2 + 2})`;
201
+ return `calc(var(--spacing) * ${level > 1 ? (level - 1) * 3 + 3 : 2})`;
193
202
  }
194
203
  function Border({ level, active }) {
195
204
  if (level <= 1)
196
205
  return null;
197
- return (_jsx("div", { className: cn('absolute w-px inset-y-2 z-[2] start-3', active && 'bg-fd-primary') }));
206
+ return (_jsx("div", { className: cn('absolute w-px inset-y-3 z-[2] start-3 md:inset-y-2', active && 'bg-fd-primary') }));
198
207
  }
@@ -1,7 +1,9 @@
1
1
  import type { TabsContentProps, TabsProps as BaseProps } from '@radix-ui/react-tabs';
2
+ import { type ReactNode } from 'react';
2
3
  import * as Primitive from './ui/tabs.js';
3
4
  export { Primitive };
4
5
  export interface TabsProps extends BaseProps {
6
+ label?: ReactNode;
5
7
  /**
6
8
  * Identifier for Sharing value of tabs
7
9
  */
@@ -20,7 +22,7 @@ export interface TabsProps extends BaseProps {
20
22
  */
21
23
  updateAnchor?: boolean;
22
24
  }
23
- export declare function Tabs({ groupId, items, persist, defaultIndex, updateAnchor, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
25
+ export declare function Tabs({ groupId, items, persist, label, defaultIndex, updateAnchor, ...props }: TabsProps): import("react/jsx-runtime").JSX.Element;
24
26
  export type TabProps = Omit<TabsContentProps, 'value'> & {
25
27
  /**
26
28
  * Value of tab, detect from index if unspecified.
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,IAAI,SAAS,EACvB,MAAM,sBAAsB,CAAC;AAW9B,OAAO,KAAK,SAAS,MAAM,WAAW,CAAC;AAGvC,OAAO,EAAE,SAAS,EAAE,CAAC;AAmBrB,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAQD,wBAAgB,IAAI,CAAC,EACnB,OAAO,EACP,KAAU,EACV,OAAe,EACf,YAAgB,EAChB,YAAoB,EACpB,GAAG,KAAK,EACT,EAAE,SAAS,2CAgFX;AAMD,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,GAAG;IACvD;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;CACnC,CAAC;AAEF,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,2CA6B3D"}
1
+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/components/tabs.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,gBAAgB,EAChB,SAAS,IAAI,SAAS,EACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAEL,KAAK,SAAS,EAOf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,SAAS,MAAM,WAAW,CAAC;AAGvC,OAAO,EAAE,SAAS,EAAE,CAAC;AAoBrB,MAAM,WAAW,SAAU,SAAQ,SAAS;IAC1C,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAcD,wBAAgB,IAAI,CAAC,EACnB,OAAO,EACP,KAAU,EACV,OAAe,EACf,KAAK,EACL,YAAgB,EAChB,YAAoB,EACpB,GAAG,KAAK,EACT,EAAE,SAAS,2CAiFX;AAMD,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,GAAG;IACvD;;OAEG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;CACnC,CAAC;AAEF,wBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,2CA6B3D"}
@@ -1,6 +1,6 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { useMemo, useState, createContext, useContext, useLayoutEffect, useId, useEffect, } from 'react';
3
+ import { createContext, useContext, useEffect, useId, useLayoutEffect, useMemo, useState, } from 'react';
4
4
  import { cn } from '../utils/cn.js';
5
5
  import * as Primitive from './ui/tabs.js';
6
6
  import { useEffectEvent } from 'fumadocs-core/utils/use-effect-event';
@@ -16,12 +16,17 @@ function removeChangeListener(id, listener) {
16
16
  listeners.set(id, list.filter((item) => item !== listener));
17
17
  }
18
18
  const TabsContext = createContext(null);
19
- export function Tabs({ groupId, items = [], persist = false, defaultIndex = 0, updateAnchor = false, ...props }) {
19
+ function useTabContext() {
20
+ const ctx = useContext(TabsContext);
21
+ if (!ctx)
22
+ throw new Error('You must wrap your component in <Tabs>');
23
+ return ctx;
24
+ }
25
+ export function Tabs({ groupId, items = [], persist = false, label, defaultIndex = 0, updateAnchor = false, ...props }) {
20
26
  const values = useMemo(() => items.map((item) => toValue(item)), [items]);
21
27
  const [value, setValue] = useState(values[defaultIndex]);
22
28
  const valueToIdMap = useMemo(() => new Map(), []);
23
- // eslint-disable-next-line react-hooks/exhaustive-deps -- re-reconstruct the collection if items changed
24
- const collection = useMemo(() => createCollection(), [items]);
29
+ const collection = useMemo(() => [], []);
25
30
  const onUpdate = useEffectEvent((v) => {
26
31
  if (values.includes(v))
27
32
  setValue(v);
@@ -69,26 +74,23 @@ export function Tabs({ groupId, items = [], persist = false, defaultIndex = 0, u
69
74
  else {
70
75
  setValue(v);
71
76
  }
72
- }, ...props, className: cn('my-4', props.className), children: [_jsx(Primitive.TabsList, { children: values.map((v, i) => (_jsx(Primitive.TabsTrigger, { value: v, children: items[i] }, v))) }), _jsx(TabsContext.Provider, { value: useMemo(() => ({ items, valueToIdMap, collection }), [valueToIdMap, collection, items]), children: props.children })] }));
77
+ }, ...props, className: cn('my-4', props.className), children: [_jsxs(Primitive.TabsList, { children: [label && (_jsx("span", { className: "text-sm font-medium my-auto me-auto", children: label })), values.map((v, i) => (_jsx(Primitive.TabsTrigger, { value: v, children: items[i] }, v)))] }), _jsx(TabsContext.Provider, { value: useMemo(() => ({ items, valueToIdMap, collection }), [valueToIdMap, collection, items]), children: props.children })] }));
73
78
  }
74
79
  function toValue(v) {
75
80
  return v.toLowerCase().replace(/\s/, '-');
76
81
  }
77
82
  export function Tab({ value, className, ...props }) {
78
- const ctx = useContext(TabsContext);
83
+ const { items, valueToIdMap } = useTabContext();
79
84
  const resolvedValue = value ??
80
85
  // eslint-disable-next-line react-hooks/rules-of-hooks -- `value` is not supposed to change
81
- ctx?.items.at(useCollectionIndex());
86
+ items.at(useCollectionIndex());
82
87
  if (!resolvedValue)
83
88
  throw new Error('Failed to resolve tab `value`, please pass a `value` prop to the Tab component.');
84
89
  const v = toValue(resolvedValue);
85
- if (props.id && ctx) {
86
- ctx.valueToIdMap.set(v, props.id);
90
+ if (props.id) {
91
+ valueToIdMap.set(v, props.id);
87
92
  }
88
- return (_jsx(Primitive.TabsContent, { value: v, className: cn('prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:rounded-none [&>figure:only-child]:border-none', className), ...props, children: props.children }));
89
- }
90
- function createCollection() {
91
- return [];
93
+ return (_jsx(Primitive.TabsContent, { value: v, className: cn('prose-no-margin [&>figure:only-child]:-m-4 [&>figure:only-child]:border-none', className), ...props, children: props.children }));
92
94
  }
93
95
  /**
94
96
  * Inspired by Headless UI.
@@ -98,28 +100,15 @@ function createCollection() {
98
100
  */
99
101
  function useCollectionIndex() {
100
102
  const key = useId();
101
- const ctx = useContext(TabsContext);
102
- if (!ctx)
103
- throw new Error('You must wrap your component in <Tabs>');
104
- const list = ctx.collection;
105
- function register() {
106
- if (!list.includes(key))
107
- list.push(key);
108
- }
109
- function unregister() {
110
- const idx = list.indexOf(key);
111
- if (idx !== -1)
112
- list.splice(idx, 1);
113
- }
114
- useMemo(() => {
115
- // re-order the item to the bottom if registered
116
- unregister();
117
- register();
118
- // eslint-disable-next-line -- register
119
- }, [list]);
103
+ const { collection } = useTabContext();
120
104
  useEffect(() => {
121
- return unregister;
122
- // eslint-disable-next-line -- clean up only
123
- }, []);
124
- return list.indexOf(key);
105
+ return () => {
106
+ const idx = collection.indexOf(key);
107
+ if (idx !== -1)
108
+ collection.splice(idx, 1);
109
+ };
110
+ }, [key, collection]);
111
+ if (!collection.includes(key))
112
+ collection.push(key);
113
+ return collection.indexOf(key);
125
114
  }
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/ui/tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,QAAA,MAAM,IAAI,mJAcR,CAAC;AAIH,QAAA,MAAM,QAAQ,uJAYZ,CAAC;AAGH,QAAA,MAAM,WAAW,gKAYf,CAAC;AAGH,QAAA,MAAM,WAAW,0JASf,CAAC;AAGH,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC"}
1
+ {"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../../src/components/ui/tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,QAAA,MAAM,IAAI,mJAcR,CAAC;AAIH,QAAA,MAAM,QAAQ,uJAYZ,CAAC;AAGH,QAAA,MAAM,WAAW,gKAYf,CAAC;AAGH,QAAA,MAAM,WAAW,0JAYf,CAAC;AAGH,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC"}
@@ -4,13 +4,13 @@ import * as TabsPrimitive from '@radix-ui/react-tabs';
4
4
  import * as React from 'react';
5
5
  import { cn } from '../../utils/cn.js';
6
6
  const Tabs = React.forwardRef((props, ref) => {
7
- return (_jsx(TabsPrimitive.Root, { ref: ref, ...props, className: cn('flex flex-col overflow-hidden rounded-xl border bg-fd-card', props.className) }));
7
+ return (_jsx(TabsPrimitive.Root, { ref: ref, ...props, className: cn('flex flex-col overflow-hidden rounded-xl border bg-fd-secondary', props.className) }));
8
8
  });
9
9
  Tabs.displayName = 'Tabs';
10
- const TabsList = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.List, { ref: ref, ...props, className: cn('flex flex-row items-end gap-4 overflow-x-auto bg-fd-secondary px-4 text-fd-muted-foreground', props.className) })));
10
+ const TabsList = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.List, { ref: ref, ...props, className: cn('flex gap-3.5 text-fd-secondary-foreground overflow-x-auto px-4', props.className) })));
11
11
  TabsList.displayName = 'TabsList';
12
- const TabsTrigger = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, ...props, className: cn('whitespace-nowrap border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary', props.className) })));
12
+ const TabsTrigger = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, ...props, className: cn('whitespace-nowrap text-fd-muted-foreground border-b border-transparent py-2 text-sm font-medium transition-colors hover:text-fd-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-fd-primary data-[state=active]:text-fd-primary', props.className) })));
13
13
  TabsTrigger.displayName = 'TabsTrigger';
14
- const TabsContent = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.Content, { ref: ref, ...props, className: cn('p-4', props.className) })));
14
+ const TabsContent = React.forwardRef((props, ref) => (_jsx(TabsPrimitive.Content, { ref: ref, ...props, className: cn('p-4 text-[15px] bg-fd-background rounded-xl outline-none', props.className) })));
15
15
  TabsContent.displayName = 'TabsContent';
16
16
  export { Tabs, TabsList, TabsTrigger, TabsContent };
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/contexts/sidebar.tsx"],"names":[],"mappings":"AACA,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAKf,UAAU,cAAc;IACtB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAE5D;;OAEG;IACH,eAAe,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CACrC;AAED,QAAA,MAAM,cAAc;;;;;;CAAkD,CAAC;AAEvE,wBAAgB,UAAU,IAAI,cAAc,CAE3C;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,SAAS,CAgCZ"}
1
+ {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/contexts/sidebar.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAIf,UAAU,cAAc;IACtB,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IACvD,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAE5D;;OAEG;IACH,eAAe,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CACrC;AAED,QAAA,MAAM,cAAc;;;;;;CAAkD,CAAC;AAEvE,wBAAgB,UAAU,IAAI,cAAc,CAE3C;AAED,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,SAAS,CA8BZ"}
@@ -1,8 +1,7 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
- import { useState, useMemo, useRef, } from 'react';
3
+ import { useMemo, useRef, useState, } from 'react';
4
4
  import { createContext, usePathname } from 'fumadocs-core/framework';
5
- import { SidebarProvider as BaseProvider } from 'fumadocs-core/sidebar';
6
5
  import { useOnChange } from 'fumadocs-core/utils/use-on-change';
7
6
  const SidebarContext = createContext('SidebarContext');
8
7
  export function useSidebar() {
@@ -25,5 +24,5 @@ export function SidebarProvider({ children, }) {
25
24
  collapsed,
26
25
  setCollapsed,
27
26
  closeOnRedirect,
28
- }), [open, collapsed]), children: _jsx(BaseProvider, { open: open, onOpenChange: setOpen, children: children }) }));
27
+ }), [open, collapsed]), children: children }));
29
28
  }
@@ -8,7 +8,6 @@ export declare const layoutVariables: {
8
8
  '--fd-layout-offset': string;
9
9
  };
10
10
  export interface SidebarOptions extends SidebarProps {
11
- collapsible?: boolean;
12
11
  components?: Partial<SidebarComponents>;
13
12
  /**
14
13
  * Root Toggle options
@@ -1 +1 @@
1
- {"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EACL,KAAK,iBAAiB,EAMtB,KAAK,YAAY,EAClB,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,eAAO,MAAM,eAAe;;CAE3B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,YAAY;IAClD,WAAW,CAAC,EAAE,OAAO,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;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAmCA;AAED,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,cAAc,CAAC,MAAM,CAAC,EAC/B,IAAI,EAAE,QAAQ,CAAC,IAAI,wBASpB"}
1
+ {"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AACpD,OAAO,EACL,KAAK,iBAAiB,EAMtB,KAAK,YAAY,EAClB,MAAM,6BAA6B,CAAC;AACrC,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAC9D,OAAO,EAEL,KAAK,qBAAqB,EAC3B,MAAM,0BAA0B,CAAC;AAElC,eAAO,MAAM,eAAe;;CAE3B,CAAC;AAEF,MAAM,WAAW,cAAe,SAAQ,YAAY;IAClD,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;CACpB;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAmCA;AAED,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,cAAc,CAAC,MAAM,CAAC,EAC/B,IAAI,EAAE,QAAQ,CAAC,IAAI,wBASpB"}
@@ -1 +1 @@
1
- {"version":3,"file":"docs-client.d.ts","sourceRoot":"","sources":["../../src/layouts/docs-client.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AASvE,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAiBxD;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAkB/C;AAED,wBAAgB,kBAAkB,wDAyBjC"}
1
+ {"version":3,"file":"docs-client.d.ts","sourceRoot":"","sources":["../../src/layouts/docs-client.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAQvE,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAiBxD;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAmB/C;AAED,wBAAgB,kBAAkB,wDAyBjC"}
@@ -1,33 +1,33 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { Menu, Sidebar as SidebarIcon, X } from '../icons.js';
3
+ import { Menu, Sidebar as SidebarIcon } from '../icons.js';
4
4
  import { cn } from '../utils/cn.js';
5
5
  import { buttonVariants } from '../components/ui/button.js';
6
6
  import { useSidebar } from '../contexts/sidebar.js';
7
7
  import { useNav } from '../contexts/layout.js';
8
- import { SidebarTrigger } from 'fumadocs-core/sidebar';
9
8
  import { SidebarCollapseTrigger } from '../components/layout/sidebar.js';
10
9
  import { SearchToggle } from '../components/layout/search-toggle.js';
11
10
  export function Navbar(props) {
12
11
  const { open } = useSidebar();
13
12
  const { isTransparent } = useNav();
14
- return (_jsx("header", { id: "nd-subnav", ...props, className: cn('sticky top-(--fd-banner-height) z-30 flex h-14 items-center px-4 border-b border-fd-foreground/10 transition-colors backdrop-blur-sm md:px-6', (!isTransparent || open) && 'bg-fd-background/80', props.className), children: props.children }));
13
+ return (_jsx("header", { id: "nd-subnav", ...props, className: cn('sticky top-(--fd-banner-height) z-30 flex h-14 items-center px-4 border-b transition-colors backdrop-blur-sm md:px-6', (!isTransparent || open) && 'bg-fd-background/80', props.className), children: props.children }));
15
14
  }
16
15
  export function NavbarSidebarTrigger(props) {
17
- const { open } = useSidebar();
18
- return (_jsx(SidebarTrigger, { ...props, className: cn(buttonVariants({
16
+ const { setOpen } = useSidebar();
17
+ return (_jsx("button", { ...props, className: cn(buttonVariants({
19
18
  color: 'ghost',
20
19
  size: 'icon',
21
- }), props.className), children: open ? _jsx(X, {}) : _jsx(Menu, {}) }));
20
+ }), props.className), onClick: () => setOpen((prev) => !prev), children: _jsx(Menu, {}) }));
22
21
  }
23
22
  export function CollapsibleControl() {
24
23
  const { collapsed } = useSidebar();
25
24
  if (!collapsed)
26
25
  return;
27
- return (_jsxs("div", { className: "fixed flex flex-row animate-fd-fade-in rounded-xl p-0.5 border bg-fd-muted text-fd-muted-foreground z-10 xl:start-4 max-xl:end-4", style: {
26
+ return (_jsxs("div", { className: "fixed flex shadow-lg animate-fd-fade-in rounded-xl p-0.5 border bg-fd-muted text-fd-muted-foreground z-10 xl:start-4 max-xl:end-4", style: {
28
27
  top: 'calc(var(--fd-banner-height) + var(--fd-tocnav-height) + var(--spacing) * 4)',
29
28
  }, children: [_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
30
29
  color: 'ghost',
31
30
  size: 'icon-sm',
32
- }), 'rounded-lg'), children: _jsx(SidebarIcon, {}) }), _jsx(SearchToggle, { size: "icon-sm", className: "rounded-lg", hideIfDisabled: true })] }));
31
+ className: 'rounded-lg',
32
+ })), children: _jsx(SidebarIcon, {}) }), _jsx(SearchToggle, { size: "icon-sm", className: "rounded-lg", hideIfDisabled: true })] }));
33
33
  }
@@ -1 +1 @@
1
- {"version":3,"file":"docs.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAcrE,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAK1D,OAAO,EACL,kBAAkB,EAClB,MAAM,EACN,oBAAoB,EACrB,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAY/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,GAAG;QAClC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAY,EACZ,YAAY,EACZ,kBAA0B,EAC1B,WAA8C,EAC9C,IAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAkG7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,WAAkB,EAClB,UAAU,EACV,GAAG,EACH,KAAU,EACV,MAAM,EACN,MAAM,EACN,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChC,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,GAAG,CAAC,EAAE,SAAS,CAAC;CACjB,2CA2CA;AAED,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,WAAW,EACX,KAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,eAAe,CAAC,aAAa,CAAC,CAAC;CAC9C,kDAiCA;AAED,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,YAAY,EAAE,CAAC;AAC/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC"}
1
+ {"version":3,"file":"docs.d.ts","sourceRoot":"","sources":["../../src/layouts/docs.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAW,MAAM,OAAO,CAAC;AAarE,OAAO,EAEL,KAAK,YAAY,EACjB,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,KAAK,eAAe,EAAY,MAAM,UAAU,CAAC;AAK1D,OAAO,EACL,kBAAkB,EAClB,MAAM,EACN,oBAAoB,EACrB,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAY/B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC;IAEpB,OAAO,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,GAAG;QAClC,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,SAAS,CAAC,EAAE,SAAS,CAAC;KACvB,CAAC;IAEF;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,EACzB,GAAG,EAAE,EAAE,eAAe,EAAE,GAAG,GAAG,EAAO,EACrC,OAAY,EACZ,YAAY,EACZ,kBAA0B,EAC1B,WAA8C,EAC9C,IAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,GAAG,SAAS,CAkG7B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,WAAkB,EAClB,UAAU,EACV,GAAG,EACH,KAAU,EACV,MAAM,EACN,MAAM,EACN,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAChC,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,GAAG,CAAC,EAAE,SAAS,CAAC;CACjB,2CA0CA;AAED,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,WAAW,EACX,KAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,WAAW,CAAC,EAAE,eAAe,CAAC,aAAa,CAAC,CAAC;CAC9C,kDAiCA;AAED,OAAO,EAAE,kBAAkB,EAAE,MAAM,EAAE,oBAAoB,EAAE,KAAK,YAAY,EAAE,CAAC;AAC/E,OAAO,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC"}
@@ -3,7 +3,7 @@ import { useMemo } from 'react';
3
3
  import { Languages, Sidebar as SidebarIcon } from '../icons.js';
4
4
  import { cn } from '../utils/cn.js';
5
5
  import { buttonVariants } from '../components/ui/button.js';
6
- import { CollapsibleSidebar, Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
6
+ import { Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
7
7
  import { omit, slot, slots } from '../layouts/shared.js';
8
8
  import { BaseLinkItem, } from '../layouts/links.js';
9
9
  import { RootToggle } from '../components/layout/root-toggle.js';
@@ -32,8 +32,7 @@ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar = {}
32
32
  }, children: [slot(sidebar, _jsx(DocsLayoutSidebar, { ...omit(sidebar, 'enabled', 'component', 'tabs'), links: links, nav: _jsxs(_Fragment, { children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex text-[15px] items-center gap-2.5 font-medium", children: nav.title }), nav.children] }), banner: _jsxs(_Fragment, { children: [tabs.length > 0 ? _jsx(RootToggle, { options: tabs }) : null, slots('lg', searchToggle, _jsx(LargeSearchToggle, { hideIfDisabled: true, className: "rounded-lg max-md:hidden" })), sidebar.banner] }), footer: _jsxs(_Fragment, { children: [_jsx(DocsLayoutSidebarFooter, { links: links.filter((item) => item.type === 'icon'), i18n: i18n, themeSwitch: themeSwitch }), sidebar.footer] }) })), _jsx(StylesProvider, { ...pageStyles, children: children })] })] }) }));
33
33
  }
34
34
  export function DocsLayoutSidebar({ collapsible = true, components, nav, links = [], footer, banner, ...props }) {
35
- const Aside = collapsible ? CollapsibleSidebar : Sidebar;
36
- return (_jsxs(_Fragment, { children: [collapsible ? _jsx(CollapsibleControl, {}) : null, _jsxs(Aside, { ...props, className: cn('md:ps-(--fd-layout-offset)', props.className), children: [_jsxs(SidebarHeader, { children: [_jsxs("div", { className: "flex flex-row py-1.5 max-md:hidden", children: [nav, collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
35
+ return (_jsxs(_Fragment, { children: [collapsible ? _jsx(CollapsibleControl, {}) : null, _jsxs(Sidebar, { ...props, collapsible: collapsible, className: cn('md:ps-(--fd-layout-offset)', props.className), children: [_jsxs(SidebarHeader, { children: [_jsxs("div", { className: "flex flex-row py-1.5 max-md:hidden", children: [nav, collapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
37
36
  color: 'ghost',
38
37
  size: 'icon-sm',
39
38
  }), 'ms-auto mb-auto -my-1.5 text-fd-muted-foreground max-md:hidden'), children: _jsx(SidebarIcon, {}) }))] }), banner] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "mb-4 empty:hidden", children: links
@@ -41,5 +41,5 @@ export function MenuTrigger({ enableHover = false, ...props }) {
41
41
  }), props.className), children: props.children }));
42
42
  }
43
43
  export function MenuContent(props) {
44
- return (_jsx(NavigationMenuContent, { ...props, className: cn('flex flex-col p-4', props.className), children: props.children }));
44
+ return (_jsx(NavigationMenuContent, { ...props, className: cn('flex flex-col px-4 pb-4', props.className), children: props.children }));
45
45
  }
@@ -12,7 +12,7 @@ const navItemVariants = cva('inline-flex items-center gap-1 p-2 text-fd-muted-fo
12
12
  export function Navbar(props) {
13
13
  const [value, setValue] = useState('');
14
14
  const { isTransparent } = useNav();
15
- return (_jsx(NavigationMenu, { value: value, onValueChange: setValue, asChild: true, children: _jsxs("header", { id: "nd-nav", ...props, className: cn('fixed left-(--fd-nav-left) top-(--fd-banner-height) z-40 box-content w-full max-w-fd-container -translate-x-1/2 border-b border-fd-foreground/10 transition-colors lg:mt-2 lg:w-[calc(100%-1rem)] lg:rounded-2xl lg:border', value.length > 0 ? 'shadow-lg' : 'shadow-sm', (!isTransparent || value.length > 0) &&
15
+ return (_jsx(NavigationMenu, { value: value, onValueChange: setValue, asChild: true, children: _jsxs("header", { id: "nd-nav", ...props, className: cn('fixed left-(--fd-nav-left) top-(--fd-banner-height) z-40 box-content w-full max-w-fd-container -translate-x-1/2 border-b transition-colors lg:mt-2 lg:w-[calc(100%-1rem)] lg:rounded-2xl lg:border', value.length > 0 ? 'shadow-lg' : 'shadow-sm', (!isTransparent || value.length > 0) &&
16
16
  'bg-fd-background/80 backdrop-blur-lg', props.className), style: {
17
17
  '--fd-nav-left': 'calc(50% - var(--removed-body-scroll-bar-size,0px) / 2)',
18
18
  ...props.style,
@@ -1 +1 @@
1
- {"version":3,"file":"notebook-client.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook-client.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AASvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAE9D,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAAE,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE,2CAoBxD;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAkB/C;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAY5D;AAUD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,2CAkBrC;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG,cAAc,CAAC,WAAW,CAAC,2CAoBhD"}
1
+ {"version":3,"file":"notebook-client.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook-client.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,oBAAoB,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAQvE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAE9D,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAAE,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE,2CAoBxD;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAmB/C;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAY5D;AAUD,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,2CAkBrC;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG,cAAc,CAAC,WAAW,CAAC,2CAoBhD"}
@@ -3,9 +3,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { cn } from '../utils/cn.js';
4
4
  import { useSidebar } from '../contexts/sidebar.js';
5
5
  import { useNav } from '../contexts/layout.js';
6
- import { SidebarTrigger } from 'fumadocs-core/sidebar';
7
6
  import { buttonVariants } from '../components/ui/button.js';
8
- import { Menu, X } from '../icons.js';
7
+ import { Menu } from '../icons.js';
9
8
  import Link from 'fumadocs-core/link';
10
9
  import { usePathname } from 'fumadocs-core/framework';
11
10
  import { isActive } from '../utils/is-active.js';
@@ -17,11 +16,11 @@ export function Navbar({ mode, ...props }) {
17
16
  'ps-[calc(var(--fd-layout-offset)+var(--fd-sidebar-width))]', props.className), children: props.children }));
18
17
  }
19
18
  export function NavbarSidebarTrigger(props) {
20
- const { open } = useSidebar();
21
- return (_jsx(SidebarTrigger, { ...props, className: cn(buttonVariants({
19
+ const { setOpen } = useSidebar();
20
+ return (_jsx("button", { ...props, className: cn(buttonVariants({
22
21
  color: 'ghost',
23
22
  size: 'icon',
24
- }), props.className), children: open ? _jsx(X, {}) : _jsx(Menu, {}) }));
23
+ }), props.className), onClick: () => setOpen((prev) => !prev), children: _jsx(Menu, {}) }));
25
24
  }
26
25
  export function LayoutTabs(props) {
27
26
  return (_jsx("div", { ...props, className: cn('flex flex-row items-end gap-6 overflow-auto', props.className), children: props.children }));
@@ -1 +1 @@
1
- {"version":3,"file":"notebook.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,cAAc,EAAW,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,kBAAkB,CAAC;AAsB/E,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAGL,MAAM,EACN,oBAAoB,EAErB,MAAM,mBAAmB,CAAC;AAa3B,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,OAAO,CAAC,cAAc,CAAC,CAAC;IAElC,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAkJhD;AAoLD,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,CAAC"}
1
+ {"version":3,"file":"notebook.d.ts","sourceRoot":"","sources":["../../src/layouts/notebook.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,cAAc,EAAW,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,kBAAkB,CAAC;AAqB/E,OAAO,EAIL,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAGL,MAAM,EACN,oBAAoB,EAErB,MAAM,mBAAmB,CAAC;AAa3B,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,OAAO,CAAC,cAAc,CAAC,CAAC;IAElC,cAAc,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAC;CACjD;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CA8IhD;AAoLD,OAAO,EAAE,MAAM,EAAE,oBAAoB,EAAE,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { Fragment, useMemo } from 'react';
3
3
  import { getLinks, slot, slots } from '../layouts/shared.js';
4
- import { CollapsibleSidebar, Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
4
+ import { Sidebar, SidebarCollapseTrigger, SidebarFooter, SidebarHeader, SidebarPageTree, SidebarViewport, } from '../components/layout/sidebar.js';
5
5
  import { TreeContextProvider } from '../contexts/tree.js';
6
6
  import { cn } from '../utils/cn.js';
7
7
  import { buttonVariants } from '../components/ui/button.js';
@@ -17,11 +17,10 @@ import { RootToggle } from '../components/layout/root-toggle.js';
17
17
  import Link from 'fumadocs-core/link';
18
18
  import { LargeSearchToggle, SearchToggle, } from '../components/layout/search-toggle.js';
19
19
  export function DocsLayout(props) {
20
- const { tabMode = 'sidebar', nav: { transparentMode, ...nav } = {}, sidebar: { collapsible: sidebarCollapsible = true, tabs: tabOptions, banner: sidebarBanner, footer: sidebarFooter, components: sidebarComponents, ...sidebar } = {}, i18n = false, disableThemeSwitch = false, themeSwitch = { enabled: !disableThemeSwitch }, } = props;
20
+ const { tabMode = 'sidebar', nav: { transparentMode, ...nav } = {}, sidebar: { tabs: tabOptions, banner: sidebarBanner, footer: sidebarFooter, components: sidebarComponents, ...sidebar } = {}, i18n = false, disableThemeSwitch = false, themeSwitch = { enabled: !disableThemeSwitch }, } = props;
21
21
  const navMode = nav.mode ?? 'auto';
22
22
  const links = getLinks(props.links ?? [], props.githubUrl);
23
23
  const tabs = useMemo(() => getSidebarTabsFromOptions(tabOptions, props.tree) ?? [], [tabOptions, props.tree]);
24
- const Aside = sidebarCollapsible ? CollapsibleSidebar : Sidebar;
25
24
  const variables = cn('[--fd-nav-height:calc(var(--spacing)*14)] [--fd-tocnav-height:36px] md:[--fd-sidebar-width:286px] xl:[--fd-toc-width:286px] xl:[--fd-tocnav-height:0px]', tabs.length > 0 &&
26
25
  tabMode === 'navbar' &&
27
26
  'lg:[--fd-nav-height:calc(var(--spacing)*24)]');
@@ -33,19 +32,20 @@ export function DocsLayout(props) {
33
32
  return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsx(NavProvider, { transparentMode: transparentMode, children: _jsxs("main", { id: "nd-docs-layout", ...props.containerProps, className: cn('flex w-full flex-1 flex-row pe-(--fd-layout-offset)', variables, props.containerProps?.className), style: {
34
33
  ...layoutVariables,
35
34
  ...props.containerProps?.style,
36
- }, children: [_jsxs(Aside, { ...sidebar, className: cn('md:ps-(--fd-layout-offset)', navMode === 'top' ? 'bg-transparent' : 'md:[--fd-nav-height:0px]', sidebar.className), inner: {
37
- className: cn(navMode === 'top' ? 'md:pt-2.5' : 'md:pt-3.5'),
38
- }, children: [_jsxs(SidebarHeader, { children: [navMode === 'auto' && (_jsxs("div", { className: "flex flex-row justify-between max-md:hidden", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-medium", children: nav.title }), sidebarCollapsible && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
35
+ }, children: [_jsxs(Sidebar, { ...sidebar, className: cn('md:ps-(--fd-layout-offset)', navMode === 'top'
36
+ ? 'md:bg-transparent'
37
+ : 'md:[--fd-nav-height:0px]', sidebar.className), children: [_jsxs(SidebarHeader, { children: [navMode === 'auto' && (_jsxs("div", { className: "flex flex-row justify-between max-md:hidden", children: [_jsx(Link, { href: nav.url ?? '/', className: "inline-flex items-center gap-2.5 font-medium", children: nav.title }), (sidebar.collapsible ?? true) && (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
39
38
  color: 'ghost',
40
39
  size: 'icon-sm',
41
- }), 'text-fd-muted-foreground mb-auto'), children: _jsx(SidebarIcon, {}) }))] })), nav.children, sidebarBanner, tabMode === 'sidebar' && tabs.length > 0 ? (_jsx(RootToggle, { options: tabs })) : null] }), _jsxs(SidebarViewport, { children: [tabMode === 'navbar' &&
40
+ className: 'text-fd-muted-foreground mb-auto',
41
+ })), children: _jsx(SidebarIcon, {}) }))] })), nav.children, sidebarBanner, tabMode === 'sidebar' && tabs.length > 0 ? (_jsx(RootToggle, { className: "mb-2", options: tabs })) : null] }), _jsxs(SidebarViewport, { children: [tabMode === 'navbar' &&
42
42
  tabs.map((tab, i) => (_jsx(SidebarLayoutTab, { item: tab, className: cn('lg:hidden', i === tabs.length - 1 && 'mb-4') }, tab.url))), links.map((item, i) => (_jsx(SidebarLinkItem, { item: item, className: cn('lg:hidden', i === links.length - 1 && 'mb-4') }, i))), _jsx(SidebarPageTree, { components: sidebarComponents })] }), _jsxs(SidebarFooter, { className: cn('flex flex-row items-center', !sidebarFooter && 'md:hidden'), children: [i18n ? (_jsx(LanguageToggle, { className: "me-auto md:hidden", children: _jsx(Languages, { className: "size-5 text-fd-muted-foreground" }) })) : null, slot(themeSwitch, _jsx(ThemeToggle, { className: "md:hidden", mode: themeSwitch?.mode ?? 'light-dark-system' })), sidebarFooter] })] }), _jsx(DocsNavbar, { ...props, links: links, tabs: tabMode == 'navbar' ? tabs : [] }), _jsx(StylesProvider, { ...pageStyles, children: props.children })] }) }) }));
43
43
  }
44
44
  function DocsNavbar({ links, tabs, ...props }) {
45
45
  const navMode = props.nav?.mode ?? 'auto';
46
46
  const sidebarCollapsible = props.sidebar?.collapsible ?? true;
47
47
  const nav = (_jsx(Link, { href: props.nav?.url ?? '/', className: cn('inline-flex items-center gap-2.5 font-semibold empty:hidden', navMode === 'auto' && 'md:hidden'), children: props.nav?.title }));
48
- return (_jsxs(Navbar, { mode: navMode, children: [_jsxs("div", { className: cn('flex flex-row border-b border-fd-foreground/10 px-4 h-14', navMode === 'auto' && 'md:px-6'), children: [_jsxs("div", { className: cn('flex flex-row items-center', navMode === 'top' && 'flex-1 pe-4'), children: [sidebarCollapsible && navMode === 'auto' ? (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
48
+ return (_jsxs(Navbar, { mode: navMode, children: [_jsxs("div", { className: cn('flex flex-row border-b px-4 h-14', navMode === 'auto' && 'md:px-6'), children: [_jsxs("div", { className: cn('flex flex-row items-center', navMode === 'top' && 'flex-1 pe-4'), children: [sidebarCollapsible && navMode === 'auto' ? (_jsx(SidebarCollapseTrigger, { className: cn(buttonVariants({
49
49
  color: 'ghost',
50
50
  size: 'icon-sm',
51
51
  }), 'text-fd-muted-foreground -ms-1.5 me-2 data-[collapsed=false]:hidden max-md:hidden'), children: _jsx(SidebarIcon, {}) })) : null, nav] }), slots('lg', props.searchToggle, _jsx(LargeSearchToggle, { hideIfDisabled: true, className: cn('w-full my-auto rounded-xl max-md:hidden', navMode === 'top' ? 'max-w-sm px-2' : 'max-w-[240px]') })), _jsxs("div", { className: "flex flex-1 flex-row items-center justify-end", children: [_jsx("div", { className: "flex flex-row items-center gap-6 px-4 empty:hidden max-lg:hidden", children: links
@@ -1 +1 @@
1
- {"version":3,"file":"page-client.d.ts","sourceRoot":"","sources":["../src/page-client.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EAKpB,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAElE,OAAO,EACL,KAAK,iBAAiB,EAEvB,MAAM,0BAA0B,CAAC;AAgBlC,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAE,KAAK,EAAE,WAAW,EAAE,CAAA;CAAE,2CAoDrD;AA4DD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAU7D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CA0D/D;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAY7D;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAe7D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,2CAc/C;AAED,KAAK,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,aAAa,GAAG,KAAK,CAAC,CAAC;AAChE,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE;QACN,QAAQ,CAAC,EAAE,IAAI,CAAC;QAChB,IAAI,CAAC,EAAE,IAAI,CAAC;KACb,CAAC;CACH;AAyBD,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,EAAE,WAAW,2CA+B5C;AA8BD,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC;AAEhD,wBAAgB,UAAU,CAAC,OAAO,EAAE,eAAe,kDAsClD"}
1
+ {"version":3,"file":"page-client.d.ts","sourceRoot":"","sources":["../src/page-client.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EAKpB,MAAM,OAAO,CAAC;AAMf,OAAO,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAElE,OAAO,EACL,KAAK,iBAAiB,EAEvB,MAAM,0BAA0B,CAAC;AAgBlC,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG;IAAE,KAAK,EAAE,WAAW,EAAE,CAAA;CAAE,2CAgDrD;AA4DD,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAU7D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAwD/D;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAY7D;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAe7D;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,2CAc/C;AAED,KAAK,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,aAAa,GAAG,KAAK,CAAC,CAAC;AAChE,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,KAAK,CAAC,EAAE;QACN,QAAQ,CAAC,EAAE,IAAI,CAAC;QAChB,IAAI,CAAC,EAAE,IAAI,CAAC;KACb,CAAC;CACH;AAyBD,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,EAAE,WAAW,2CA+B5C;AA8BD,MAAM,MAAM,eAAe,GAAG,iBAAiB,CAAC;AAEhD,wBAAgB,UAAU,CAAC,OAAO,EAAE,eAAe,kDAsClD"}
@@ -6,7 +6,6 @@ import Link from 'fumadocs-core/link';
6
6
  import { cn } from './utils/cn.js';
7
7
  import { useI18n } from './contexts/i18n.js';
8
8
  import { useTreeContext, useTreePath } from './contexts/tree.js';
9
- import { useSidebar } from './contexts/sidebar.js';
10
9
  import { createContext, usePathname } from 'fumadocs-core/framework';
11
10
  import { getBreadcrumbItemsFromPath, } from 'fumadocs-core/breadcrumb';
12
11
  import { useNav, usePageStyles } from './contexts/layout.js';
@@ -21,8 +20,8 @@ export function TocPopoverTrigger({ items, ...props }) {
21
20
  const active = Primitive.useActiveAnchor();
22
21
  const selected = useMemo(() => items.findIndex((item) => active === item.url.slice(1)), [items, active]);
23
22
  const path = useTreePath().at(-1);
24
- const showCurrent = selected !== -1 && !open;
25
- return (_jsxs(CollapsibleTrigger, { ...props, className: cn('flex flex-row items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:shrink-0 [&_svg]:size-4 md:px-6', props.className), children: [_jsx(ProgressCircle, { value: (selected + 1) / items.length, max: 1, className: cn(open && 'text-fd-primary') }), _jsxs("span", { className: cn('grid flex-1 *:row-start-1 *:col-start-1', open && 'text-fd-foreground'), children: [_jsx("span", { className: cn('truncate transition-all', showCurrent && 'opacity-0 -translate-y-full pointer-events-none'), children: path?.name ?? text.toc }), _jsx("span", { className: cn('truncate transition-all', !showCurrent && 'opacity-0 translate-y-full pointer-events-none'), children: items[selected]?.title })] }), _jsx(ChevronDown, { className: cn('transition-transform', open && 'rotate-180') })] }));
23
+ const showItem = selected !== -1 && !open;
24
+ return (_jsxs(CollapsibleTrigger, { ...props, className: cn('flex flex-row items-center text-sm text-fd-muted-foreground gap-2.5 px-4 py-2.5 text-start focus-visible:outline-none [&_svg]:shrink-0 [&_svg]:size-4 md:px-6', props.className), children: [_jsx(ProgressCircle, { value: (selected + 1) / items.length, max: 1, className: cn(open && 'text-fd-primary') }), _jsxs("span", { className: "grid flex-1 *:row-start-1 *:col-start-1", children: [_jsx("span", { className: cn('truncate transition-all', open && 'text-fd-foreground', showItem && 'opacity-0 -translate-y-full pointer-events-none'), children: path?.name ?? text.toc }), _jsx("span", { className: cn('truncate transition-all', !showItem && 'opacity-0 translate-y-full pointer-events-none'), children: items[selected]?.title })] }), _jsx(ChevronDown, { className: cn('transition-transform', open && 'rotate-180') })] }));
26
25
  }
27
26
  function clamp(input, min, max) {
28
27
  if (input < min)
@@ -51,7 +50,6 @@ export function TocPopoverContent(props) {
51
50
  export function TocPopover(props) {
52
51
  const ref = useRef(null);
53
52
  const [open, setOpen] = useState(false);
54
- const sidebar = useSidebar();
55
53
  const { tocNav } = usePageStyles();
56
54
  const { isTransparent } = useNav();
57
55
  const onClick = useEffectEvent((e) => {
@@ -72,7 +70,7 @@ export function TocPopover(props) {
72
70
  }, children: _jsx(TocPopoverContext.Provider, { value: useMemo(() => ({
73
71
  open,
74
72
  setOpen,
75
- }), [setOpen, open]), children: _jsx(Collapsible, { open: open, onOpenChange: setOpen, asChild: true, children: _jsx("header", { ref: ref, id: "nd-tocnav", ...props, className: cn('border-b border-fd-foreground/10 backdrop-blur-sm transition-colors', (!isTransparent || open) && 'bg-fd-background/80', open && 'shadow-lg', sidebar.open && 'max-md:hidden'), children: props.children }) }) }) }));
73
+ }), [setOpen, open]), children: _jsx(Collapsible, { open: open, onOpenChange: setOpen, asChild: true, children: _jsx("header", { ref: ref, id: "nd-tocnav", ...props, className: cn('border-b backdrop-blur-sm transition-colors', (!isTransparent || open) && 'bg-fd-background/80', open && 'shadow-lg'), children: props.children }) }) }) }));
76
74
  }
77
75
  export function PageBody(props) {
78
76
  const { page } = usePageStyles();
package/dist/page.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import type { TableOfContents } from 'fumadocs-core/server';
2
- import { type AnchorHTMLAttributes, type ComponentProps, type HTMLAttributes, type ReactNode } from 'react';
2
+ import { type ComponentProps, type HTMLAttributes, type ReactNode } from 'react';
3
3
  import { type AnchorProviderProps } from 'fumadocs-core/toc';
4
4
  import { type BreadcrumbProps, type FooterProps } from './page-client.js';
5
5
  import { type TOCProps } from './components/layout/toc.js';
@@ -12,7 +12,7 @@ type TableOfContentOptions = Omit<TOCProps, 'items' | 'children'> & Pick<AnchorP
12
12
  style?: 'normal' | 'clerk';
13
13
  };
14
14
  type TableOfContentPopoverOptions = Omit<TableOfContentOptions, 'single'>;
15
- interface EditOnGitHubOptions extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href' | 'children'> {
15
+ interface EditOnGitHubOptions extends Omit<ComponentProps<'a'>, 'href' | 'children'> {
16
16
  owner: string;
17
17
  repo: string;
18
18
  /**