fumadocs-ui 15.2.15 → 15.3.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.
- package/css/black.css +2 -2
- package/css/neutral.css +2 -2
- package/css/ocean.css +3 -3
- package/css/preset.css +190 -1
- package/css/purple.css +10 -10
- package/dist/components/accordion.js +1 -1
- package/dist/components/codeblock.d.ts.map +1 -1
- package/dist/components/codeblock.js +5 -5
- package/dist/components/layout/root-toggle.d.ts +3 -3
- package/dist/components/layout/root-toggle.d.ts.map +1 -1
- package/dist/components/layout/root-toggle.js +1 -1
- package/dist/components/layout/sidebar.d.ts +14 -11
- package/dist/components/layout/sidebar.d.ts.map +1 -1
- package/dist/components/layout/sidebar.js +42 -33
- package/dist/components/tabs.d.ts +3 -1
- package/dist/components/tabs.d.ts.map +1 -1
- package/dist/components/tabs.js +25 -36
- package/dist/components/ui/tabs.d.ts.map +1 -1
- package/dist/components/ui/tabs.js +4 -4
- package/dist/contexts/sidebar.d.ts.map +1 -1
- package/dist/contexts/sidebar.js +2 -3
- package/dist/layouts/docs/shared.d.ts +0 -1
- package/dist/layouts/docs/shared.d.ts.map +1 -1
- package/dist/layouts/docs-client.d.ts.map +1 -1
- package/dist/layouts/docs-client.js +8 -8
- package/dist/layouts/docs.d.ts.map +1 -1
- package/dist/layouts/docs.js +2 -3
- package/dist/layouts/home/navbar.js +1 -1
- package/dist/layouts/notebook-client.d.ts.map +1 -1
- package/dist/layouts/notebook-client.js +4 -5
- package/dist/layouts/notebook.d.ts.map +1 -1
- package/dist/layouts/notebook.js +8 -8
- package/dist/page-client.d.ts.map +1 -1
- package/dist/page-client.js +3 -5
- package/dist/page.d.ts +2 -2
- package/dist/page.d.ts.map +1 -1
- package/dist/style.css +103 -111
- package/package.json +15 -13
- package/css/animations.css +0 -199
package/dist/components/tabs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
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
|
-
|
|
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
|
-
|
|
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: [
|
|
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
|
|
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
|
-
|
|
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
|
|
86
|
-
|
|
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]:
|
|
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
|
|
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
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
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,
|
|
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-
|
|
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
|
|
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,
|
|
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"}
|
package/dist/contexts/sidebar.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
-
import {
|
|
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:
|
|
27
|
+
}), [open, collapsed]), children: children }));
|
|
29
28
|
}
|
|
@@ -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,
|
|
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;
|
|
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
|
|
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
|
|
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 {
|
|
18
|
-
return (_jsx(
|
|
16
|
+
const { setOpen } = useSidebar();
|
|
17
|
+
return (_jsx("button", { ...props, className: cn(buttonVariants({
|
|
19
18
|
color: 'ghost',
|
|
20
19
|
size: 'icon',
|
|
21
|
-
}), props.className),
|
|
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
|
|
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
|
-
|
|
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;
|
|
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"}
|
package/dist/layouts/docs.js
CHANGED
|
@@ -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 {
|
|
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
|
-
|
|
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
|
|
@@ -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
|
|
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;
|
|
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
|
|
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 {
|
|
21
|
-
return (_jsx(
|
|
19
|
+
const { setOpen } = useSidebar();
|
|
20
|
+
return (_jsx("button", { ...props, className: cn(buttonVariants({
|
|
22
21
|
color: 'ghost',
|
|
23
22
|
size: 'icon',
|
|
24
|
-
}), props.className),
|
|
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;
|
|
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"}
|
package/dist/layouts/notebook.js
CHANGED
|
@@ -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 {
|
|
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: {
|
|
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(
|
|
37
|
-
|
|
38
|
-
|
|
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
|
-
|
|
40
|
+
className: 'text-fd-muted-foreground mb-auto',
|
|
41
|
+
})), children: _jsx(SidebarIcon, {}) }))] })), nav.children, sidebarBanner, tabMode === 'sidebar' && tabs.length > 0 ? (_jsx(RootToggle, { 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
|
|
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;
|
|
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"}
|
package/dist/page-client.js
CHANGED
|
@@ -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
|
|
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:
|
|
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('opacity-50 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
|
|
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
|
|
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<
|
|
15
|
+
interface EditOnGitHubOptions extends Omit<ComponentProps<'a'>, 'href' | 'children'> {
|
|
16
16
|
owner: string;
|
|
17
17
|
repo: string;
|
|
18
18
|
/**
|
package/dist/page.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EACL,KAAK,
|
|
1
|
+
{"version":3,"file":"page.d.ts","sourceRoot":"","sources":["../src/page.tsx"],"names":[],"mappings":"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"}
|