fumadocs-ui 16.0.7 → 16.0.8
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/dist/components/codeblock.d.ts.map +1 -1
- package/dist/components/codeblock.js +8 -8
- package/dist/components/github-info.d.ts +2 -1
- package/dist/components/github-info.d.ts.map +1 -1
- package/dist/components/github-info.js +4 -4
- package/dist/components/type-table.js +1 -1
- package/dist/layouts/home/client.d.ts +24 -0
- package/dist/layouts/home/client.d.ts.map +1 -0
- package/dist/layouts/home/client.js +74 -0
- package/dist/layouts/home/index.d.ts.map +1 -1
- package/dist/layouts/home/index.js +10 -22
- package/dist/layouts/home/navbar.d.ts +0 -9
- package/dist/layouts/home/navbar.d.ts.map +1 -1
- package/dist/layouts/home/navbar.js +3 -34
- package/dist/style.css +22 -9
- package/package.json +8 -7
- package/dist/layouts/home/menu.d.ts +0 -16
- package/dist/layouts/home/menu.d.ts.map +0 -1
- package/dist/layouts/home/menu.js +0 -42
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAGpC,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC9D;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAE5C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,KAAK,SAAS,CAAC;CAC9E;AAOD,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAS/C;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,KAAK,EACL,SAAgB,EAChB,cAAsB,EACtB,IAAI,EACJ,aAAkB,EAClB,QAAQ,EACR,OAEC,EACD,GAAG,KAAK,EACT,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"codeblock.d.ts","sourceRoot":"","sources":["../../src/components/codeblock.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,WAAW,EACZ,MAAM,4BAA4B,CAAC;AAGpC,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,QAAQ,CAAC;IAC9D;;;;OAIG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,aAAa,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IAE5C;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IAEnC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,KAAK,SAAS,CAAC;CAC9E;AAOD,wBAAgB,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CAS/C;AAED,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,KAAK,EACL,SAAgB,EAChB,cAAsB,EACtB,IAAI,EACJ,aAAkB,EAClB,QAAQ,EACR,OAEC,EACD,GAAG,KAAK,EACT,EAAE,cAAc,2CAqEhB;AA0CD,wBAAgB,aAAa,CAAC,EAAE,GAAG,EAAE,GAAG,KAAK,EAAE,EAAE,cAAc,CAAC,OAAO,IAAI,CAAC,2CA2B3E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,QAAQ,CAAC,2CAYvE;AAED,wBAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAapC;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,2CAErE"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { Check, Clipboard } from '../icons.js';
|
|
4
|
-
import { createContext,
|
|
4
|
+
import { createContext, use, useMemo, useRef, } from 'react';
|
|
5
5
|
import { cn } from '../utils/cn.js';
|
|
6
6
|
import { useCopyButton } from '../utils/use-copy-button.js';
|
|
7
7
|
import { buttonVariants } from '../components/ui/button.js';
|
|
@@ -12,11 +12,11 @@ export function Pre(props) {
|
|
|
12
12
|
return (_jsx("pre", { ...props, className: cn('min-w-full w-max *:flex *:flex-col', props.className), children: props.children }));
|
|
13
13
|
}
|
|
14
14
|
export function CodeBlock({ ref, title, allowCopy = true, keepBackground = false, icon, viewportProps = {}, children, Actions = (props) => (_jsx("div", { ...props, className: cn('empty:hidden', props.className) })), ...props }) {
|
|
15
|
-
const inTab =
|
|
15
|
+
const inTab = use(TabsContext) !== null;
|
|
16
16
|
const areaRef = useRef(null);
|
|
17
|
-
return (_jsxs("figure", { ref: ref, dir: "ltr", ...props, className: cn(inTab
|
|
17
|
+
return (_jsxs("figure", { ref: ref, dir: "ltr", ...props, tabIndex: -1, className: cn(inTab
|
|
18
18
|
? 'bg-fd-secondary -mx-px -mb-px last:rounded-b-xl'
|
|
19
|
-
: 'my-4 bg-fd-card rounded-xl', keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)', 'shiki relative border shadow-sm
|
|
19
|
+
: 'my-4 bg-fd-card rounded-xl', keepBackground && 'bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)', 'shiki relative border shadow-sm not-prose overflow-hidden text-sm', props.className), children: [title ? (_jsxs("div", { className: "flex text-fd-muted-foreground items-center gap-2 h-9.5 border-b px-4", children: [typeof icon === 'string' ? (_jsx("div", { className: "[&_svg]:size-3.5", dangerouslySetInnerHTML: {
|
|
20
20
|
__html: icon,
|
|
21
21
|
} })) : (icon), _jsx("figcaption", { className: "flex-1 truncate", children: title }), Actions({
|
|
22
22
|
className: '-me-2',
|
|
@@ -24,7 +24,7 @@ export function CodeBlock({ ref, title, allowCopy = true, keepBackground = false
|
|
|
24
24
|
})] })) : (Actions({
|
|
25
25
|
className: 'absolute top-2 right-2 z-2 backdrop-blur-lg rounded-lg text-fd-muted-foreground',
|
|
26
26
|
children: allowCopy && _jsx(CopyButton, { containerRef: areaRef }),
|
|
27
|
-
})), _jsx("div", { ref: areaRef, ...viewportProps, className: cn('text-[13px] py-3.5 overflow-auto max-h-[600px] fd-scroll-container', viewportProps.className), style: {
|
|
27
|
+
})), _jsx("div", { ref: areaRef, ...viewportProps, role: "region", tabIndex: 0, className: cn('text-[13px] py-3.5 overflow-auto max-h-[600px] fd-scroll-container focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-fd-ring', viewportProps.className), style: {
|
|
28
28
|
// space for toolbar
|
|
29
29
|
'--padding-right': !title ? 'calc(var(--spacing) * 8)' : undefined,
|
|
30
30
|
counterSet: props['data-line-numbers']
|
|
@@ -45,14 +45,14 @@ function CopyButton({ className, containerRef, ...props }) {
|
|
|
45
45
|
void navigator.clipboard.writeText(clone.textContent ?? '');
|
|
46
46
|
});
|
|
47
47
|
return (_jsx("button", { type: "button", "data-checked": checked || undefined, className: cn(buttonVariants({
|
|
48
|
-
className: 'hover:text-fd-accent-foreground data-
|
|
48
|
+
className: 'hover:text-fd-accent-foreground data-checked:text-fd-accent-foreground',
|
|
49
49
|
size: 'icon-xs',
|
|
50
50
|
}), className), "aria-label": checked ? 'Copied Text' : 'Copy Text', onClick: onClick, ...props, children: checked ? _jsx(Check, {}) : _jsx(Clipboard, {}) }));
|
|
51
51
|
}
|
|
52
52
|
export function CodeBlockTabs({ ref, ...props }) {
|
|
53
53
|
const containerRef = useRef(null);
|
|
54
|
-
const nested =
|
|
55
|
-
return (_jsx(Tabs, { ref: mergeRefs(containerRef, ref), ...props, className: cn('bg-fd-card rounded-xl border', !nested && 'my-4', props.className), children: _jsx(TabsContext
|
|
54
|
+
const nested = use(TabsContext) !== null;
|
|
55
|
+
return (_jsx(Tabs, { ref: mergeRefs(containerRef, ref), ...props, className: cn('bg-fd-card rounded-xl border', !nested && 'my-4', props.className), children: _jsx(TabsContext, { value: useMemo(() => ({
|
|
56
56
|
containerRef,
|
|
57
57
|
nested,
|
|
58
58
|
}), [nested]), children: props.children }) }));
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { type AnchorHTMLAttributes } from 'react';
|
|
2
|
-
export declare function GithubInfo({ repo, owner, token, ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & {
|
|
2
|
+
export declare function GithubInfo({ repo, owner, token, baseUrl, ...props }: AnchorHTMLAttributes<HTMLAnchorElement> & {
|
|
3
3
|
owner: string;
|
|
4
4
|
repo: string;
|
|
5
5
|
token?: string;
|
|
6
|
+
baseUrl?: string;
|
|
6
7
|
}): Promise<import("react/jsx-runtime").JSX.Element>;
|
|
7
8
|
//# sourceMappingURL=github-info.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"github-info.d.ts","sourceRoot":"","sources":["../../src/components/github-info.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"github-info.d.ts","sourceRoot":"","sources":["../../src/components/github-info.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAsClD,wBAAsB,UAAU,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,KAAK,EACL,OAAO,EACP,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,GAAG;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,oDA4BA"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from '../utils/cn.js';
|
|
3
3
|
import { Star } from '../icons.js';
|
|
4
|
-
async function getRepoStarsAndForks(owner, repo, token) {
|
|
5
|
-
const endpoint =
|
|
4
|
+
async function getRepoStarsAndForks(owner, repo, token, baseUrl = 'https://api.github.com') {
|
|
5
|
+
const endpoint = `${baseUrl}/repos/${owner}/${repo}`;
|
|
6
6
|
const headers = new Headers({
|
|
7
7
|
'Content-Type': 'application/json',
|
|
8
8
|
});
|
|
@@ -24,8 +24,8 @@ async function getRepoStarsAndForks(owner, repo, token) {
|
|
|
24
24
|
forks: data.forks_count,
|
|
25
25
|
};
|
|
26
26
|
}
|
|
27
|
-
export async function GithubInfo({ repo, owner, token, ...props }) {
|
|
28
|
-
const { stars } = await getRepoStarsAndForks(owner, repo, token);
|
|
27
|
+
export async function GithubInfo({ repo, owner, token, baseUrl, ...props }) {
|
|
28
|
+
const { stars } = await getRepoStarsAndForks(owner, repo, token, baseUrl);
|
|
29
29
|
const humanizedStars = humanizeNumber(stars);
|
|
30
30
|
return (_jsxs("a", { href: `https://github.com/${owner}/${repo}`, rel: "noreferrer noopener", target: "_blank", ...props, className: cn('flex flex-col gap-1.5 p-2 rounded-lg text-sm text-fd-foreground/80 transition-colors lg:flex-row lg:items-center hover:text-fd-accent-foreground hover:bg-fd-accent', props.className), children: [_jsxs("p", { className: "flex items-center gap-2 truncate", children: [_jsxs("svg", { fill: "currentColor", viewBox: "0 0 24 24", className: "size-3.5", children: [_jsx("title", { children: "GitHub" }), _jsx("path", { d: "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12" })] }), owner, "/", repo] }), _jsxs("p", { className: "flex text-xs items-center gap-1 text-fd-muted-foreground", children: [_jsx(Star, { className: "size-3" }), humanizedStars] })] }));
|
|
31
31
|
}
|
|
@@ -23,6 +23,6 @@ function Item({ name, item: { parameters = [], description, required = false, de
|
|
|
23
23
|
? 'shadow-sm bg-fd-background not-last:mb-2'
|
|
24
24
|
: 'border-transparent'), children: [_jsxs(CollapsibleTrigger, { className: "relative flex flex-row items-center w-full group text-start px-3 py-2 not-prose hover:bg-fd-accent", children: [_jsxs("code", { className: cn(keyVariants({
|
|
25
25
|
deprecated,
|
|
26
|
-
className: 'min-w-fit w-[25%] font-medium',
|
|
26
|
+
className: 'min-w-fit w-[25%] font-medium pe-2',
|
|
27
27
|
})), children: [name, !required && '?'] }), typeDescriptionLink ? (_jsx(Link, { href: typeDescriptionLink, className: "underline @max-xl:hidden", children: type })) : (_jsx("span", { className: "@max-xl:hidden", children: type })), _jsx(ChevronDown, { className: "absolute end-2 size-4 text-fd-muted-foreground transition-transform group-data-[state=open]:rotate-180" })] }), _jsx(CollapsibleContent, { children: _jsxs("div", { className: "grid grid-cols-[1fr_3fr] gap-y-4 text-sm p-3 overflow-auto fd-scroll-container border-t", children: [_jsx("div", { className: "text-sm prose col-span-full prose-no-margin empty:hidden", children: description }), typeDescription && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Type" }), _jsx("p", { className: "my-auto not-prose", children: typeDescription })] })), defaultValue && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Default" }), _jsx("p", { className: "my-auto not-prose", children: defaultValue })] })), parameters.length > 0 && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Parameters" }), _jsx("div", { className: "flex flex-col gap-2", children: parameters.map((param) => (_jsxs("div", { className: "inline-flex items-center flex-wrap gap-1", children: [_jsxs("p", { className: "font-medium not-prose text-nowrap", children: [param.name, " -"] }), _jsx("div", { className: "text-sm prose prose-no-margin", children: param.description })] }, param.name))) })] })), returns && (_jsxs(_Fragment, { children: [_jsx("p", { className: cn(fieldVariants()), children: "Returns" }), _jsx("div", { className: "my-auto text-sm prose prose-no-margin", children: returns })] }))] }) })] }));
|
|
28
28
|
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { type ComponentProps } from 'react';
|
|
2
|
+
import { LinkItemType } from '../../layouts/shared/index.js';
|
|
3
|
+
import { NavigationMenuContent, NavigationMenuTrigger } from '../../components/ui/navigation-menu.js';
|
|
4
|
+
export declare const navItemVariants: (props?: ({
|
|
5
|
+
variant?: "button" | "main" | "icon" | null | undefined;
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
7
|
+
export declare function Navbar(props: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare function NavbarLinkItem({ item, ...props }: {
|
|
9
|
+
item: LinkItemType;
|
|
10
|
+
className?: string;
|
|
11
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare const Menu: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
|
|
13
|
+
export declare function MenuLinkItem({ item, ...props }: {
|
|
14
|
+
item: LinkItemType;
|
|
15
|
+
className?: string;
|
|
16
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export declare function MenuTrigger({ enableHover, ...props }: ComponentProps<typeof NavigationMenuTrigger> & {
|
|
18
|
+
/**
|
|
19
|
+
* Enable hover to trigger
|
|
20
|
+
*/
|
|
21
|
+
enableHover?: boolean;
|
|
22
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
23
|
+
export declare function MenuContent(props: ComponentProps<typeof NavigationMenuContent>): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
//# sourceMappingURL=client.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/client.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAsB,MAAM,OAAO,CAAC;AAIhE,OAAO,EAAgB,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,EAEL,qBAAqB,EAIrB,qBAAqB,EAEtB,MAAM,iCAAiC,CAAC;AAIzC,eAAO,MAAM,eAAe;;8EAiB1B,CAAC;AAEH,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC,2CA2BlD;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAiFA;AAED,eAAO,MAAM,IAAI,yNAAqB,CAAC;AAEvC,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CAyDA;AAED,wBAAgB,WAAW,CAAC,EAC1B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,qBAAqB,CAAC,GAAG;IAChD;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CASA;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,cAAc,CAAC,OAAO,qBAAqB,CAAC,2CAUpD"}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { Fragment, useState } from 'react';
|
|
4
|
+
import { cva } from 'class-variance-authority';
|
|
5
|
+
import Link from 'fumadocs-core/link';
|
|
6
|
+
import { cn } from '../../utils/cn.js';
|
|
7
|
+
import { BaseLinkItem } from '../../layouts/shared/index.js';
|
|
8
|
+
import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, } from '../../components/ui/navigation-menu.js';
|
|
9
|
+
import { useNav } from '../../contexts/layout.js';
|
|
10
|
+
import { buttonVariants } from '../../components/ui/button.js';
|
|
11
|
+
export const navItemVariants = cva('[&_svg]:size-4', {
|
|
12
|
+
variants: {
|
|
13
|
+
variant: {
|
|
14
|
+
main: 'inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary',
|
|
15
|
+
button: buttonVariants({
|
|
16
|
+
color: 'secondary',
|
|
17
|
+
className: 'gap-1.5',
|
|
18
|
+
}),
|
|
19
|
+
icon: buttonVariants({
|
|
20
|
+
color: 'ghost',
|
|
21
|
+
size: 'icon',
|
|
22
|
+
}),
|
|
23
|
+
},
|
|
24
|
+
},
|
|
25
|
+
defaultVariants: {
|
|
26
|
+
variant: 'main',
|
|
27
|
+
},
|
|
28
|
+
});
|
|
29
|
+
export function Navbar(props) {
|
|
30
|
+
const [value, setValue] = useState('');
|
|
31
|
+
const { isTransparent } = useNav();
|
|
32
|
+
return (_jsx(NavigationMenu, { value: value, onValueChange: setValue, asChild: true, children: _jsxs("header", { id: "nd-nav", ...props, className: cn('fixed top-(--fd-banner-height) z-40 left-0 right-(--removed-body-scroll-bar-size,0) backdrop-blur-lg border-b transition-colors *:mx-auto *:max-w-fd-container', value.length > 0 && 'max-lg:shadow-lg max-lg:rounded-b-2xl', (!isTransparent || value.length > 0) && 'bg-fd-background/80', props.className), children: [_jsx(NavigationMenuList, { className: "flex h-14 w-full items-center px-4", asChild: true, children: _jsx("nav", { children: props.children }) }), _jsx(NavigationMenuViewport, {})] }) }));
|
|
33
|
+
}
|
|
34
|
+
export function NavbarLinkItem({ item, ...props }) {
|
|
35
|
+
if (item.type === 'custom')
|
|
36
|
+
return _jsx("div", { ...props, children: item.children });
|
|
37
|
+
if (item.type === 'menu') {
|
|
38
|
+
const children = item.items.map((child, j) => {
|
|
39
|
+
if (child.type === 'custom') {
|
|
40
|
+
return _jsx(Fragment, { children: child.children }, j);
|
|
41
|
+
}
|
|
42
|
+
const { banner = child.icon ? (_jsx("div", { className: "w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4", children: child.icon })) : null, ...rest } = child.menu ?? {};
|
|
43
|
+
return (_jsx(NavigationMenuLink, { asChild: true, children: _jsx(Link, { href: child.url, external: child.external, ...rest, className: cn('flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground', rest.className), children: rest.children ?? (_jsxs(_Fragment, { children: [banner, _jsx("p", { className: "text-[15px] font-medium", children: child.text }), _jsx("p", { className: "text-sm text-fd-muted-foreground empty:hidden", children: child.description })] })) }) }, `${j}-${child.url}`));
|
|
44
|
+
});
|
|
45
|
+
return (_jsxs(NavigationMenuItem, { children: [_jsx(NavigationMenuTrigger, { ...props, className: cn(navItemVariants(), 'rounded-md', props.className), children: item.url ? (_jsx(Link, { href: item.url, external: item.external, children: item.text })) : (item.text) }), _jsx(NavigationMenuContent, { className: "grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3", children: children })] }));
|
|
46
|
+
}
|
|
47
|
+
return (_jsx(NavigationMenuItem, { children: _jsx(NavigationMenuLink, { asChild: true, children: _jsx(BaseLinkItem, { item: item, "aria-label": item.type === 'icon' ? item.label : undefined, ...props, className: cn(navItemVariants({ variant: item.type }), props.className), children: item.type === 'icon' ? item.icon : item.text }) }) }));
|
|
48
|
+
}
|
|
49
|
+
export const Menu = NavigationMenuItem;
|
|
50
|
+
export function MenuLinkItem({ item, ...props }) {
|
|
51
|
+
if (item.type === 'custom')
|
|
52
|
+
return _jsx("div", { className: cn('grid', props.className), children: item.children });
|
|
53
|
+
if (item.type === 'menu') {
|
|
54
|
+
const header = (_jsxs(_Fragment, { children: [item.icon, item.text] }));
|
|
55
|
+
return (_jsxs("div", { className: cn('mb-4 flex flex-col', props.className), children: [_jsx("p", { className: "mb-1 text-sm text-fd-muted-foreground", children: item.url ? (_jsx(NavigationMenuLink, { asChild: true, children: _jsx(Link, { href: item.url, external: item.external, children: header }) })) : (header) }), item.items.map((child, i) => (_jsx(MenuLinkItem, { item: child }, i)))] }));
|
|
56
|
+
}
|
|
57
|
+
return (_jsx(NavigationMenuLink, { asChild: true, children: _jsxs(BaseLinkItem, { item: item, className: cn({
|
|
58
|
+
main: 'inline-flex items-center gap-2 py-1.5 transition-colors hover:text-fd-popover-foreground/50 data-[active=true]:font-medium data-[active=true]:text-fd-primary [&_svg]:size-4',
|
|
59
|
+
icon: buttonVariants({
|
|
60
|
+
size: 'icon',
|
|
61
|
+
color: 'ghost',
|
|
62
|
+
}),
|
|
63
|
+
button: buttonVariants({
|
|
64
|
+
color: 'secondary',
|
|
65
|
+
className: 'gap-1.5 [&_svg]:size-4',
|
|
66
|
+
}),
|
|
67
|
+
}[item.type ?? 'main'], props.className), "aria-label": item.type === 'icon' ? item.label : undefined, children: [item.icon, item.type === 'icon' ? undefined : item.text] }) }));
|
|
68
|
+
}
|
|
69
|
+
export function MenuTrigger({ enableHover = false, ...props }) {
|
|
70
|
+
return (_jsx(NavigationMenuTrigger, { ...props, onPointerMove: enableHover ? undefined : (e) => e.preventDefault(), children: props.children }));
|
|
71
|
+
}
|
|
72
|
+
export function MenuContent(props) {
|
|
73
|
+
return (_jsx(NavigationMenuContent, { ...props, className: cn('flex flex-col p-4', props.className), children: props.children }));
|
|
74
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/index.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAW,MAAM,OAAO,CAAC;AAErD,OAAO,EACL,KAAK,eAAe,EAGpB,KAAK,UAAU,EAChB,MAAM,kBAAkB,CAAC;AAuB1B,MAAM,WAAW,eAAgB,SAAQ,eAAe;IACtD,GAAG,CAAC,EAAE,OAAO,CACX,UAAU,GAAG;QACX;;WAEG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;KAC7B,CACF,CAAC;CACH;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,eAAe,GAAG,cAAc,CAAC,WAAW,CAAC,2CAkCrD;AAED,wBAAgB,MAAM,CAAC,EACrB,GAAQ,EACR,IAAY,EACZ,KAAK,EACL,SAAS,EACT,WAAgB,EAChB,YAAiB,GAClB,EAAE,eAAe,2CA2GjB"}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs
|
|
2
|
-
import {
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo } from 'react';
|
|
3
3
|
import { cn } from '../../utils/cn.js';
|
|
4
4
|
import { getLinks, } from '../../layouts/shared/index.js';
|
|
5
5
|
import { NavProvider } from '../../contexts/layout.js';
|
|
6
|
-
import { Navbar, NavbarLink, NavbarMenu, NavbarMenuContent, NavbarMenuLink, NavbarMenuTrigger, } from '../../layouts/home/navbar.js';
|
|
7
6
|
import { LargeSearchToggle, SearchToggle, } from '../../components/layout/search-toggle.js';
|
|
8
7
|
import { ThemeToggle } from '../../components/layout/theme-toggle.js';
|
|
9
8
|
import { LanguageToggle, LanguageToggleText, } from '../../components/layout/language-toggle.js';
|
|
10
9
|
import { ChevronDown, Languages } from '../../icons.js';
|
|
11
10
|
import Link from 'fumadocs-core/link';
|
|
12
|
-
import { Menu, MenuContent, MenuLinkItem, MenuTrigger, } from '../../layouts/home/
|
|
11
|
+
import { Navbar, NavbarLinkItem, Menu, MenuContent, MenuLinkItem, MenuTrigger, } from '../../layouts/home/client.js';
|
|
13
12
|
import { buttonVariants } from '../../components/ui/button.js';
|
|
14
13
|
export function HomeLayout(props) {
|
|
15
14
|
const { nav = {}, links, githubUrl, i18n, themeSwitch = {}, searchToggle, ...rest } = props;
|
|
@@ -24,31 +23,20 @@ export function Header({ nav = {}, i18n = false, links, githubUrl, themeSwitch =
|
|
|
24
23
|
.filter((item) => !isSecondary(item))
|
|
25
24
|
.map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm" }, i))) }), _jsxs("div", { className: "flex flex-row items-center justify-end gap-1.5 flex-1 max-lg:hidden", children: [searchToggle.enabled !== false &&
|
|
26
25
|
(searchToggle.components?.lg ?? (_jsx(LargeSearchToggle, { className: "w-full rounded-full ps-2.5 max-w-[240px]", hideIfDisabled: true }))), themeSwitch.enabled !== false &&
|
|
27
|
-
(themeSwitch.component ?? _jsx(ThemeToggle, { mode: themeSwitch?.mode })), i18n
|
|
26
|
+
(themeSwitch.component ?? _jsx(ThemeToggle, { mode: themeSwitch?.mode })), i18n && (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-5" }) })), _jsx("ul", { className: "flex flex-row gap-2 items-center empty:hidden", children: navItems.filter(isSecondary).map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: cn(item.type === 'icon' && [
|
|
27
|
+
'-mx-1',
|
|
28
|
+
i === 0 && 'ms-0',
|
|
29
|
+
i === navItems.length - 1 && 'me-0',
|
|
30
|
+
]) }, i))) })] }), _jsxs("ul", { className: "flex flex-row items-center ms-auto -me-1.5 lg:hidden", children: [searchToggle.enabled !== false &&
|
|
28
31
|
(searchToggle.components?.sm ?? (_jsx(SearchToggle, { className: "p-2", hideIfDisabled: true }))), _jsxs(Menu, { children: [_jsx(MenuTrigger, { "aria-label": "Toggle Menu", className: cn(buttonVariants({
|
|
29
32
|
size: 'icon',
|
|
30
33
|
color: 'ghost',
|
|
31
|
-
className: 'group',
|
|
32
|
-
})), enableHover: nav.enableHoverToOpen, children: _jsx(ChevronDown, { className: "
|
|
34
|
+
className: 'group [&_svg]:size-5.5',
|
|
35
|
+
})), enableHover: nav.enableHoverToOpen, children: _jsx(ChevronDown, { className: "transition-transform duration-300 group-data-[state=open]:rotate-180" }) }), _jsxs(MenuContent, { className: "sm:flex-row sm:items-center sm:justify-end", children: [menuItems
|
|
33
36
|
.filter((item) => !isSecondary(item))
|
|
34
37
|
.map((item, i) => (_jsx(MenuLinkItem, { item: item, className: "sm:hidden" }, i))), _jsxs("div", { className: "-ms-1.5 flex flex-row items-center gap-1.5 max-sm:mt-2", children: [menuItems.filter(isSecondary).map((item, i) => (_jsx(MenuLinkItem, { item: item, className: "-me-1.5" }, i))), _jsx("div", { role: "separator", className: "flex-1" }), i18n ? (_jsxs(LanguageToggle, { children: [_jsx(Languages, { className: "size-5" }), _jsx(LanguageToggleText, {}), _jsx(ChevronDown, { className: "size-3 text-fd-muted-foreground" })] })) : null, themeSwitch.enabled !== false &&
|
|
35
38
|
(themeSwitch.component ?? (_jsx(ThemeToggle, { mode: themeSwitch?.mode })))] })] })] })] })] }));
|
|
36
39
|
}
|
|
37
|
-
function NavbarLinkItem({ item, ...props }) {
|
|
38
|
-
if (item.type === 'custom')
|
|
39
|
-
return _jsx("div", { ...props, children: item.children });
|
|
40
|
-
if (item.type === 'menu') {
|
|
41
|
-
const children = item.items.map((child, j) => {
|
|
42
|
-
if (child.type === 'custom') {
|
|
43
|
-
return _jsx(Fragment, { children: child.children }, j);
|
|
44
|
-
}
|
|
45
|
-
const { banner = child.icon ? (_jsx("div", { className: "w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4", children: child.icon })) : null, ...rest } = child.menu ?? {};
|
|
46
|
-
return (_jsx(NavbarMenuLink, { href: child.url, external: child.external, ...rest, children: rest.children ?? (_jsxs(_Fragment, { children: [banner, _jsx("p", { className: "text-[15px] font-medium", children: child.text }), _jsx("p", { className: "text-sm text-fd-muted-foreground empty:hidden", children: child.description })] })) }, `${j}-${child.url}`));
|
|
47
|
-
});
|
|
48
|
-
return (_jsxs(NavbarMenu, { children: [_jsx(NavbarMenuTrigger, { ...props, children: item.url ? (_jsx(Link, { href: item.url, external: item.external, children: item.text })) : (item.text) }), _jsx(NavbarMenuContent, { children: children })] }));
|
|
49
|
-
}
|
|
50
|
-
return (_jsx(NavbarLink, { ...props, item: item, variant: item.type, "aria-label": item.type === 'icon' ? item.label : undefined, children: item.type === 'icon' ? item.icon : item.text }));
|
|
51
|
-
}
|
|
52
40
|
function isSecondary(item) {
|
|
53
41
|
if ('secondary' in item && item.secondary != null)
|
|
54
42
|
return item.secondary;
|
|
@@ -1,16 +1,7 @@
|
|
|
1
|
-
import { type ComponentProps } from 'react';
|
|
2
|
-
import { type VariantProps } from 'class-variance-authority';
|
|
3
1
|
import { type LinkProps } from 'fumadocs-core/link';
|
|
4
|
-
import { BaseLinkItem } from '../../layouts/shared/index.js';
|
|
5
2
|
import type { NavigationMenuContentProps, NavigationMenuTriggerProps } from '@radix-ui/react-navigation-menu';
|
|
6
|
-
export declare function Navbar(props: ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
7
3
|
export declare const NavbarMenu: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
|
|
8
4
|
export declare function NavbarMenuContent(props: NavigationMenuContentProps): import("react/jsx-runtime").JSX.Element;
|
|
9
5
|
export declare function NavbarMenuTrigger(props: NavigationMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
10
6
|
export declare function NavbarMenuLink(props: LinkProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
-
declare const linkVariants: (props?: ({
|
|
12
|
-
variant?: "button" | "main" | "icon" | null | undefined;
|
|
13
|
-
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
|
-
export declare function NavbarLink({ item, variant, ...props }: ComponentProps<typeof BaseLinkItem> & VariantProps<typeof linkVariants>): import("react/jsx-runtime").JSX.Element;
|
|
15
|
-
export {};
|
|
16
7
|
//# sourceMappingURL=navbar.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/navbar.tsx"],"names":[],"mappings":"AACA,
|
|
1
|
+
{"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/navbar.tsx"],"names":[],"mappings":"AACA,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAQ1D,OAAO,KAAK,EACV,0BAA0B,EAC1B,0BAA0B,EAC3B,MAAM,iCAAiC,CAAC;AAGzC,eAAO,MAAM,UAAU,yNAAqB,CAAC;AAE7C,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,0BAA0B,2CAYlE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,0BAA0B,2CASlE;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,2CAc9C"}
|
|
@@ -1,19 +1,9 @@
|
|
|
1
1
|
'use client';
|
|
2
|
-
import { jsx as _jsx
|
|
3
|
-
import { useState } from 'react';
|
|
4
|
-
import { cva } from 'class-variance-authority';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
3
|
import Link from 'fumadocs-core/link';
|
|
6
4
|
import { cn } from '../../utils/cn.js';
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import { useNav } from '../../contexts/layout.js';
|
|
10
|
-
import { buttonVariants } from '../../components/ui/button.js';
|
|
11
|
-
const navItemVariants = cva('inline-flex items-center gap-1 p-2 text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground data-[active=true]:text-fd-primary [&_svg]:size-4');
|
|
12
|
-
export function Navbar(props) {
|
|
13
|
-
const [value, setValue] = useState('');
|
|
14
|
-
const { isTransparent } = useNav();
|
|
15
|
-
return (_jsx(NavigationMenu, { value: value, onValueChange: setValue, asChild: true, children: _jsxs("header", { id: "nd-nav", ...props, className: cn('fixed top-(--fd-banner-height) z-40 left-0 right-(--removed-body-scroll-bar-size,0) backdrop-blur-lg border-b transition-colors *:mx-auto *:max-w-fd-container', value.length > 0 && 'max-lg:shadow-lg max-lg:rounded-b-2xl', (!isTransparent || value.length > 0) && 'bg-fd-background/80', props.className), children: [_jsx(NavigationMenuList, { className: "flex h-14 w-full items-center px-4", asChild: true, children: _jsx("nav", { children: props.children }) }), _jsx(NavigationMenuViewport, {})] }) }));
|
|
16
|
-
}
|
|
5
|
+
import { NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuTrigger, } from '../../components/ui/navigation-menu.js';
|
|
6
|
+
import { navItemVariants } from './client.js';
|
|
17
7
|
export const NavbarMenu = NavigationMenuItem;
|
|
18
8
|
export function NavbarMenuContent(props) {
|
|
19
9
|
return (_jsx(NavigationMenuContent, { ...props, className: cn('grid grid-cols-1 gap-2 p-4 md:grid-cols-2 lg:grid-cols-3', props.className), children: props.children }));
|
|
@@ -24,24 +14,3 @@ export function NavbarMenuTrigger(props) {
|
|
|
24
14
|
export function NavbarMenuLink(props) {
|
|
25
15
|
return (_jsx(NavigationMenuLink, { asChild: true, children: _jsx(Link, { ...props, className: cn('flex flex-col gap-2 rounded-lg border bg-fd-card p-3 transition-colors hover:bg-fd-accent/80 hover:text-fd-accent-foreground', props.className), children: props.children }) }));
|
|
26
16
|
}
|
|
27
|
-
const linkVariants = cva('', {
|
|
28
|
-
variants: {
|
|
29
|
-
variant: {
|
|
30
|
-
main: navItemVariants(),
|
|
31
|
-
button: buttonVariants({
|
|
32
|
-
color: 'secondary',
|
|
33
|
-
className: 'gap-1.5 [&_svg]:size-4',
|
|
34
|
-
}),
|
|
35
|
-
icon: buttonVariants({
|
|
36
|
-
color: 'ghost',
|
|
37
|
-
size: 'icon',
|
|
38
|
-
}),
|
|
39
|
-
},
|
|
40
|
-
},
|
|
41
|
-
defaultVariants: {
|
|
42
|
-
variant: 'main',
|
|
43
|
-
},
|
|
44
|
-
});
|
|
45
|
-
export function NavbarLink({ item, variant, ...props }) {
|
|
46
|
-
return (_jsx(NavigationMenuItem, { children: _jsx(NavigationMenuLink, { asChild: true, children: _jsx(BaseLinkItem, { ...props, item: item, className: cn(linkVariants({ variant }), props.className), children: props.children }) }) }));
|
|
47
|
-
}
|
package/dist/style.css
CHANGED
|
@@ -465,6 +465,9 @@
|
|
|
465
465
|
.-ms-1\.5 {
|
|
466
466
|
margin-inline-start: calc(var(--spacing) * -1.5);
|
|
467
467
|
}
|
|
468
|
+
.ms-0 {
|
|
469
|
+
margin-inline-start: calc(var(--spacing) * 0);
|
|
470
|
+
}
|
|
468
471
|
.ms-2 {
|
|
469
472
|
margin-inline-start: calc(var(--spacing) * 2);
|
|
470
473
|
}
|
|
@@ -483,6 +486,9 @@
|
|
|
483
486
|
.-me-2 {
|
|
484
487
|
margin-inline-end: calc(var(--spacing) * -2);
|
|
485
488
|
}
|
|
489
|
+
.me-0 {
|
|
490
|
+
margin-inline-end: calc(var(--spacing) * 0);
|
|
491
|
+
}
|
|
486
492
|
.me-1 {
|
|
487
493
|
margin-inline-end: calc(var(--spacing) * 1);
|
|
488
494
|
}
|
|
@@ -937,10 +943,6 @@
|
|
|
937
943
|
.table {
|
|
938
944
|
display: table;
|
|
939
945
|
}
|
|
940
|
-
.\!size-5\.5 {
|
|
941
|
-
width: calc(var(--spacing) * 5.5) !important;
|
|
942
|
-
height: calc(var(--spacing) * 5.5) !important;
|
|
943
|
-
}
|
|
944
946
|
.size-3 {
|
|
945
947
|
width: calc(var(--spacing) * 3);
|
|
946
948
|
height: calc(var(--spacing) * 3);
|
|
@@ -2053,6 +2055,11 @@
|
|
|
2053
2055
|
outline-style: none;
|
|
2054
2056
|
}
|
|
2055
2057
|
}
|
|
2058
|
+
.focus-visible\:ring-inset {
|
|
2059
|
+
&:focus-visible {
|
|
2060
|
+
--tw-ring-inset: inset;
|
|
2061
|
+
}
|
|
2062
|
+
}
|
|
2056
2063
|
.disabled\:pointer-events-none {
|
|
2057
2064
|
&:disabled {
|
|
2058
2065
|
pointer-events: none;
|
|
@@ -2081,6 +2088,11 @@
|
|
|
2081
2088
|
}
|
|
2082
2089
|
}
|
|
2083
2090
|
}
|
|
2091
|
+
.data-checked\:text-fd-accent-foreground {
|
|
2092
|
+
&[data-checked] {
|
|
2093
|
+
color: var(--color-fd-accent-foreground);
|
|
2094
|
+
}
|
|
2095
|
+
}
|
|
2084
2096
|
.data-\[active\=true\]\:font-medium {
|
|
2085
2097
|
&[data-active="true"] {
|
|
2086
2098
|
--tw-font-weight: var(--font-weight-medium);
|
|
@@ -2152,11 +2164,6 @@
|
|
|
2152
2164
|
}
|
|
2153
2165
|
}
|
|
2154
2166
|
}
|
|
2155
|
-
.data-\[checked\]\:text-fd-accent-foreground {
|
|
2156
|
-
&[data-checked] {
|
|
2157
|
-
color: var(--color-fd-accent-foreground);
|
|
2158
|
-
}
|
|
2159
|
-
}
|
|
2160
2167
|
.data-\[collapsed\=false\]\:hidden {
|
|
2161
2168
|
&[data-collapsed="false"] {
|
|
2162
2169
|
display: none;
|
|
@@ -2649,6 +2656,12 @@
|
|
|
2649
2656
|
height: calc(var(--spacing) * 5);
|
|
2650
2657
|
}
|
|
2651
2658
|
}
|
|
2659
|
+
.\[\&_svg\]\:size-5\.5 {
|
|
2660
|
+
& svg {
|
|
2661
|
+
width: calc(var(--spacing) * 5.5);
|
|
2662
|
+
height: calc(var(--spacing) * 5.5);
|
|
2663
|
+
}
|
|
2664
|
+
}
|
|
2652
2665
|
.\[\&_svg\]\:size-full {
|
|
2653
2666
|
& svg {
|
|
2654
2667
|
width: 100%;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "fumadocs-ui",
|
|
3
|
-
"version": "16.0.
|
|
3
|
+
"version": "16.0.8",
|
|
4
4
|
"description": "The framework for building a documentation website in Next.js",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"NextJs",
|
|
@@ -28,9 +28,9 @@
|
|
|
28
28
|
"import": "./dist/layouts/home/index.js",
|
|
29
29
|
"types": "./dist/layouts/home/index.d.ts"
|
|
30
30
|
},
|
|
31
|
-
"./layouts/home
|
|
32
|
-
"import": "./dist/layouts/home
|
|
33
|
-
"types": "./dist/layouts/home
|
|
31
|
+
"./layouts/home/navbar": {
|
|
32
|
+
"import": "./dist/layouts/home/navbar.js",
|
|
33
|
+
"types": "./dist/layouts/home/navbar.d.ts"
|
|
34
34
|
},
|
|
35
35
|
"./layouts/docs": {
|
|
36
36
|
"import": "./dist/layouts/docs/index.js",
|
|
@@ -112,7 +112,7 @@
|
|
|
112
112
|
"@radix-ui/react-popover": "^1.1.15",
|
|
113
113
|
"@radix-ui/react-presence": "^1.1.5",
|
|
114
114
|
"@radix-ui/react-scroll-area": "^1.2.10",
|
|
115
|
-
"@radix-ui/react-slot": "^1.2.
|
|
115
|
+
"@radix-ui/react-slot": "^1.2.4",
|
|
116
116
|
"@radix-ui/react-tabs": "^1.1.13",
|
|
117
117
|
"class-variance-authority": "^0.7.1",
|
|
118
118
|
"lodash.merge": "^4.6.2",
|
|
@@ -121,12 +121,13 @@
|
|
|
121
121
|
"react-medium-image-zoom": "^5.4.0",
|
|
122
122
|
"scroll-into-view-if-needed": "^3.1.0",
|
|
123
123
|
"tailwind-merge": "^3.3.1",
|
|
124
|
-
"fumadocs-core": "16.0.
|
|
124
|
+
"fumadocs-core": "16.0.8"
|
|
125
125
|
},
|
|
126
126
|
"devDependencies": {
|
|
127
127
|
"@next/eslint-plugin-next": "16.0.1",
|
|
128
128
|
"@tailwindcss/cli": "^4.1.16",
|
|
129
129
|
"@types/lodash.merge": "^4.6.9",
|
|
130
|
+
"@types/node": "^24.10.0",
|
|
130
131
|
"@types/react": "^19.2.2",
|
|
131
132
|
"@types/react-dom": "^19.2.2",
|
|
132
133
|
"next": "16.0.1",
|
|
@@ -134,7 +135,7 @@
|
|
|
134
135
|
"tsc-alias": "^1.8.16",
|
|
135
136
|
"@fumadocs/cli": "1.0.3",
|
|
136
137
|
"eslint-config-custom": "0.0.0",
|
|
137
|
-
"fumadocs-core": "16.0.
|
|
138
|
+
"fumadocs-core": "16.0.8",
|
|
138
139
|
"tsconfig": "0.0.0"
|
|
139
140
|
},
|
|
140
141
|
"peerDependencies": {
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { type LinkItemType } from '../../layouts/shared/index.js';
|
|
2
|
-
import { NavigationMenuContent, NavigationMenuTrigger } from '../../components/ui/navigation-menu.js';
|
|
3
|
-
import type { ComponentPropsWithoutRef } from 'react';
|
|
4
|
-
export declare function MenuLinkItem({ item, ...props }: {
|
|
5
|
-
item: LinkItemType;
|
|
6
|
-
className?: string;
|
|
7
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
8
|
-
export declare const Menu: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
|
|
9
|
-
export declare function MenuTrigger({ enableHover, ...props }: ComponentPropsWithoutRef<typeof NavigationMenuTrigger> & {
|
|
10
|
-
/**
|
|
11
|
-
* Enable hover to trigger
|
|
12
|
-
*/
|
|
13
|
-
enableHover?: boolean;
|
|
14
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
15
|
-
export declare function MenuContent(props: ComponentPropsWithoutRef<typeof NavigationMenuContent>): import("react/jsx-runtime").JSX.Element;
|
|
16
|
-
//# sourceMappingURL=menu.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/menu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,KAAK,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEnE,OAAO,EACL,qBAAqB,EAGrB,qBAAqB,EACtB,MAAM,iCAAiC,CAAC;AAIzC,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAqBtD,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CA+CA;AAED,eAAO,MAAM,IAAI,yNAAqB,CAAC;AAEvC,wBAAgB,WAAW,CAAC,EAC1B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,GAAG;IAC1D;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CASA;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,2CAU9D"}
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { BaseLinkItem } from '../../layouts/shared/index.js';
|
|
4
|
-
import { cn } from '../../utils/cn.js';
|
|
5
|
-
import { NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuTrigger, } from '../../components/ui/navigation-menu.js';
|
|
6
|
-
import Link from 'fumadocs-core/link';
|
|
7
|
-
import { cva } from 'class-variance-authority';
|
|
8
|
-
import { buttonVariants } from '../../components/ui/button.js';
|
|
9
|
-
const menuItemVariants = cva('', {
|
|
10
|
-
variants: {
|
|
11
|
-
variant: {
|
|
12
|
-
main: 'inline-flex items-center gap-2 py-1.5 transition-colors hover:text-fd-popover-foreground/50 data-[active=true]:font-medium data-[active=true]:text-fd-primary [&_svg]:size-4',
|
|
13
|
-
icon: buttonVariants({
|
|
14
|
-
size: 'icon',
|
|
15
|
-
color: 'ghost',
|
|
16
|
-
}),
|
|
17
|
-
button: buttonVariants({
|
|
18
|
-
color: 'secondary',
|
|
19
|
-
className: 'gap-1.5 [&_svg]:size-4',
|
|
20
|
-
}),
|
|
21
|
-
},
|
|
22
|
-
},
|
|
23
|
-
defaultVariants: {
|
|
24
|
-
variant: 'main',
|
|
25
|
-
},
|
|
26
|
-
});
|
|
27
|
-
export function MenuLinkItem({ item, ...props }) {
|
|
28
|
-
if (item.type === 'custom')
|
|
29
|
-
return _jsx("div", { className: cn('grid', props.className), children: item.children });
|
|
30
|
-
if (item.type === 'menu') {
|
|
31
|
-
const header = (_jsxs(_Fragment, { children: [item.icon, item.text] }));
|
|
32
|
-
return (_jsxs("div", { className: cn('mb-4 flex flex-col', props.className), children: [_jsx("p", { className: "mb-1 text-sm text-fd-muted-foreground", children: item.url ? (_jsx(NavigationMenuLink, { asChild: true, children: _jsx(Link, { href: item.url, external: item.external, children: header }) })) : (header) }), item.items.map((child, i) => (_jsx(MenuLinkItem, { item: child }, i)))] }));
|
|
33
|
-
}
|
|
34
|
-
return (_jsx(NavigationMenuLink, { asChild: true, children: _jsxs(BaseLinkItem, { item: item, className: cn(menuItemVariants({ variant: item.type }), props.className), "aria-label": item.type === 'icon' ? item.label : undefined, children: [item.icon, item.type === 'icon' ? undefined : item.text] }) }));
|
|
35
|
-
}
|
|
36
|
-
export const Menu = NavigationMenuItem;
|
|
37
|
-
export function MenuTrigger({ enableHover = false, ...props }) {
|
|
38
|
-
return (_jsx(NavigationMenuTrigger, { ...props, onPointerMove: enableHover ? undefined : (e) => e.preventDefault(), children: props.children }));
|
|
39
|
-
}
|
|
40
|
-
export function MenuContent(props) {
|
|
41
|
-
return (_jsx(NavigationMenuContent, { ...props, className: cn('flex flex-col p-4', props.className), children: props.children }));
|
|
42
|
-
}
|