fumadocs-ui 14.7.3 → 14.7.5

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.
@@ -1 +1 @@
1
- {"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../src/components/banner.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAoC,MAAM,OAAO,CAAC;AAK9E,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,OAAkB,EAClB,YAAmB,EACnB,MAAe,EACf,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,kDAiEA"}
1
+ {"version":3,"file":"banner.d.ts","sourceRoot":"","sources":["../../src/components/banner.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,cAAc,EAAoC,MAAM,OAAO,CAAC;AAK9E,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,OAAkB,EAClB,YAAmB,EACnB,MAAe,EACf,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;IAClC;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAE/B;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,kDAoEA"}
@@ -18,7 +18,9 @@ export function Banner({ id, variant = 'normal', changeLayout = true, height = '
18
18
  }, [globalKey]);
19
19
  if (!open)
20
20
  return null;
21
- return (_jsxs("div", { id: id, ...props, className: cn('sticky top-0 z-40 flex h-[var(--fd-banner-height)] flex-row items-center justify-center bg-fd-secondary px-4 text-center text-sm font-medium', variant === 'rainbow' && 'bg-fd-background', !open && 'hidden', props.className), children: [changeLayout && open ? (_jsx("style", { children: globalKey
21
+ return (_jsxs("div", { id: id, ...props, className: cn('sticky top-0 z-40 flex flex-row items-center justify-center bg-fd-secondary px-4 text-center text-sm font-medium', variant === 'rainbow' && 'bg-fd-background', !open && 'hidden', props.className), style: {
22
+ height,
23
+ }, children: [changeLayout && open ? (_jsx("style", { children: globalKey
22
24
  ? `:root:not(.${globalKey}) { --fd-banner-height: ${height}; }`
23
25
  : `:root { --fd-banner-height: ${height}; }` })) : null, globalKey ? (_jsx("style", { children: `.${globalKey} #${id} { display: none; }` })) : null, globalKey ? (_jsx("script", { dangerouslySetInnerHTML: {
24
26
  __html: `if (localStorage.getItem('${globalKey}') === 'true') document.documentElement.classList.add('${globalKey}');`,
@@ -1,3 +1,5 @@
1
- import { type ButtonHTMLAttributes } from 'react';
2
- export declare function ThemeToggle({ className, ...props }: ButtonHTMLAttributes<HTMLButtonElement>): React.ReactElement;
1
+ import { type HTMLAttributes } from 'react';
2
+ export declare function ThemeToggle({ className, mode, ...props }: HTMLAttributes<HTMLElement> & {
3
+ mode?: 'light-dark' | 'light-dark-system';
4
+ }): import("react/jsx-runtime").JSX.Element;
3
5
  //# sourceMappingURL=theme-toggle.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/theme-toggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAgBlD,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,GAAG,KAAK,CAAC,YAAY,CAuB9D"}
1
+ {"version":3,"file":"theme-toggle.d.ts","sourceRoot":"","sources":["../../../src/components/layout/theme-toggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,cAAc,EAA6B,MAAM,OAAO,CAAC;AAYvE,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,IAAmB,EACnB,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,WAAW,CAAC,GAAG;IAC/B,IAAI,CAAC,EAAE,YAAY,GAAG,mBAAmB,CAAC;CAC3C,2CAiDA"}
@@ -1,21 +1,33 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { cva } from 'class-variance-authority';
4
- import { Moon, Sun } from 'lucide-react';
4
+ import { Moon, Sun, Airplay } from 'lucide-react';
5
5
  import { useTheme } from 'next-themes';
6
+ import { useLayoutEffect, useState } from 'react';
6
7
  import { cn } from '../../utils/cn';
7
- const buttonVariants = cva('size-7 rounded-full p-1.5 text-fd-muted-foreground', {
8
+ const itemVariants = cva('size-7 rounded-full p-1.5 text-fd-muted-foreground', {
8
9
  variants: {
9
- dark: {
10
- true: 'dark:bg-fd-accent dark:text-fd-accent-foreground',
11
- false: 'bg-fd-accent text-fd-accent-foreground dark:bg-transparent dark:text-fd-muted-foreground',
10
+ active: {
11
+ true: 'bg-fd-accent text-fd-accent-foreground',
12
+ false: 'text-fd-muted-foreground',
12
13
  },
13
14
  },
14
15
  });
15
- export function ThemeToggle({ className, ...props }) {
16
- const { setTheme, resolvedTheme } = useTheme();
17
- const onToggle = () => {
18
- setTheme(resolvedTheme === 'dark' ? 'light' : 'dark');
19
- };
20
- return (_jsxs("button", { type: "button", className: cn('inline-flex items-center rounded-full border p-[3px]', className), "data-theme-toggle": "", "aria-label": "Toggle Theme", onClick: onToggle, ...props, children: [_jsx(Sun, { className: cn(buttonVariants({ dark: false })) }), _jsx(Moon, { className: cn(buttonVariants({ dark: true })) })] }));
16
+ export function ThemeToggle({ className, mode = 'light-dark', ...props }) {
17
+ const { setTheme, theme, resolvedTheme } = useTheme();
18
+ const [mounted, setMounted] = useState(false);
19
+ useLayoutEffect(() => {
20
+ setMounted(true);
21
+ }, []);
22
+ const container = cn('inline-flex items-center rounded-full border p-[3px]', className);
23
+ if (mode === 'light-dark') {
24
+ const value = mounted ? resolvedTheme : null;
25
+ return (_jsxs("button", { className: container, onClick: () => setTheme(value === 'light' ? 'dark' : 'light'), "data-theme-toggle": "", ...props, children: [_jsx(Sun, { className: cn(itemVariants({ active: value === 'light' })) }), _jsx(Moon, { className: cn(itemVariants({ active: value === 'dark' })) })] }));
26
+ }
27
+ const value = mounted ? theme : null;
28
+ return (_jsx("div", { className: container, "data-theme-toggle": "", ...props, children: [
29
+ ['light', Sun],
30
+ ['dark', Moon],
31
+ ['system', Airplay],
32
+ ].map(([key, Icon]) => (_jsx("button", { "aria-label": key, className: cn(itemVariants({ active: value === key })), onClick: () => setTheme(key), children: _jsx(Icon, { className: "size-full" }) }, key))) }));
21
33
  }
@@ -1,8 +1,8 @@
1
1
  import type { ReactNode } from 'react';
2
- export declare function Steps({ children, }: {
2
+ export declare function Steps({ children }: {
3
3
  children: ReactNode;
4
- }): React.ReactElement;
5
- export declare function Step({ children, }: {
4
+ }): import("react/jsx-runtime").JSX.Element;
5
+ export declare function Step({ children }: {
6
6
  children: ReactNode;
7
- }): React.ReactElement;
7
+ }): import("react/jsx-runtime").JSX.Element;
8
8
  //# sourceMappingURL=steps.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"steps.d.ts","sourceRoot":"","sources":["../../src/components/steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,KAAK,CAAC,EACpB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,KAAK,CAAC,YAAY,CAErB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,GACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,KAAK,CAAC,YAAY,CAErB"}
1
+ {"version":3,"file":"steps.d.ts","sourceRoot":"","sources":["../../src/components/steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,wBAAgB,KAAK,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAE1D;AAED,wBAAgB,IAAI,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAEzD"}
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- export function Steps({ children, }) {
3
- return _jsx("div", { className: "steps", children: children });
2
+ export function Steps({ children }) {
3
+ return _jsx("div", { className: "fd-steps", children: children });
4
4
  }
5
- export function Step({ children, }) {
6
- return _jsx("div", { className: "step", children: children });
5
+ export function Step({ children }) {
6
+ return _jsx("div", { className: "fd-step", children: children });
7
7
  }
@@ -2,7 +2,7 @@ import * as React from 'react';
2
2
  import * as Primitive from '@radix-ui/react-navigation-menu';
3
3
  declare const NavigationMenu: React.ForwardRefExoticComponent<Primitive.NavigationMenuProps & React.RefAttributes<HTMLElement>>;
4
4
  declare const NavigationMenuList: React.ForwardRefExoticComponent<Primitive.NavigationMenuListProps & React.RefAttributes<HTMLUListElement>>;
5
- declare const NavigationMenuItem: React.ForwardRefExoticComponent<Primitive.NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>>;
5
+ declare const NavigationMenuItem: React.ForwardRefExoticComponent<Omit<Primitive.NavigationMenuItemProps & React.RefAttributes<HTMLLIElement>, "ref"> & React.RefAttributes<HTMLLIElement>>;
6
6
  declare const NavigationMenuTrigger: React.ForwardRefExoticComponent<Omit<Primitive.NavigationMenuTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
7
7
  declare const NavigationMenuContent: React.ForwardRefExoticComponent<Omit<Primitive.NavigationMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
8
8
  declare const NavigationMenuLink: React.ForwardRefExoticComponent<Primitive.NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>>;
@@ -1 +1 @@
1
- {"version":3,"file":"navigation-menu.d.ts","sourceRoot":"","sources":["../../../src/components/ui/navigation-menu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,SAAS,MAAM,iCAAiC,CAAC;AAG7D,QAAA,MAAM,cAAc,mGAAiB,CAAC;AAEtC,QAAA,MAAM,kBAAkB,4GAAiB,CAAC;AAE1C,QAAA,MAAM,kBAAkB,yGAAiB,CAAC;AAE1C,QAAA,MAAM,qBAAqB,sKAWzB,CAAC;AAGH,QAAA,MAAM,qBAAqB,gKAYzB,CAAC;AAGH,QAAA,MAAM,kBAAkB,6GAAiB,CAAC;AAE1C,QAAA,MAAM,sBAAsB,iKAa1B,CAAC;AAGH,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,EACrB,kBAAkB,EAClB,sBAAsB,GACvB,CAAC"}
1
+ {"version":3,"file":"navigation-menu.d.ts","sourceRoot":"","sources":["../../../src/components/ui/navigation-menu.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,SAAS,MAAM,iCAAiC,CAAC;AAG7D,QAAA,MAAM,cAAc,mGAAiB,CAAC;AAEtC,QAAA,MAAM,kBAAkB,4GAAiB,CAAC;AAE1C,QAAA,MAAM,kBAAkB,2JAWtB,CAAC;AAIH,QAAA,MAAM,qBAAqB,sKAWzB,CAAC;AAGH,QAAA,MAAM,qBAAqB,gKAYzB,CAAC;AAGH,QAAA,MAAM,kBAAkB,6GAAiB,CAAC;AAE1C,QAAA,MAAM,sBAAsB,iKAa1B,CAAC;AAGH,OAAO,EACL,cAAc,EACd,kBAAkB,EAClB,kBAAkB,EAClB,qBAAqB,EACrB,qBAAqB,EACrB,kBAAkB,EAClB,sBAAsB,GACvB,CAAC"}
@@ -1,10 +1,12 @@
1
+ 'use client';
1
2
  import { jsx as _jsx } from "react/jsx-runtime";
2
3
  import * as React from 'react';
3
4
  import * as Primitive from '@radix-ui/react-navigation-menu';
4
5
  import { cn } from '../../utils/cn';
5
6
  const NavigationMenu = Primitive.Root;
6
7
  const NavigationMenuList = Primitive.List;
7
- const NavigationMenuItem = Primitive.Item;
8
+ const NavigationMenuItem = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(Primitive.NavigationMenuItem, { ref: ref, className: cn('list-none', className), ...props, children: children })));
9
+ NavigationMenuItem.displayName = Primitive.NavigationMenuItem.displayName;
8
10
  const NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(Primitive.Trigger, { ref: ref, className: cn('data-[state=open]:bg-fd-accent/50', className), ...props, children: children })));
9
11
  NavigationMenuTrigger.displayName = Primitive.Trigger.displayName;
10
12
  const NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(Primitive.Content, { ref: ref, className: cn('absolute inset-x-0 top-0 data-[motion=from-end]:animate-fd-enterFromRight data-[motion=from-start]:animate-fd-enterFromLeft data-[motion=to-end]:animate-fd-exitToRight data-[motion=to-start]:animate-fd-exitToLeft', className), ...props })));
@@ -1 +1 @@
1
- {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CASlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAarD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CA8BjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAyB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}
1
+ {"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../src/layouts/docs/sidebar.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,oBAAoB,EAEzB,KAAK,cAAc,EAEnB,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AACf,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAU1D,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,6BAA6B,CAAC;AAInE,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACxB,MAAM,6BAA6B,CAAC;AAGrC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAE/D,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC/D;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA6BD,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,2CAqDrD;AAED,wBAAgB,OAAO,CAAC,EACtB,gBAAoB,EACpB,QAAe,EACf,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,GAAG;IAAE,KAAK,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;CAAE,2CAuC3D;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CASlE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,cAAc,CAAC,2CAYlE;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,eAAe,2CAarD;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,cAAc,CAAC,oBAAoB,CAAC,2CAY3E;AAED,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE,SAAS,GAAG;IACb,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB,2CAiBA;AAED,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE;IACD,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,2CAgBA;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAelE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,SAAS,2CA8BjD;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,uBAAuB,2CAQlE;AAED,wBAAgB,sBAAsB,CACpC,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,2CAwB/C;AAgBD;;GAEG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACzC,eA0CA"}
@@ -14,11 +14,11 @@ import { useSidebar } from '../../contexts/sidebar';
14
14
  import { buttonVariants } from '../../components/ui/button';
15
15
  import { cva } from 'class-variance-authority';
16
16
  import { useTreeContext, useTreePath } from '../../contexts/tree';
17
- const itemVariants = cva('flex flex-row items-center gap-2 rounded-md p-2 text-fd-muted-foreground [overflow-wrap:anywhere] md:py-1.5 [&_svg]:size-4', {
17
+ const itemVariants = cva('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', {
18
18
  variants: {
19
19
  active: {
20
20
  true: 'bg-fd-primary/10 font-medium text-fd-primary',
21
- false: 'transition-colors duration-100 hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',
21
+ false: 'transition-colors hover:bg-fd-accent/50 hover:text-fd-accent-foreground/80 hover:transition-none',
22
22
  },
23
23
  },
24
24
  });
@@ -122,7 +122,7 @@ export function SidebarCollapseTrigger(props) {
122
122
  return (_jsx("button", { type: "button", "aria-label": "Collapse Sidebar", "data-collapsed": collapsed, ...props, className: cn(buttonVariants({
123
123
  color: 'ghost',
124
124
  size: 'icon',
125
- }), 'backdrop-blur-lg', props.className), onClick: () => {
125
+ }), props.className), onClick: () => {
126
126
  setCollapsed((prev) => !prev);
127
127
  }, children: props.children ?? _jsx(SidebarIcon, {}) }));
128
128
  }
@@ -32,7 +32,7 @@ export function DocsLayout({ nav: { enabled: navEnabled = true, component: navRe
32
32
  return (_jsx(TreeContextProvider, { tree: props.tree, children: _jsxs(NavProvider, { transparentMode: transparentMode, children: [replaceOrDefault({ enabled: navEnabled, component: navReplace }, _jsxs(Navbar, { className: "md:hidden", children: [_jsx(Title, { url: nav.url, title: nav.title }), _jsx("div", { className: "flex flex-1 flex-row items-center gap-1", children: nav.children }), _jsx(SearchOnly, { children: _jsx(SearchToggle, {}) }), _jsx(NavbarSidebarTrigger, { className: "-me-2 md:hidden" })] }), nav), _jsxs("main", { id: "nd-docs-layout", ...props.containerProps, className: cn('flex flex-1 flex-row pe-[var(--fd-layout-offset)]', variables, props.containerProps?.className), style: {
33
33
  ...layoutVariables,
34
34
  ...props.containerProps?.style,
35
- }, children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 z-30 data-[collapsed=false]:hidden max-md:hidden", style: {
35
+ }, children: [collapsible ? (_jsx(SidebarCollapseTrigger, { className: "fixed bottom-3 z-30 backdrop-blur-lg data-[collapsed=false]:hidden max-md:hidden", style: {
36
36
  insetInlineStart: 'calc(var(--fd-layout-offset) + 0.5rem)',
37
37
  } })) : null, replaceOrDefault({ enabled: sidebarEnabled, component: sidebarReplace }, _jsxs(Aside, { ...sidebar, className: cn('md:ps-[var(--fd-layout-offset)]', sidebar.className), children: [_jsxs(SidebarHeader, { children: [_jsx(SidebarHeaderItems, { ...nav, links: links }), sidebarBanner, tabs.length > 0 ? (_jsx(RootToggle, { options: tabs, className: "-mx-2" })) : null, !sidebarHideSearch ? (_jsx(SearchOnly, { children: _jsx(LargeSearchToggle, { className: "rounded-lg max-md:hidden" }) })) : null] }), _jsxs(SidebarViewport, { children: [_jsx("div", { className: "pt-4 empty:hidden md:hidden", children: links
38
38
  .filter((v) => v.type !== 'icon')
@@ -1,6 +1,16 @@
1
1
  import { type LinkItemType } from '../../layouts/links';
2
+ import { NavigationMenuContent, NavigationMenuTrigger } from '../../components/ui/navigation-menu';
3
+ import type { ComponentPropsWithoutRef } from 'react';
2
4
  export declare function MenuLinkItem({ item, ...props }: {
3
5
  item: LinkItemType;
4
6
  className?: string;
5
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;
6
16
  //# sourceMappingURL=menu.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/menu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AA0BlE,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,2CA2CA"}
1
+ {"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/menu.tsx"],"names":[],"mappings":"AACA,OAAO,EAAgB,KAAK,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAElE,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,2CA6CA;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,2CAgBA;AAED,wBAAgB,WAAW,CACzB,KAAK,EAAE,wBAAwB,CAAC,OAAO,qBAAqB,CAAC,2CAU9D"}
@@ -1,8 +1,8 @@
1
1
  'use client';
2
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import { BaseLinkItem } from '../../layouts/links';
4
4
  import { cn } from '../../utils/cn';
5
- import { NavigationMenuLink } from '../../components/ui/navigation-menu';
5
+ import { NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuTrigger, } from '../../components/ui/navigation-menu';
6
6
  import Link from 'fumadocs-core/link';
7
7
  import { cva } from 'class-variance-authority';
8
8
  import { buttonVariants } from '../../components/ui/button';
@@ -27,7 +27,19 @@ const menuItemVariants = cva('', {
27
27
  export function MenuLinkItem({ item, ...props }) {
28
28
  if (item.type === 'custom')
29
29
  return _jsx("div", { className: cn('grid', props.className), children: item.children });
30
- if (item.type === 'menu')
31
- 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: _jsxs(Link, { href: item.url, children: [item.icon, item.text] }) })) : (_jsxs(_Fragment, { children: [item.icon, item.text] })) }), item.items.map((child, i) => (_jsx(MenuLinkItem, { item: child }, i)))] }));
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, children: header }) })) : (header) }), item.items.map((child, i) => (_jsx(MenuLinkItem, { item: child }, i)))] }));
33
+ }
32
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] }) }));
33
35
  }
36
+ export const Menu = NavigationMenuItem;
37
+ export function MenuTrigger({ enableHover = false, ...props }) {
38
+ return (_jsx(NavigationMenuTrigger, { ...props, onPointerMove: enableHover ? undefined : (e) => e.preventDefault(), className: cn(buttonVariants({
39
+ size: 'icon',
40
+ color: 'ghost',
41
+ }), props.className), children: props.children }));
42
+ }
43
+ export function MenuContent(props) {
44
+ return (_jsx(NavigationMenuContent, { ...props, className: cn('flex flex-col p-4', props.className), children: props.children }));
45
+ }
@@ -4,13 +4,13 @@ import { type LinkProps } from 'fumadocs-core/link';
4
4
  import { BaseLinkItem } from '../../layouts/links';
5
5
  import type { NavigationMenuContentProps, NavigationMenuTriggerProps } from '@radix-ui/react-navigation-menu';
6
6
  export declare function Navbar(props: HTMLAttributes<HTMLElement>): import("react/jsx-runtime").JSX.Element;
7
- export declare const NavbarMenu: import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuItemProps & import("react").RefAttributes<HTMLLIElement>>;
7
+ 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
8
  export declare function NavbarMenuContent(props: NavigationMenuContentProps): import("react/jsx-runtime").JSX.Element;
9
9
  export declare function NavbarMenuTrigger(props: NavigationMenuTriggerProps): import("react/jsx-runtime").JSX.Element;
10
+ export declare function NavbarMenuLink(props: LinkProps): import("react/jsx-runtime").JSX.Element;
10
11
  declare const linkVariants: (props?: ({
11
12
  variant?: "button" | "main" | "icon" | null | undefined;
12
13
  } & import("class-variance-authority/types").ClassProp) | undefined) => string;
13
14
  export declare function NavbarLink({ item, variant, ...props }: ComponentProps<typeof BaseLinkItem> & VariantProps<typeof linkVariants>): import("react/jsx-runtime").JSX.Element;
14
- export declare function NavbarMenuItem(props: LinkProps): import("react/jsx-runtime").JSX.Element;
15
15
  export {};
16
16
  //# sourceMappingURL=navbar.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/navbar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAY,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAU/C,OAAO,KAAK,EACV,0BAA0B,EAC1B,0BAA0B,EAC3B,MAAM,iCAAiC,CAAC;AAOzC,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAwBxD;AAED,eAAO,MAAM,UAAU,6JAAqB,CAAC;AAE7C,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,0BAA0B,2CAYlE;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,0BAA0B,2CASlE;AAED,QAAA,MAAM,YAAY;;8EAiBhB,CAAC;AAEH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,OAAO,EACP,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,YAAY,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,2CAczE;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,SAAS,2CAY9C"}
1
+ {"version":3,"file":"navbar.d.ts","sourceRoot":"","sources":["../../../src/layouts/home/navbar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAY,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAa,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE1D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAU/C,OAAO,KAAK,EACV,0BAA0B,EAC1B,0BAA0B,EAC3B,MAAM,iCAAiC,CAAC;AAOzC,wBAAgB,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,WAAW,CAAC,2CAwBxD;AAED,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;AAED,QAAA,MAAM,YAAY;;8EAiBhB,CAAC;AAEH,wBAAgB,UAAU,CAAC,EACzB,IAAI,EACJ,OAAO,EACP,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,OAAO,YAAY,CAAC,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,2CAczE"}
@@ -22,7 +22,10 @@ export function NavbarMenuContent(props) {
22
22
  export function NavbarMenuTrigger(props) {
23
23
  return (_jsx(NavigationMenuTrigger, { ...props, className: cn(navItemVariants(), 'rounded-md', props.className), children: props.children }));
24
24
  }
25
- const linkVariants = cva(undefined, {
25
+ export function NavbarMenuLink(props) {
26
+ 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 }) }));
27
+ }
28
+ const linkVariants = cva('', {
26
29
  variants: {
27
30
  variant: {
28
31
  main: navItemVariants(),
@@ -41,8 +44,5 @@ const linkVariants = cva(undefined, {
41
44
  },
42
45
  });
43
46
  export function NavbarLink({ item, variant, ...props }) {
44
- return (_jsx(NavigationMenuItem, { className: "list-none", children: _jsx(NavigationMenuLink, { asChild: true, children: _jsx(BaseLinkItem, { ...props, item: item, className: cn(linkVariants({ variant }), props.className), children: props.children }) }) }));
45
- }
46
- export function NavbarMenuItem(props) {
47
- 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) }) }));
47
+ return (_jsx(NavigationMenuItem, { children: _jsx(NavigationMenuLink, { asChild: true, children: _jsx(BaseLinkItem, { ...props, item: item, className: cn(linkVariants({ variant }), props.className), children: props.children }) }) }));
48
48
  }
@@ -1,5 +1,13 @@
1
1
  import type { HTMLAttributes } from 'react';
2
+ import { type NavOptions } from '../layouts/shared';
2
3
  import { type BaseLayoutProps } from './shared';
3
- export type HomeLayoutProps = BaseLayoutProps & HTMLAttributes<HTMLElement>;
4
+ export interface HomeLayoutProps extends BaseLayoutProps, HTMLAttributes<HTMLElement> {
5
+ nav?: Partial<NavOptions & {
6
+ /**
7
+ * Open mobile menu when hovering the trigger
8
+ */
9
+ enableHoverToOpen?: boolean;
10
+ }>;
11
+ }
4
12
  export declare function HomeLayout(props: HomeLayoutProps): import("react/jsx-runtime").JSX.Element;
5
13
  //# sourceMappingURL=home.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"home.d.ts","sourceRoot":"","sources":["../../src/layouts/home.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAG5C,OAAO,EAAY,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AAgC1D,MAAM,MAAM,eAAe,GAAG,eAAe,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;AAE5E,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CA0BhD"}
1
+ {"version":3,"file":"home.d.ts","sourceRoot":"","sources":["../../src/layouts/home.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,KAAK,UAAU,EAAoB,MAAM,kBAAkB,CAAC;AAErE,OAAO,EAAY,KAAK,eAAe,EAAE,MAAM,UAAU,CAAC;AA+B1D,MAAM,WAAW,eACf,SAAQ,eAAe,EACrB,cAAc,CAAC,WAAW,CAAC;IAC7B,GAAG,CAAC,EAAE,OAAO,CACX,UAAU,GAAG;QACX;;WAEG;QACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;KAC7B,CACF,CAAC;CACH;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CA0BhD"}
@@ -3,16 +3,15 @@ import { replaceOrDefault } from '../layouts/shared';
3
3
  import { cn } from '../utils/cn';
4
4
  import { getLinks } from './shared';
5
5
  import { NavProvider, Title } from '../components/layout/nav';
6
- import { NavigationMenuContent, NavigationMenuItem, NavigationMenuList, NavigationMenuTrigger, } from '../components/ui/navigation-menu';
7
- import { Navbar, NavbarLink, NavbarMenu, NavbarMenuContent, NavbarMenuItem, NavbarMenuTrigger, } from '../layouts/home/navbar';
6
+ import { NavigationMenuList } from '../components/ui/navigation-menu';
7
+ import { Navbar, NavbarLink, NavbarMenu, NavbarMenuContent, NavbarMenuLink, NavbarMenuTrigger, } from '../layouts/home/navbar';
8
8
  import { LargeSearchToggle, SearchToggle, } from '../components/layout/search-toggle';
9
9
  import { ThemeToggle } from '../components/layout/theme-toggle';
10
10
  import { LanguageToggle, LanguageToggleText, } from '../components/layout/language-toggle';
11
11
  import { ChevronDown, Languages } from 'lucide-react';
12
- import { buttonVariants } from '../components/ui/button';
13
12
  import { SearchOnly } from '../contexts/search';
14
13
  import Link from 'fumadocs-core/link';
15
- import { MenuLinkItem } from '../layouts/home/menu';
14
+ import { Menu, MenuContent, MenuLinkItem, MenuTrigger, } from '../layouts/home/menu';
16
15
  export function HomeLayout(props) {
17
16
  const { nav, links, githubUrl, i18n: _i18n, disableThemeSwitch: _disableThemeSwitch, ...rest } = props;
18
17
  const finalLinks = getLinks(links, githubUrl);
@@ -25,10 +24,7 @@ function Header({ nav: { enableSearch = true, ...nav } = {}, i18n = false, final
25
24
  const menuItems = finalLinks.filter((item) => ['menu', 'all'].includes(item.on ?? 'all'));
26
25
  return (_jsxs(Navbar, { children: [_jsx(Title, { title: nav.title, url: nav.url }), nav.children, _jsx(NavigationMenuList, { className: "flex flex-row items-center gap-2 max-sm:hidden", children: navItems
27
26
  .filter((item) => !isSecondary(item))
28
- .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm" }, i))) }), _jsxs("div", { className: "flex flex-1 flex-row items-center justify-end lg:gap-1.5", children: [enableSearch ? (_jsxs(SearchOnly, { children: [_jsx(SearchToggle, { className: "lg:hidden" }), _jsx(LargeSearchToggle, { className: "w-full max-w-[240px] max-lg:hidden" })] })) : null, !disableThemeSwitch ? _jsx(ThemeToggle, { className: "max-lg:hidden" }) : null, i18n ? (_jsx(LanguageToggle, { className: "-me-1.5 max-lg:hidden", children: _jsx(Languages, { className: "size-5" }) })) : null, navItems.filter(isSecondary).map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "-me-1.5 list-none max-lg:hidden" }, i))), _jsxs(NavigationMenuItem, { className: "list-none lg:hidden", children: [_jsx(NavigationMenuTrigger, { className: cn(buttonVariants({
29
- size: 'icon',
30
- color: 'ghost',
31
- }), 'group -me-2'), children: _jsx(ChevronDown, { className: "size-3 transition-transform duration-300 group-data-[state=open]:rotate-180" }) }), _jsxs(NavigationMenuContent, { className: "flex flex-col p-4 sm:flex-row sm:items-center sm:justify-end", children: [menuItems
27
+ .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm" }, i))) }), _jsxs("div", { className: "flex flex-1 flex-row items-center justify-end lg:gap-1.5", children: [enableSearch ? (_jsxs(SearchOnly, { children: [_jsx(SearchToggle, { className: "lg:hidden" }), _jsx(LargeSearchToggle, { className: "w-full max-w-[240px] max-lg:hidden" })] })) : null, !disableThemeSwitch ? _jsx(ThemeToggle, { className: "max-lg:hidden" }) : null, i18n ? (_jsx(LanguageToggle, { className: "-me-1.5 max-lg:hidden", children: _jsx(Languages, { className: "size-5" }) })) : null, navItems.filter(isSecondary).map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "-me-1.5 max-lg:hidden" }, i))), _jsxs(Menu, { className: "lg:hidden", children: [_jsx(MenuTrigger, { className: "group -me-2", enableHover: nav.enableHoverToOpen, children: _jsx(ChevronDown, { className: "size-3 transition-transform duration-300 group-data-[state=open]:rotate-180" }) }), _jsxs(MenuContent, { className: "sm:flex-row sm:items-center sm:justify-end", children: [menuItems
32
28
  .filter((item) => !isSecondary(item))
33
29
  .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, !disableThemeSwitch ? _jsx(ThemeToggle, {}) : null] })] })] })] })] }));
34
30
  }
@@ -40,7 +36,7 @@ function NavbarLinkItem({ item, ...props }) {
40
36
  if (child.type === 'custom')
41
37
  return _jsx("div", { children: child.children }, j);
42
38
  const { banner, footer, ...rest } = child.menu ?? {};
43
- return (_jsxs(NavbarMenuItem, { href: child.url, ...rest, children: [banner ??
39
+ return (_jsxs(NavbarMenuLink, { href: child.url, ...rest, children: [banner ??
44
40
  (child.icon ? (_jsx("div", { className: "w-fit rounded-md border bg-fd-muted p-1 [&_svg]:size-4", children: child.icon })) : null), _jsx("p", { className: "-mb-1 text-sm font-medium", children: child.text }), child.description ? (_jsx("p", { className: "text-[13px] text-fd-muted-foreground", children: child.description })) : null, footer] }, j));
45
41
  });
46
42
  return (_jsxs(NavbarMenu, { children: [_jsx(NavbarMenuTrigger, { ...props, children: item.url ? _jsx(Link, { href: item.url, children: item.text }) : item.text }), _jsx(NavbarMenuContent, { children: children })] }));
@@ -13,7 +13,7 @@ export function Navbar(props) {
13
13
  paddingInlineStart: collapsed
14
14
  ? 'calc(var(--fd-layout-offset))'
15
15
  : 'calc(var(--fd-layout-offset) + var(--fd-sidebar-width))',
16
- }, children: _jsx("div", { className: "mx-auto flex size-full flex-row items-center border-b border-fd-foreground/10 px-4 md:gap-1.5 lg:px-8", children: props.children }) }));
16
+ }, children: _jsx("div", { className: "mx-auto flex size-full flex-row items-center border-b border-fd-foreground/10 px-4 md:gap-1.5", children: props.children }) }));
17
17
  }
18
18
  export function NavbarSidebarTrigger(props) {
19
19
  const { open } = useSidebar();
@@ -25,7 +25,7 @@ export function DocsLayout({ nav: { transparentMode, ...nav } = {}, sidebar: { c
25
25
  const tabs = getSidebarTabsFromOptions(tabOptions, props.tree) ?? [];
26
26
  const variables = cn('[--fd-nav-height:3.5rem] [--fd-tocnav-height:36px] md:[--fd-sidebar-width:268px] xl:[--fd-toc-width:268px] xl:[--fd-tocnav-height:0px]');
27
27
  const pageStyles = {
28
- tocNav: cn('lg:px-4 xl:hidden'),
28
+ tocNav: cn('xl:hidden'),
29
29
  toc: cn('max-xl:hidden'),
30
30
  page: cn('mt-[var(--fd-nav-height)]'),
31
31
  };
@@ -39,7 +39,7 @@ function DocsNavbar({ sidebarCollapsible, links, nav = {}, i18n, }) {
39
39
  .filter((item) => item.type !== 'icon')
40
40
  .map((item, i) => (_jsx(NavbarLinkItem, { item: item, className: "text-sm text-fd-muted-foreground transition-colors hover:text-fd-accent-foreground max-lg:hidden" }, i))), nav.children] }), _jsx(SearchOnly, { children: _jsx(SearchToggle, { className: "md:hidden" }) }), _jsx(NavbarSidebarTrigger, { className: "-me-1.5 md:hidden" }), _jsx("div", { className: "flex flex-row items-center empty:hidden max-lg:hidden", children: links
41
41
  .filter((item) => item.type === 'icon')
42
- .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon', color: 'ghost' }), 'text-fd-muted-foreground'), "aria-label": item.label, children: item.icon }, i))) }), i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-5" }) })) : null, _jsx(ThemeToggle, { className: "p-0 max-md:hidden" })] }));
42
+ .map((item, i) => (_jsx(BaseLinkItem, { item: item, className: cn(buttonVariants({ size: 'icon', color: 'ghost' }), 'text-fd-muted-foreground'), "aria-label": item.label, children: item.icon }, i))) }), i18n ? (_jsx(LanguageToggle, { children: _jsx(Languages, { className: "size-5" }) })) : null, _jsx(ThemeToggle, { className: "max-md:hidden", mode: "light-dark-system" })] }));
43
43
  }
44
44
  function NavbarLinkItem({ item, ...props }) {
45
45
  if (item.type === 'menu') {
package/dist/style.css CHANGED
@@ -1232,9 +1232,6 @@ body {
1232
1232
  .h-14 {
1233
1233
  height: 3.5rem;
1234
1234
  }
1235
- .h-\[var\(--fd-banner-height\)\] {
1236
- height: var(--fd-banner-height);
1237
- }
1238
1235
  .h-\[var\(--fd-height\)\] {
1239
1236
  height: var(--fd-height);
1240
1237
  }
@@ -1899,6 +1896,35 @@ body {
1899
1896
  .prose-no-margin > :last-child {
1900
1897
  margin-bottom: 0;
1901
1898
  }
1899
+ .fd-steps {
1900
+ counter-reset: step;
1901
+ border-left-width: 1px;
1902
+ margin-left: 1rem;
1903
+ padding-left: 1.75rem;
1904
+ position: relative;
1905
+ }
1906
+ .fd-step:before {
1907
+ background-color: hsl(var(--fd-secondary) / 1);
1908
+ color: hsl(var(--fd-secondary-foreground) / 1);
1909
+ content: counter(step);
1910
+ counter-increment: step;
1911
+ border-radius: 9999px;
1912
+ justify-content: center;
1913
+ align-items: center;
1914
+ width: 2rem;
1915
+ height: 2rem;
1916
+ font-size: .875rem;
1917
+ line-height: 1.25rem;
1918
+ display: flex;
1919
+ position: absolute;
1920
+ left: -1rem;
1921
+ }
1922
+ .prose-no-margin > :first-child {
1923
+ margin-top: 0;
1924
+ }
1925
+ .prose-no-margin > :last-child {
1926
+ margin-bottom: 0;
1927
+ }
1902
1928
  .\[--fd-nav-height\:3\.5rem\] {
1903
1929
  --fd-nav-height: 3.5rem;
1904
1930
  }
@@ -2321,25 +2347,6 @@ body {
2321
2347
  background-color: var(--shiki-dark-bg);
2322
2348
  }
2323
2349
 
2324
- .dark\:bg-fd-accent:is(.dark *) {
2325
- --tw-bg-opacity: 1;
2326
- background-color: hsl(var(--fd-accent) / var(--tw-bg-opacity, 1));
2327
- }
2328
-
2329
- .dark\:bg-transparent:is(.dark *) {
2330
- background-color: transparent;
2331
- }
2332
-
2333
- .dark\:text-fd-accent-foreground:is(.dark *) {
2334
- --tw-text-opacity: 1;
2335
- color: hsl(var(--fd-accent-foreground) / var(--tw-text-opacity, 1));
2336
- }
2337
-
2338
- .dark\:text-fd-muted-foreground:is(.dark *) {
2339
- --tw-text-opacity: 1;
2340
- color: hsl(var(--fd-muted-foreground) / var(--tw-text-opacity, 1));
2341
- }
2342
-
2343
2350
  @media not all and (min-width: 1280px) {
2344
2351
 
2345
2352
  .max-xl\:hidden {
@@ -2553,11 +2560,6 @@ body {
2553
2560
  border-width: 1px;
2554
2561
  }
2555
2562
 
2556
- .lg\:px-4 {
2557
- padding-left: 1rem;
2558
- padding-right: 1rem;
2559
- }
2560
-
2561
2563
  .lg\:px-8 {
2562
2564
  padding-left: 2rem;
2563
2565
  padding-right: 2rem;
@@ -2628,3 +2630,7 @@ body {
2628
2630
  width: 1.25rem;
2629
2631
  height: 1.25rem;
2630
2632
  }
2633
+
2634
+ .\[\&_svg\]\:shrink-0 svg {
2635
+ flex-shrink: 0;
2636
+ }
@@ -31,6 +31,12 @@ export interface DocsUIOptions extends Pick<TypographyOptions, 'disableRoundedTa
31
31
  */
32
32
  preset?: keyof typeof presets | Preset;
33
33
  typography?: TypographyOptions;
34
+ /**
35
+ * Add Fumadocs UI `fd-*` utilities
36
+ *
37
+ * @defaultValue true
38
+ */
39
+ addGlobalUtils?: boolean;
34
40
  }
35
41
  type Keys = 'background' | 'foreground' | 'muted' | 'muted-foreground' | 'popover' | 'popover-foreground' | 'card' | 'card-foreground' | 'border' | 'primary' | 'primary-foreground' | 'secondary' | 'secondary-foreground' | 'accent' | 'accent-foreground' | 'ring';
36
42
  type Theme = Record<Keys, string>;
@@ -1 +1 @@
1
- {"version":3,"file":"tailwind-plugin.d.ts","sourceRoot":"","sources":["../src/tailwind-plugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EACL,KAAK,OAAO,IAAI,iBAAiB,EACjC,UAAU,EACX,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,qBAAqB,CAAC;IACtD;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,GAAG,MAAM,CAAC;IAEvC,UAAU,CAAC,EAAE,iBAAiB,CAAC;CAChC;AAED,KAAK,IAAI,GACL,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,SAAS,GACT,oBAAoB,GACpB,MAAM,GACN,iBAAiB,GACjB,QAAQ,GACR,SAAS,GACT,oBAAoB,GACpB,WAAW,GACX,sBAAsB,GACtB,QAAQ,GACR,mBAAmB,GACnB,MAAM,CAAC;AAEX,KAAK,KAAK,GAAG,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAkDD,eAAO,MAAM,MAAM;;;cApHH,CAAC;;;CA6QhB,CAAC;AAEF,wBAAgB,YAAY,CAAC,OAAO,GAAE,aAAkB,GAAG,aAAa,CAWvE;AAED,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC"}
1
+ {"version":3,"file":"tailwind-plugin.d.ts","sourceRoot":"","sources":["../src/tailwind-plugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EACL,KAAK,OAAO,IAAI,iBAAiB,EACjC,UAAU,EACX,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,qBAAqB,CAAC;IACtD;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,OAAO,GAAG,MAAM,CAAC;IAEvC,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAG/B;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,KAAK,IAAI,GACL,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,kBAAkB,GAClB,SAAS,GACT,oBAAoB,GACpB,MAAM,GACN,iBAAiB,GACjB,QAAQ,GACR,SAAS,GACT,oBAAoB,GACpB,WAAW,GACX,sBAAsB,GACtB,QAAQ,GACR,mBAAmB,GACnB,MAAM,CAAC;AAEX,KAAK,KAAK,GAAG,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,CAAC;AAElC,MAAM,WAAW,MAAM;IACrB,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,KAAK,CAAC;IACZ,GAAG,CAAC,EAAE,aAAa,CAAC;CACrB;AAwFD,eAAO,MAAM,MAAM;;;cAlKH,CAAC;;;CAoShB,CAAC;AAEF,wBAAgB,YAAY,CAAC,OAAO,GAAE,aAAkB,GAAG,aAAa,CAWvE;AAED,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC"}
@@ -37,7 +37,43 @@ function createTailwindColors(prefix, cloneToGlobal) {
37
37
  }
38
38
  return Object.fromEntries(v.entries());
39
39
  }
40
- export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default', layoutWidth = '100vw' } = {}) => {
40
+ function createTailwindUtilities(prefix) {
41
+ const append = prefix.length > 0 ? prefix + '-' : prefix;
42
+ return {
43
+ [`.${append}steps`]: {
44
+ 'counter-reset': 'step',
45
+ 'border-left-width': '1px',
46
+ 'margin-left': '1rem',
47
+ 'padding-left': '1.75rem',
48
+ position: 'relative',
49
+ },
50
+ [`.${append}step:before`]: {
51
+ 'background-color': `theme('colors.fd-secondary.DEFAULT')`,
52
+ color: `theme('colors.fd-secondary.foreground')`,
53
+ content: 'counter(step)',
54
+ 'counter-increment': 'step',
55
+ 'border-radius': `theme('borderRadius.full')`,
56
+ 'justify-content': 'center',
57
+ 'align-items': 'center',
58
+ width: '2rem',
59
+ height: '2rem',
60
+ 'font-size': '.875rem',
61
+ 'line-height': '1.25rem',
62
+ display: 'flex',
63
+ position: 'absolute',
64
+ left: '-1rem',
65
+ },
66
+ '.prose-no-margin': {
67
+ '& > :first-child': {
68
+ marginTop: '0',
69
+ },
70
+ '& > :last-child': {
71
+ marginBottom: '0',
72
+ },
73
+ },
74
+ };
75
+ }
76
+ export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default', layoutWidth = '100vw', addGlobalUtils = true, } = {}) => {
41
77
  return ({ addBase, addComponents, addUtilities }) => {
42
78
  const { light, dark, css } = typeof preset === 'string' ? presets[preset] : preset;
43
79
  addBase({
@@ -118,39 +154,10 @@ export const docsUi = plugin.withOptions(({ cssPrefix = 'fd', preset = 'default'
118
154
  borderRadius: '2px',
119
155
  },
120
156
  });
121
- addUtilities({
122
- '.steps': {
123
- 'counter-reset': 'step',
124
- 'border-left-width': '1px',
125
- 'margin-left': '1rem',
126
- 'padding-left': '1.75rem',
127
- position: 'relative',
128
- },
129
- '.step:before': {
130
- 'background-color': `theme('colors.fd-secondary.DEFAULT')`,
131
- color: `theme('colors.fd-secondary.foreground')`,
132
- content: 'counter(step)',
133
- 'counter-increment': 'step',
134
- 'border-radius': `theme('borderRadius.full')`,
135
- 'justify-content': 'center',
136
- 'align-items': 'center',
137
- width: '2rem',
138
- height: '2rem',
139
- 'font-size': '.875rem',
140
- 'line-height': '1.25rem',
141
- display: 'flex',
142
- position: 'absolute',
143
- left: '-1rem',
144
- },
145
- '.prose-no-margin': {
146
- '& > :first-child': {
147
- marginTop: '0',
148
- },
149
- '& > :last-child': {
150
- marginBottom: '0',
151
- },
152
- },
153
- });
157
+ if (addGlobalUtils) {
158
+ addUtilities(createTailwindUtilities(''));
159
+ }
160
+ addUtilities(createTailwindUtilities('fd'));
154
161
  };
155
162
  }, ({ cssPrefix = 'fd', modifyContainer = true, addGlobalColors = false, } = {}) => ({
156
163
  theme: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fumadocs-ui",
3
- "version": "14.7.3",
3
+ "version": "14.7.5",
4
4
  "description": "The framework for building a documentation website in Next.js",
5
5
  "keywords": [
6
6
  "NextJs",
@@ -63,34 +63,34 @@
63
63
  "@radix-ui/react-tabs": "^1.1.2",
64
64
  "class-variance-authority": "^0.7.1",
65
65
  "lodash.merge": "^4.6.2",
66
- "lucide-react": "^0.469.0",
66
+ "lucide-react": "^0.473.0",
67
67
  "next-themes": "^0.4.4",
68
68
  "postcss-selector-parser": "^7.0.0",
69
69
  "react-medium-image-zoom": "^5.2.13",
70
70
  "tailwind-merge": "^2.6.0"
71
71
  },
72
72
  "devDependencies": {
73
- "@next/eslint-plugin-next": "^15.1.4",
73
+ "@next/eslint-plugin-next": "^15.1.5",
74
74
  "@types/lodash.merge": "^4.6.9",
75
- "@types/react": "^19.0.4",
76
- "@types/react-dom": "^19.0.2",
75
+ "@types/react": "^19.0.7",
76
+ "@types/react-dom": "^19.0.3",
77
77
  "autoprefixer": "^10.4.20",
78
- "next": "15.1.4",
79
- "postcss": "^8.4.49",
78
+ "next": "15.1.5",
79
+ "postcss": "^8.5.1",
80
80
  "postcss-cli": "^11.0.0",
81
81
  "tailwindcss": "^3.4.17",
82
82
  "tsc-alias": "^1.8.10",
83
- "@fumadocs/cli": "0.0.6",
84
83
  "eslint-config-custom": "0.0.0",
85
- "fumadocs-core": "14.7.3",
86
- "tsconfig": "0.0.0"
84
+ "fumadocs-core": "14.7.5",
85
+ "tsconfig": "0.0.0",
86
+ "@fumadocs/cli": "0.0.7"
87
87
  },
88
88
  "peerDependencies": {
89
89
  "next": "14.x.x || 15.x.x",
90
90
  "react": "18.x.x || 19.x.x",
91
91
  "react-dom": "18.x.x || 19.x.x",
92
92
  "tailwindcss": "^3.4.14",
93
- "fumadocs-core": "14.7.3"
93
+ "fumadocs-core": "14.7.5"
94
94
  },
95
95
  "peerDependenciesMeta": {
96
96
  "tailwindcss": {